Estructura de una pagina web-blog

A menudo cuando te dedicas a exponer temas de posicionamiento o lees artículos de esta tematica, se hace alusión a esta o aquella etiqueta, que si las metas, que si el head, que el title etc.

Lo normal es que el que se interese por temas de posicionamiento tenga unas nociones básicas de la estructura del código de una página o blog web, pero hay veces que alguien consulta algo por curiosidad o porque necesita introducir este o aquel código que se le indica en un post y no tiene ni idea de lo que se le esta hablando.

Pues bien de una manera muy simple y generalizada dire que lo que hay detrás de una página web es una serie de códigos que tienen una estructura definida.

Si abres cualquier página web a través de tu navegador y quieres saber como mirar el código fuente de esa página solo tienes que ir a la barra superior y pulsar sobre la pestaña VER. Se abrira un desplegable y deberás pulsar sobre ver código fuente, presentando algo en la pantalla parecido a esto:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

(DOCTYPE: Document Type Definition---> definición del tipo de documento. No es estrictamente necesaria, con ella se dicta al navegador que tipo de documento html se esta utilizando o va a procesar. Existen varios formatos de esta etiqueta).

<html>

(Hyper text markup Lenguage: Lenguage de marcas de hipertexto. Es el lenguaje que se utiliza para la elaboración de páginas web/blogs )

<head>

(Yo le llamo el cerebro de la página. Lo que va comprendido dentro de esta etiqueta no se ve en los navegadores y aquí van alojadas las principales etiquetas utilizadas para el rastreo de buscadores)

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>

(Con esta etiqueta se dice al navegador que conjunto de caracteres debe tomar para presentar nuestras páginas. ISO-8859-1, es una norma de la ISO "organización Internacional de la estandarización" se define la codificación del alfabeto latino para que se puedan ver acentos,ñ o caracteres especiales. Mas información: http://es.wikipedia.org/wiki/ISO_8859-1)

<meta name="description" content="Aqui va una pequeña descripción del contenido de tu blog o web"/>

<meta name="keywords" content="Aqui la cadena de palabras clave"/>

<meta name="Language" content="idioma de la página" />

<meta name="robots" content="Instrucciones para los robots de búsqueda"/ >

<title>El título principal de mi página web</title>

<style type="text/css">

</style>

(Con las etiquetas <style> se define los estilos que tomara la página web)

</head>

(aquí finaliza el cerebro de la página)

<body>

(Aqui comienza todo lo que vemos cuando abrimos una página web)

</body>

(finaliza el cuerpo de página)

</html>

(finaliza la página web)


Bueno lo que os comente al principio, esto es explicarlo de manera general y para tener una pequeña noción de lo que estamos hablando cuando nos referimos a etiquetas y demás. Cada uno que profundice en la medida de sus posibilidades.

Por si acaso y como es costumbre para los que no tienen tiempo de leer o se apañan mejor con un video, os dejo uno sobre la estructura web:




Otros articulos del blog relacionados:
1.- Como ver el codigo fuente de una web (ir al articulo)
2.- Como capturar color html (ir al articulo)
3.- Como subir imagenes a un foro (ir al articulo)

No hay comentarios:

Publicar un comentario