¿Qué es una imagen de respaldo?

Una imagen de respaldo es una imagen sustituta que se muestra cuando el contenido visual preferido no puede cargarse o renderizarse. Puede reemplazar una imagen ausente, una vista previa de video fallida, un formato no compatible o un recurso remoto no disponible.

Cómo funcionan las imágenes de respaldo

Una imagen de respaldo forma parte del diseño de una interfaz para gestionar fallos y compatibilidad, en lugar de ser simplemente otra URL de origen. La selección puede producirse de forma declarativa cuando el navegador evalúa los formatos candidatos, o de forma imperativa después de que falle una solicitud elegida o la decodificación. La imagen sustituta debería conservar la función semántica y la geometría previstas, incluso cuando no pueda reproducir el contenido visual ausente. Corresponde a la capa de renderizado, mientras que la supervisión y la reparación de los archivos abordan el problema subyacente de entrega.

Datos clave

  1. El elemento img final de un elemento picture proporciona una alternativa de selección cuando las reglas de source o los formatos no coinciden. Un fallo de red para el candidato seleccionado no hace que se prueben de forma fiable todos los candidatos anteriores.
  2. Un controlador de errores que reemplaza src debe evitar asignar repetidamente la misma URL que falla. Eliminar el controlador o registrar los orígenes ya probados evita una secuencia infinita de eventos de error.
  3. Una anchura y una altura explícitas o una relación de aspecto estable reservan espacio en el diseño antes de que se cargue cualquiera de los dos orígenes. El texto alternativo debería describir el significado de la imagen, en lugar de limitarse a anunciar que la carga falló.

Cuándo son importantes las imágenes de respaldo

Los desarrolladores seleccionan imágenes de respaldo que conservan las dimensiones del diseño y comunican con claridad que el contenido no está disponible. La ausencia de dimensiones intrínsecas puede seguir causando desplazamientos en el diseño aunque se cargue una imagen sustituta.

Convierte tus conocimientos sobre multimedia en un pipeline funcional

Conecta las subidas, el procesamiento, la IA, el almacenamiento y la entrega mediante una sola API declarativa, mientras nos encargamos por ti del stack de encoding, el escalado y los cambios constantes de formatos.

Prueba Transloadit gratis