Solución:
Este es HTML5 válido y está absolutamente bien sin cerrarlo. Es un elemento llamado vacío:
<img src="https://foroayuda.es/stackoverflow.png">
Las siguientes son etiquetas XHTML válidas. Tienen que estar cerrados. El último también está bien en HTML 5:
<img src="https://foroayuda.es/stackoverflow.png"></img>
<img src="https://foroayuda.es/stackoverflow.png" />
<img src="https://foroayuda.es/stackoverflow.png" />
Funciona bien y cierra la etiqueta correctamente. Es mejor agregar el alt
atributo para personas con discapacidad visual.
De hecho, solo el primero es válido en HTML5
<img src="https://foroayuda.es/stackoverflow.png">
Solo los dos últimos son válidos en XHTML
<img src="https://foroayuda.es/stackoverflow.png"></img>
<img src="https://foroayuda.es/stackoverflow.png" />
(Aunque no es un requisito estricto, alt
atributo _usualmente_ también debe incluirse).
Dicho esto, su página HTML5 probablemente se mostrará según lo previsto porque los navegadores reescribirán o interpretarán su html según lo que cree que quiso decir. Ese mayo significa que convierte una etiqueta, por ejemplo, de
<div />
dentro <div></div>
. O tal vez simplemente ignora la barra final en <img ... />
.
consulte 2016: Sirva HTML5 como XHTML 5.0 para validación heredada.
ver: discusión de 2011 y enlaces adicionales aquí, aunque con el tiempo algunos bits pueden haber cambiado
En parte, esto se debe a que los navegadores se esfuerzan mucho en corregir los errores. Además, porque existe mucha confusión sobre las etiquetas de cierre automático y las etiquetas nulas. Finalmente, la especificación ha cambiado, o no siempre ha sido clara, y los navegadores intentan ser compatibles con versiones anteriores.
Entonces, aunque probablemente pueda salirse con la suya con cualquiera de las tres opciones,
solo el primero se adhiere al estándar HTML5 y está garantizado para pasar un validador de HTML5.
Una buena estrategia podría ser:
- Escribe un código nuevo sin la barra de cierre.
- Al volver a factorizar el código, actualice las etiquetas de imagen cercanas a medida que las cruza.
- No se preocupe demasiado por las etiquetas de los archivos heredados que no toque, a menos que surja una necesidad particular.
A continuación, se muestra una lista de etiquetas que no deben cerrarse en HTML5:
<br> <hr> <input>
<img> <link> <source>
<col> <area> <base>
<meta> <embed> <param>
<track> <wbr> <keygen> (HTML 5.2 Draft removed)