Error Imagen sin src ni srcset
Por qué una <img> sin atributo src ni srcset se renderiza como una imagen rota, y en qué se diferencia de un atributo alt faltante.
El validador marca cualquier elemento <img> que no tenga ni un atributo src ni un atributo srcset.
Ejemplo
<!-- Incorrecto: nada que el navegador pueda cargar -->
<img alt="Foto del equipo">
<!-- Correcto -->
<img src="/equipo.jpg" alt="Foto del equipo">Por qué importa
Sin src ni srcset, el navegador no tiene ningún recurso de imagen que solicitar — el elemento se renderiza como un ícono de imagen rota (o nada, según el navegador y el estilo), sin importar qué tan bueno sea su texto alt. Esto es distinto de un atributo alt faltante, que es un problema de accesibilidad en una imagen que por lo demás carga bien. Un src faltante suele significar que un paso del build falló al inyectar una URL, que una variable de plantilla se resolvió como undefined, o que una etiqueta <img> se copió y pegó sin llegar a completar nunca su origen.
Frequently asked questions
¿Basta con srcset solo, sin src?
Sí — un navegador que soporte srcset va a elegir una imagen apropiada de la lista y no necesita un src por separado. Sigue siendo práctica común incluir un src como respaldo para navegadores muy antiguos que no entienden srcset, pero no es obligatorio para que la imagen cargue en un navegador moderno.
¿Qué muestra un navegador para una <img> sin src?
Típicamente un ícono de imagen rota, con un tamaño según el width/height o el texto alt presentes, aunque el renderizado exacto varía según el navegador. De cualquier forma, no aparece nada parecido a la imagen prevista.