Etiquetas autocerradas en HTML

¿Qué son las etiquetas autocerradas en HTML?

Las etiquetas autocerradas en HTML son etiquetas especiales que no necesitan etiqueta de cierre. También se las conoce como elementos vacíos. No envuelven su contenido como hacen otros elementos. Permanecen vacías y, en su lugar, se completan a sí mismas.

En HTML5, las etiquetas autocerradas pueden llevar o no la barra de cierre. Por ejemplo, tanto

<br> como <br />funcionan. Antes, las barras eran necesarias para analizar correctamente los documentos XHTML y XML. Ahora, los analizadores de HTML procesan ambas sintaxis sin dificultad.

Estas etiquetas siguen reglas sencillas y facilitan la estructuración de los documentos HTML. Hacen que el código sea más corto y limpio. Los navegadores pueden mostrarlas de la misma manera, lleven o no la barra de cierre.

Lista de etiquetas autocerradas para HTML5

En HTML5, estas son las etiquetas HTML autocerradas más utilizadas:

• <br> – Salto de línea
  
• <img> – Imagen
  
• <hr> – Línea horizontal
  
• <meta> – Metadatos
  
• <link> – Enlace a hojas de estilo
  
• <input> – Campo de entrada
  
• <source> – Fuentes multimedia
  
• <area> – Área de un mapa de imagen
  
• <col> – Columna de tabla
  
• <embed> – Incrustar un recurso externo
  
• <track> – Pista de texto multimedia
  
• <wbr> – Oportunidad de salto de palabra
  

Esta lista cubre la mayoría de las etiquetas autocerradas que se ven en las páginas web.

Cómo usar las etiquetas autocerradas

Usar las etiquetas autocerradas es sencillo. Solo se escribe la etiqueta de apertura y no la de cierre. En XHTML 1.0 debe añadir la barra de cierre. Hoy, en HTML5, los navegadores aceptan ambas formas.

En HTML, los requisitos de las reglas de análisis son menos estrictos. Los navegadores pueden pasar por alto las barras adicionales al renderizar. Esto mantiene la estructura de los documentos y los hace más adaptables.

Ejemplos

Estos son algunos ejemplos de etiquetas autocerradas:

<br>

<hr>

<img src=”image.jpg” alt=”Sample”>

<input type=”text”>

Muchos documentos HTML utilizan estas etiquetas autocerradas. Emplean sintaxis consolidadas para la estructuración. Los navegadores modernos las analizan sin problema.

Con las etiquetas autocerradas, HTML mantiene su código ordenado. Son muy importantes para crear páginas web que funcionen.