Etiquetas de HTML5 para dar formato y estructura al texto

HTML5 ofrece una amplia variedad de etiquetas que permiten dar formato y estructura al texto de una página web de manera adecuada. La correcta utilización de estas etiquetas no solo facilita la lectura y comprensión del contenido por parte de los usuarios, sino que también es importante para el posicionamiento y accesibilidad de la página en los motores de búsqueda y dispositivos de asistencia.

Una de las etiquetas más importantes para dar formato a los textos son los encabezados (h1 a h6), los cuales se utilizan para definir los títulos y subtítulos de la página web. Los encabezados permiten jerarquizar la información y orientar al usuario sobre el contenido de la página.

Asimismo, las etiquetas de párrafos (p) permiten crear bloques de texto separados por un espacio en blanco, lo que facilita la lectura y comprensión del contenido. Además, las etiquetas de citas (blockquote y q) permiten citar textos o frases, lo que puede ser útil para proporcionar referencias o explicaciones adicionales.

Por otro lado, las etiquetas de listas (ul, ol, li) permiten crear listas de elementos, lo que puede ser útil para organizar información y presentarla de manera clara y concisa.

Además, HTML5 cuenta con etiquetas para dar énfasis al texto, como las etiquetas de texto en negrita (strong), cursiva (em), subrayado (u), tachado (s) y resaltado (mark), que permiten destacar palabras o frases importantes en el texto.

HTML5 cuenta con varias etiquetas que permiten dar formato a los textos de una página web. A continuación, describiré cada una de ellas:

Una lista ordenada en HTML5 es una lista de elementos que se numeran automáticamente en orden secuencial. Esta lista se crea utilizando la etiqueta ol, que significa «ordered list» o «lista ordenada» en español.

Cada elemento de la lista se define utilizando la etiqueta li,  que significa «list item» o «elemento de lista» en español. Dentro de cada etiqueta li , se escribe el contenido del elemento de la lista.

Por ejemplo, el siguiente código HTML5 crea una lista ordenada con tres elementos:

Este código generará una lista ordenada numerada del 1 al 3, con cada elemento de la lista dentro de una etiqueta li. Es importante destacar que el orden de los elementos de la lista no depende del número que se escriba dentro de la etiqueta li, sino que se numeran automáticamente en orden secuencial. Además, la numeración de los elementos se puede personalizar utilizando CSS para cambiar el color, tamaño o estilo de la numeración.

Una lista desordenada en HTML5 es una lista de elementos que no tienen un orden numérico específico y se presentan con viñetas o puntos para distinguir cada elemento de la lista. Esta lista se crea utilizando la etiqueta ul, que significa «unordered list» o «lista desordenada» en español.

Cada elemento de la lista se define utilizando la etiqueta li, que significa «list item» o «elemento de lista» en español. Dentro de cada etiqueta li, se escribe el contenido del elemento de la lista.

Por ejemplo, el siguiente código HTML5 crea una lista desordenada con tres elementos:

Este código generará una lista desordenada con cada elemento de la lista dentro de una etiqueta li, y cada elemento se presentará con una viñeta o punto delante.

Es importante destacar que el orden de los elementos de la lista desordenada no es importante, ya que no se numeran automáticamente en orden secuencial, y que también se pueden personalizar utilizando CSS para cambiar el estilo de la viñeta o punto.

En este post hemos visto distintas etiquetas para dar formato a distintos tipos de texto, estas son etiquetas que solemos utilizar al desarrollar cualquier tipo de proyecto, ya sea utilizando solo HTML5 o cualquier framework como Angular, React o cualquier otro.