Componentes básicos
HTML5 provee básicamente tres características: estructura, estilo y funcionalidad. Nunca fue declarado oficialmente pero,
incluso cuando algunas APIs (Interface de Programación de Aplicaciones) y la especificación de CSS3 por completo no son
parte del mismo, HTML5 es considerado el producto de la combinación de HTML, CSS y Javascript. Estas tecnologías son
altamente dependientes y actúan como una sola unidad organizada bajo la especificación de HTML5. HTML está a cargo de
la estructura, CSS presenta esa estructura y su contenido en la pantalla y Javascript hace el resto.
Estructura global
Los documentos HTML se encuentran estrictamente organizados. Cada parte del documento está diferenciada, declarada y
determinada por etiquetas específicas.
Ejemplo:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="description" content="Ejemplo de HTML5">
<meta name="keywords" content="HTML5, CSS3, JavaScript">
<title>Este texto es el título del documento</title>
<link rel=”stylesheet” href=”misestilos.css”>
</head>
<body>
</body>
</html>
Estructura del cuerpo
La estructura del cuerpo (el código entre las etiquetas <body>) generará la parte visible del documento. Este es el código que
producirá nuestra página web.
HTML siempre ofreció diferentes formas de construir y organizar la información dentro del cuerpo de un documento. Uno
de los primeros elementos provistos para este propósito fue <table>. Las tablas permitían a los diseñadores acomodar
datos, texto, imágenes y herramientas dentro de filas y columnas de celdas, incluso sin que hayan sido concebidas para este
propósito.
El elemento <div> comenzó a dominar la escena. Con el surgimiento de webs más interactivas y la integración de HTML,
CSS y Javascript, el uso de <div> se volvió una práctica común. Pero este elemento, así como <table>, no provee
demasiada información acerca de las parte del cuerpo que está representando. Desde imágenes a menús, textos, enlaces,
códigos, formularios, cualquier cosa puede ir entre las etiquetas de apertura y cierre de un elemento <div>. En otras
palabras, la palabra clave div solo especifica una división en el cuerpo, como la celda de una tabla, pero no ofrece indicio
alguno sobre qué clase de división es, cuál es su propósito o qué contiene.
Considerando todo lo expuesto, HTML5 incorpora nuevos elementos que ayudan a identificar cada sección del documento
y organizar el cuerpo del mismo. En HTML5 las secciones más importantes son diferenciadas y la estructura principal ya no
depende más de los elementos <div> o <table>.