Etiquetas de cierre automático (elementos vacíos) en HTML5

El paso 6 de 8.1.2.1 Las tags de inicio de la especificación HTML5 dice que los elementos vacíos pueden tener un único / carácter. Creo que es así, es más fácil migrar los sitios que son XHTML a HTML5.

¿Cuál es la mejor práctica?

Por ejemplo, si estoy creando un sitio web con HTML5 ( ), ¿qué debo hacer?

  1. sin la barra

      
  2. con la barra

      

Si ambos se muestran correctamente en todos los navegadores, supongo que (1) sin la barra oblicua es el camino a seguir, ya que es más HTML5.

No hay consenso sobre las mejores prácticas, y según el autor de la especificación, Ian Hickson, no importa.

Sobre todo depende si quieres ir a la ruta XML o no. Ambos deben mostrarse correctamente, ya que las especificaciones HTML5 no requieren tags de cierre automático; su única razón es que el documento es válido en XML.

La forma más sencilla es escribir probablemente sin el cierre automático “/”, a menos que exista una necesidad específica de analizar el marcado como XML; en ese caso, también necesita

  

Cerrar la etiqueta con una barra inclinada es una forma más explícita de indicar que no está destinada a tener una etiqueta de cierre.

Google sugiere en su guía de estilo : no cierre elementos vacíos .

Se prefiere HTML5 (syntax HTML) para todos los documentos HTML … Aunque está bien con HTML, no cierre elementos vacíos

Personalmente, me he acostumbrado a cerrar tags con una barra inclinada y descubro que /> me ayuda a reconocer que la etiqueta no tendrá una etiqueta de cierre.

Este artículo explica la diferencia entre las dos versiones: http://www.colorglare.com/2014/02/03/to-close-or-not-to-close.html

Las dos versiones son completamente idénticas.

En realidad, uno podría argumentar que agregar “/” a una etiqueta vacía es un error de syntax ignorado.