Diseño es donde la ciencia y el arte llegan a un punto de equilibrio

Robin Mathew

Blog

Noticias y novedades de páginas web y diseño gráfico

Código HTML: Encabezados

Hace un par de semanas comenzamos el ciclo de ‘código HTML' en el que empezamos a ver cómo construir nuestro documento HTML y las primeras pautas para realizar una página web.

Vimos que entre las etiquetas <head> se situaba el título del documento. Aquí también encontraremos el enlace a la hoja de estilos que asociemos a nuestro documento, pero de las hojas de estilo y de código CSS hablaremos en otro momento.

Una vez hemos dejado atrás las etiquetas <head> entramos dentro de las etiquetas <body> y aquí es donde comenzamos a construir verdaderamente nuestro documento web. 

Cuando queremos crear una página web, tenemos que tener en cuenta que el documento HTML que vamos a crear contendrá el esqueleto de la página, y la hoja de estilos es la que nos aportara la información de las formas, tamaños y los colores.

Es decir, en el documento HTML lo único que tenemos que hacer es dejar toda la información que queremos que aparezca, bien etiquetada y organizada, de manera que luego podamos darle forma desde las hojas de estilos.

Las etiquetas de encabezados se utilizan para diferenciar textos o párrafos comunes de otros importantes. Las etiquetas de las cabeceras serian:  H1, H2, H3, H4, H5 y H6. Tienen un orden jerárquico, en el que H1 es el de mayor importancia.

Por ejemplo, lo más común es reservar la etiqueta H1 para el nombre del sitio web. Por ejemplo, en nuestro caso, nuestro H1 seria,  <h1>Hazhistoria :: Diseño web y diseño gráfico</h1>.

Como la etiqueta H1 indica que el texto que se remarca es muy importante, mucha gente tiende a poner textos o palabras clave dentro de etiquetas H1 a lo largo de una página web. Esto es una práctica errónea, y que hará que nuestra página web no valide, y que incluso buscadores como google puedan penalizarnos a la hora del posicionamiento.

Solo puede haber una etiqueta H1 por cada documento HTML. De los demás encabezados si puede haber más de uno, pero siempre en orden jerárquico y después de que hayamos puesto la etiqueta anterior. Es decir, puede haber 2 o 3 etiquetas H2 por ejemplo, pero siempre después de que hayamos puesto una etiqueta H1. Por ejemplo etiquetas H2 pueden ser los elementos de menú de nuestra página web. Aunque también se suelen utilizar para extender la información acerca de la página web.

Este sería nuestro caso, y la etiqueta H2 de nuestra web seria:  <h2>Hazhistoria es una empresa de desarrollo de páginas web y diseño gráfico fundada en 2004 situada en Guadalajara y con delegación en Torrelavega (Cantabria)</h2>.

Es habitual reservar encabezados H3 y H4 para títulos de apartados, títulos de entradas de noticias o blogs, y para textos destacados dentro de un párrafo.

El texto normal, por ejemplo, un artículo como este, ya no se podría considerar un encabezado, e iría dentro de etiquetas <p>, reservadas para párrafos.

Continuaremos con más etiquetas HTML en siguientes artículos.

Volver