HTML5, estructura básica y elementos semánticos

Una de las principales ventajas de HTML5 es la inclusión de elementos semánticos, o marcados semánticos, que nos ayudan a definir las distintas divisiones de una página web.

• Elementos semanticos

Una etiqueta semántica describe su significado. Por ejemplo: < header>, < section>, < footer>, < form>, < table>, < article>, < nav>… Ejemplos de elementos no semánticos (no dicen nada sobre su contenido): < div> y < span>.

Muchos sitios web contienen código HTML como: < div class="header"> < div id=" nav " > < div id="section" > < div id="aside" > < div id=" footer " >.

Es muy importante cambiar ese código y usar etiquetas semánticas: < header> < nav> < section> < aside> < footer>.


Hay varias ventajas de usar elementos semánticos en HTML:

**Ayuda a los motores de búsqueda y otros dispositivos de usuario a determinar la importancia y el contexto de las páginas web. Es importante para el SEO (optimización en motores de búsqueda).
**Es mucho más fácil de leer.
**Tiene mayor accesibilidad.

• Estructura básica de un documento HTML5

Etiquetas html de contenido y texto

Etiquetas para la creación de formularios HTML

Los formularios son los elementos en los que se integran los botones y las áreas de texto que se utilizan para que los usuarios introduzcan sus datos o que puedan elegir entre varias opciones. Veamos las etiquetas que se utilizan para la creación de formularios en HTML5.
El principio y final de un formulario se define con las etiquetas < form> y < /form>. Dentro de las etiquetas de apertura y cierre de form se pueden incluir diferentes elementos que son enviados para ser procesados por el servidor web.

Etiquetas html para crear tablas de contenido

El principio y final de una tabla se define con las etiquetas < table> y < /table>. Las filas se engloban con las etiquetas < tr> < /tr> y las columnas se crean mediante las etiquetas < td> < /td> (las etiquetas < td> siempre estarán dentro de una fila < tr>). Las etiquetas < th> se utilizan para representar los encabezados.

Elementos semánticos

Etiquetas de texto

Etiquetas para la creación de formularios

Agrupación de celdas