Etiquetas Sem Nticas HTML5

Etiquetas Semánticas HTML5
Qué son las etiquetas semánticas del HTML5, y por qué se recomienda usar
aquellas que sirven para definir la estructura del documento en los sitios web
modernos.
El propio lenguaje HTML es una de las muchas tecnologías que se ha renovado con
la llegada de HTML5. Se han incorporado numerosas etiquetas que no estaban en
versiones anteriores del lenguaje de marcación, quepodemos clasificar en función
de su utilidad o características. Una de estas clasificaciones son las etiquetas
semánticas.
En el presente artículo vamos a explicar con mayor profundidad qué son las
etiquetas semánticas y por qué deben ser utilizadas para mejorar la creación de un
documento web. Veremos el conjunto de etiquetas semánticas que sirven para
definir la estructura de un sitio y cómo nospueden ayudar a que nuestra página sea
indexada con mayor exactitud por los motores de búsqueda.

Qué son etiquetas semánticas
Semántica: Perteneciente o relativo a la significación de las palabras. Esa es la
definición de la Real Academia de la Lengua Española y es así de sencillo es
entender este tipo de etiquetas del lenguaje HTML: Aquellas que dan un significado
a las partes del documento.Por decirlo de otra forma, estamos ante etiquetas que indican qué es el contenido
que contienen, en lugar de como se debe formatear al mostrar el documento
HTML en un cliente web.
Para que todas nuestras dudas se despejen, podemos echar mano de un ejemplo.
Pensemos en la etiqueta STRONG ¿Qué nos indica? Que un texto debe resaltarse
con mayor fuerza con respecto a otros textos que no sean "strong",parecido a lo
que nos indica la etiqueta B, que todavía es más concreta, al especificar que un
texto debe ser colocado en negrita. Pensemos ahora en una etiqueta DIV, o P. La
primera es una división y P es un párrafo. Todo esto no son más que maneras de
decirle al navegador cómo debe formatear una página, qué debe separar en un
texto, en una división normal, o en un párrafo, etc.
Pocas de lasetiquetas del lenguaje de marcación anteriores a HTML5 indican al
documento el significado de los elementos que contienen. O sea, pocas etiquetas
indican qué son y qué función representan en el documento HTML, sino que la
mayoría sirven para indicar cómo se deben ver en la página una vez renderizada
por el navegador.

Pues bien, en HTML5 se han incorporado muchas etiquetas que sirven para indicar
quéson y cuál es el significado de los elementos que contienen dentro. Esas son
las etiquetas semánticas, que ganan mucha importancia en el marco del HTML y de
la composición de un documento web por ayudar a motores de búsqueda como
Google a indexar más correctamente los contenidos de un sitio.
Dentro del etiquetado semántico también tenemos varias funciones, pero para los
que nos dedicamos amaquetar páginas web, hay un conjunto de ellas que nos
interesan especialmente. Son las que sirven para definir el esquema principal del
documento, como HEADER, ARTICLE, FOOTER, etc. Todas esas etiquetas
semánticas nos indican qué es el contenido que engloban y cuál es su relación con
el conjunto de elementos del documento HTML.
Nota: Hay que añadir que también existen otra serie de etiquetas semánticasnuevas en la versión 5 del lenguaje, que también dicen qué es lo que hay dentro,
más que cómo debe representarse. Ejemplos de ellas son DETAILS, FIGURE, etc.

Etiquetas semánticas estructurales
Veremos con detalle a continuación las etiquetas semánticas que sirven para definir
la estructura de un documento HTML y por qué debemos incorporarlas cuanto antes
a nuestras técnicas de desarrollo desitios web.
Las etiquetas semánticas estructurales nos sirven para que los motores de
búsqueda, o cualquier otro mecanismo automático que lea un sitio web, sepa con
exactitud qué partes de su contenido corresponden a cada una de las partes típicas
de un sitio. Generalmente, en cualquier documento tenemos una cabecera, un
cuerpo y un pie de página, elementos que definen la estructura representados...