Continuando con el analisis de nuestro blog http://laboratoriodemouse.blogspot.com/, utilice para una mejor visualizacion el programa notepad2, ya que nos colorea el codigo, aspecto importante para analizar tranquilamente el codigo. Elimine tambien por el momento el CSS, las variables y demas secciones, las cuales las veremos con detalle en otros post, se dejo solamente la estructura basica de la plantilla.
Explicacion por linea de codigo:
1: Aqui se define el tipo de XML version 1.0 y el tipo de codificacion de los caracteres UTF-8 (8-bit Unicode Transformation Format)
2: Declaracion DOCTYPE: indica que version de XHTML se usa en la pagina, de forma que los navegadores pueden saber que sintaxis y gramatica se usa y los validadores puedan comprobar su validez. Para ello la declaración indica un DTD contra el cual se puede realizar la validación.
3: Se hace referencia al espacio nominal de xhtml: se le indica al navegador que los elementos que siguen son de XHTML y no de otro lenguaje basado en XML.
4-15: Etiqueta HEAD. engloba una serie de sentencias a modo de cabecera como el titulo del blog, codigo CSS.
6: Etiqueta TITLE. contiene el titulo del blog y los titulos de los post
7-14: SKIN. Genera una instruccion style, en este espacio es donde se escribe todo el codigo CSS asi como las variables que se utilizaran en las declaraciones.
17: Body. Es el cuerpo del blog. Es entre esta etiqueta donde se incluyen todas las etiquetas que generaran el blog.
Antes de continuar se debe definir que es la etiqueta DIV: DIV es una etiqueta que permite crear divisiones lógicas en un documento. Cada división es un conjunto formado por diferentes etiquetas html relacionadas entre sí y a los que se les pueden aplicar propiedades comunes. Es dentro de estas etiquetas donde se colocan las "palabras reservadas de blogger" para conformar el esqueleto de la plantilla.
19-37: outer-wrapper. EL fondo de la pagina
20-36: wrap2. Esta no es una palabra reservada, pero la encontre dentro de la plantilla, al igual que Outer, es un contenedor.
22: header-wrapper. Es la cabecera de nuestro blog.
24-32: content-wrapper. contenedor
26: crosscol-wrapper. Es un nuevo agregado de blogger para Adsense, no es visible, pero puede editarse.
28: main-wrapper. Es la columna principal donde van nuestros post, solo debe existir uno.
30: Sidebar-wrapper. Es la barra lateral, puede haber mas de una.
34: footer-wrapper. El pie de pagina, solo debe haber uno.
Notese que toda etiqueta DIV tiene su incio y si fin.
0 comentarios:
Publicar un comentario