Seguimos avanzando en el estudio de HTML5 y CSS3. En esta ocasión voy a explicar la manera correcta de definir las etiquetas de titulo en HTML5. Eso si, con el nuevo estándar establecido por la W3C. Como no, el lenguaje HTML sigue evolucionando y a mi me gusta estar a la ultima, imagino que a ti te ocurre lo mismo.
Las etiquetas de titulo en HTML5
El texto más relevante de la pagina es el que va dentro de <h1>. Esta etiqueta es muy tenida en cuenta por los buscadores a la hora del SEO. Podemos elegir hasta 6 niveles de titulo que van desde <h1> hasta <h6>. Los navegadores asignan tamaños diferentes a estas etiquetas, desde la mayor <h1> hasta el tamaño mas pequeño <h6>.Dependiendo de las secciones que tenga un documento, pueden variar la cantidad de etiquetas <h1>.
La siguiente estructura sería la correcta en un html semantico:<h1>Evolución humana</h1>
Si por ejemplo, un articulo tiene un titular de la noticia y un subtitulo, pondríamos el titulo dentro de <h1> y el subtitulo dentro de <h2>. Si <h2> tubiera por ejemplo dos apartados con sus dos titulos, estos titulos irian dentro de la etiqueta <h3>. <p>La evolución humana u hominización es el proceso de evolución biológica de la especie humana desde sus ancestros hasta la actualidad. El estudio de dicho proceso requiere de un análisis interdisciplinario en el que se complementen conocimientos desde ciencias como la genética, la antropología física, la paleontología, la estratigrafía, la geocronología, la arqueología y la lingüística.</p><h2>Notas sobre taxonomía</h2>
<p>La taxonomía se encarga de la clasificación de los organismos. Por ende, la definición de especie es un aspecto fundamental para clasificar especímenes como pertenecientes a distintas o mismas especies. En organismos vivos es posible definir especies bajo el criterio de la capacidad que tienen distintos individuos de reproducirse y tener descendencia fértil (definición de especie biológica).</p><h2>Aspectos genéticos de la evolución</p>
<h3>Introgresión e hibridación</h3>
<p>La evolución humana u hominización es el proceso de evolución biológica de la especie humana desde sus ancestros hasta la actualidad. El estudio de dicho proceso requiere de un análisis interdisciplinario en el que se complementen conocimientos desde ciencias como la genética, la antropología física, la paleontología, la estratigrafía, la geocronología, la arqueología y la lingüística.</p><h3>Retrovirus endógenos humanos</h3>
<p>Igualmente destaca que los retrovirus endógenos humanos (HERV) (Secuencia de ADN derivado de virus pertenecientes al grupo de los retrovirus) comprenden una parte significativa del genoma humano. Con aproximadamente 98 000 fragmentos y elementos ERV, estos componen casi el 8 % del genoma actual del ser humano, los cuales ha adquirido el ser humano en diferentes periodos temporales de su evolución.</p>
Recomendaciones para el marcado de subtítulos
En la actualidad, la W3C, ha publicado una serie de consejos y recomendaciones. Con estas recomendaciones, se nos indica cual es la forma correcta de marcar subtítulos, títulos alternativos y eslóganes.
Lo primero que nos aconsejan desde el consorcio, es que los elementos h1–h6 no deben ser utilizados para establecer encabezados subalternos o subtítulos, a menos que estemos intentando indicar una nueva sección o subsección con dicho elemento.
La W3C nos propone un método más sencillo, utilizar la puntuación adecuada. Nos proponen utilizar un signo de dos puntos ":" dentro del mismo encabezado. Esto le dirá al navegador, que el texto que va detrás de los dos puntos, es complementario al que esta ubicado antes. Mejor vemos un ejemplo visual y así seguro se va a entender mejor.
1.-<h1>Los juegos del hambre: En llamas</h1>El segundo método que nos proponen, es el uso de un elemento <span> dentro de un elemento de título <h1>. Esto nos permite dar un estilo diferente a la parte secundaria. Pero no estamos hablando de estilos en este momento y todavía nos queda lejos, así que basta con que te quedes con esto. Veamos como definiríamos lo que nos dice el consorcio.
2.-<h1>Los juegos del hambre: <span>En llamas</span></h1>Y por ultimo la tercera opción que nos proponen, es utilizar un elemento de tipo párrafo <p>. Según opiniones que voy leyendo es quizás la más adecuada. Esto englobaría tanto al título como a dicho párrafo con la etiqueta <header>.
3.-<header> <h1>Los juegos del hambre: <p>En llamas</p></h1> </header>
Conclusiones
La verdad, poca cosa más necesitas saber sobre las etiquetas de titulo en HTML5 por el momento. Hemos visto como definirlas y además, nos hemos puesto al día con las recomendaciones de uso de la W3C. Recuerda que si tienes alguna duda o sugerencia, puedes dirigirte a nosotros a traves de un comentario en este post o en el grupo o página de Facebook
0 Comentarios