Desglosar los elementos de HTML5: los elementos maniquíes

Los elementos son los bloques de construcción para HTML. Los usas para describir cada fragmento de texto en tu página web. Los elementos están formados por etiquetas y el contenido dentro de (o entre) esas etiquetas. En HTML, hay dos tipos principales de elementos:

• Elementos con contenido formado por un par de etiquetas y cualquier texto que se encuentre entre las etiquetas de apertura y cierre en el par

• Elementos que insertan algo en la página, utilizando un único etiqueta

Pares de etiquetas en HTML

Los elementos que describen el contenido usan un par de etiquetas para marcar el comienzo y el final, y todo lo que está entre ellos representa el contenido del elemento. Los pares de etiquetas comienzan con una etiqueta de apertura, seguida de un poco de contenido, y finalizan con una etiqueta de cierre, como esta: Los títulos son fáciles, el contenido es difícil.

Contenido, como artículos, apartados, párrafos, encabezados, tablas y listas, siempre usa pares de etiquetas, donde

• La etiqueta de apertura () le dice al navegador, "El elemento comienza aquí. "

• La etiqueta de cierre () le dice al navegador," El elemento termina aquí. "

El contenido real es el material entre las etiquetas de apertura y cierre.

Etiquetas individuales

Los elementos que insertan algo en una página se llaman elementos vacíos (porque no encierran ningún contenido) y usan una sola etiqueta, como esta:. Las imágenes y los saltos de línea insertan algo en un archivo HTML y usan una sola etiqueta (elemento vacío), es decir, y , respectivamente.

En HTML5, los elementos vacíos no requieren un tratamiento especial. En una versión anterior conocida como XHTML (basada en el lenguaje de marcado XML), se requieren elementos vacíos para finalizar con una barra justo antes del corchete angular de cierre, por lo que en HTML5 (y HTML4, para ese asunto) se escribiría como.

Por compatibilidad con versiones anteriores de HTML4, esto se escribiría a menudo porque el espacio anterior a la barra oblicua permitía a los navegadores antiguos reconocer el elemento correctamente, incluso si no analizaban el marcado como XHTML. Puede encontrar el espacio extra y la barra de cierre en las páginas que mira, así que no deje que le moleste. Estas contorsiones ya no se aplican en HTML5.

Por ejemplo, el elemento

hace referencia a una imagen. Cuando el navegador muestra la página, reemplaza el elemento

con el archivo al que apunta. (Un atributo hace el señalamiento.)

Por más atractivo que parezca el concepto, no puede crear sus propios elementos HTML. Los elementos legales para HTML pertenecen a un conjunto muy específico: si utiliza elementos que no pertenecen a ese conjunto, el navegador simplemente los ignora. Los elementos que puede usar están definidos en las diversas especificaciones de HTML. (La especificación HTML5. 1 se puede encontrar en la página Borrador de trabajo del W3C).)

Marcación de anidación

Algunas estructuras de página HTML pueden contener elementos anidados. Piense en ellos como maletas que encajan perfectamente una dentro de la otra. Por ejemplo, una lista con viñetas utiliza dos tipos de elementos:

• El elemento

  especifica que la lista está desordenada (con viñetas).

  • El elemento

  • marca cada elemento en la lista. (El li significa "elemento de lista".)

  Cuando combine elementos utilizando este enfoque, debe cerrar todos los elementos del elemento de lista dentro antes de cerrar el elemento de lista desordenado, como este:

  
  Artículo 1
  Artículo 2