¿Todavía necesitamos barras diagonales en HTML5?

121

En HTML5, ¿todavía necesitamos la barra diagonal como en XHTML?

<img src="some_image.png" />

validator.w3.org no se quejó si lo dejé caer, ni siquiera una advertencia. Pero algunos documentos en línea parecen indicar que la barra diagonal final todavía es necesaria para etiquetas como img, link, meta, br, etc.

html xhtml CaptSaltyJack
fuente
66
Todavía ? ¿Alguna versión de HTML requirió cerrar todas las etiquetas?
Gabe
9
@Gabe XHTML 1.0 Strict lo necesita. Quiero decir, las páginas web se cargarán bien generalmente, pero se considera inválido.
CaptSaltyJack
3
Sí, pero esa X no solo está allí porque X es genial, hay una gran brecha entre HTML y XHTML.
1
@Capt: Tienes razón, pero eso solo debería ser un problema si tu doctype indica XHTML.
Gabe

Respuestas:

81

img Las etiquetas son elementos vacíos, por lo que no necesitan una etiqueta final.

Área de elementos vacíos, base, br, col, comando, incrustar, hr, img, input, keygen, link, meta, param, source, track, wbr

...

Los elementos nulos solo tienen una etiqueta de inicio; Las etiquetas finales no deben especificarse para elementos vacíos.

W3C | WHATWG

Dicho esto, no es un análisis estricto en HTML5, por lo que no hará ningún daño importante.

Brian R. Bondy
fuente
Es curioso, porque mi editor (Komodo) sangra si escribo '<img src = "x">' y presiono enter. Espera la barra inclinada final en modo HTML5 y quería asegurarme de que este fuera el comportamiento correcto.
CaptSaltyJack
55
Esto es HTML, no XHTML, por lo que no es obligatorio. Afortunadamente, los analizadores todavía entienden las barras diagonales de estilo XHTML muy bien, por lo que no hay nada de malo en dejarlo allí. Significa una conversión más fácil hacia atrás a XHTML, si es necesario por cualquier razón.
Nightfirecat
44
@FreeRadical: una barra inclinada final es opcional para un elemento vacío, pero una etiqueta final no sería válida.
Ry-
25
Si bien la pregunta es sobre barras diagonales (por ejemplo <br/), esta respuesta solo se refiere a etiquetas finales (por ejemplo <br></br>).
Radical libre el
12
@FreeRadical es correcto. Esta respuesta es técnicamente incorrecta, porque se confunde an ending slashcon an end tag, y por lo tanto no comprende bien los párrafos de especificaciones que cita. Esto lleva a la confusión de @ YannisDran. @minitech indica correctamente lo que es cierto.
ToolmakerSteve
94

En HTML 5, la barra diagonal de cierre es opcional en elementos vacíos como img(agrego esto porque la respuesta actualmente aceptada solo dice: "las etiquetas finales no deben especificarse para elementos vacíos", y no aborda las barras diagonales de cierre en elementos vacíos).

Citando de http://www.w3.org/TR/html5/syntax.html#start-tags (número 6):

Entonces, si el elemento es uno de los elementos vacíos, o si el elemento es un elemento extraño, entonces puede haber un solo carácter "/" (U + 002F). Este carácter no tiene efecto en los elementos vacíos, pero en los elementos extraños marca la etiqueta de inicio como cierre automático.

Radicales libres
fuente
Esto no es una cosa HTML5. En realidad, en versiones anteriores de HTML <br/>o <img ... />eran errores.
jj
@jj Cito los documentos HTML5, así que no entiendo por qué no creo que no sea HTML5. Y, de hecho, en otras versiones, tales cortes fueron errores.
Radical libre el
Claro, quise decir que " todavía necesitamos barras diagonales en HTML5" es la pregunta equivocada. Tal vez escriba una respuesta completa con algunos enlaces históricos algún día. IIRC fue una decisión difícil para Ian Hickson (el editor de HTML) permitir barras diagonales finales en HTML5.
jj
2

No HTML nunca lo ha requerido, incluso antes de HTML5. Si planea usar XHTML con funciones HTML, entonces sí, es necesario.

Ry-
fuente
1
XHTML no es lo mismo que HTML5, ¿correcto? Si mi DOCTYPE es solo "html", no necesito las barras inclinadas, ¿correcto?
CaptSaltyJack
@CaptSaltyJack: Correcto.
Ry-
1
@CaptSaltyJack: HTML5 cubre tanto HTML normal como XHTML. XHTML requiere que todos los elementos estén cerrados, pero para los navegadores, el doctype no tiene ningún efecto sobre la situación. Para una explicación más completa, consulte stackoverflow.com/questions/2662508/…
Alohci
1

La barra diagonal final para elementos vacíos es opcional.

Ambos son HTML5 válidos:

<img src="some_image.png" />

y

<img src="some_image.png">

Los elementos vacíos son:

  • area
  • base
  • br
  • col
  • embed
  • hr
  • img 👍
  • input
  • link
  • meta
  • param
  • source
  • track
  • wbr

Además de interesante:

Los elementos vacíos no pueden tener ningún contenido (dado que no hay una etiqueta final, no se puede poner contenido entre la etiqueta inicial y la etiqueta final).

Más detalles en: https://html.spec.whatwg.org/multipage/syntax.html#elements-2


Consulte también la pregunta SO aquí:
Etiquetas de cierre automático (elementos nulos) en HTML5

Kai Noack
fuente