Define qué debe explicar cada fotografía
Imagina un taller de cerámica preparando un catálogo de tazas artesanales. Una tarjeta de colección permite reconocer la forma; la página del producto muestra asa, borde y esmalte. Incluye esos objetivos en las instrucciones fotográficas. Una escena llamativa sobre una mesa puede servir para la colección y dificultar valorar cada taza.
MDN distingue entre cambiar la resolución y elegir otro encuadre para un diseño. Aprueba el encuadre de la taza en cada ubicación. Comprueba que el asa siga visible y que un recorte cerrado no sugiera que muestra el objeto completo. Las fotos de detalle pueden responder preguntas que un recorte más ajustado no resuelve.
Acuerda cómo obtener varios archivos útiles de un original
Web.dev explica cómo srcset y sizes ayudan al navegador a elegir archivos según su visualización. Pide al desarrollador que muestre qué archivo descarga realmente una tarjeta del catálogo en un teléfono. Una imagen aparentemente pequeña no demuestra que el archivo entregado tenga un tamaño adecuado.
Conserva el original aprobado y documenta cómo producir las versiones web. El redimensionado automático reduce tareas repetitivas; las exportaciones manuales dan control directo al editor, pero añaden pasos cada vez que cambia una foto. Acuerda quién comprueba los detalles del esmalte tras el procesamiento. Compara versiones al tamaño de visualización previsto antes de publicar.
Mantén estable el catálogo mientras se abre
Web.dev recomienda indicar dimensiones o reservar espacio con la proporción de la imagen para evitar desplazamientos del diseño. Observa una fila de tarjetas del catálogo mientras llegan las fotos. Los nombres y enlaces deben seguir siendo fáciles de localizar, sin saltar a otra posición.
Un formato uniforme facilita comparar, pero necesita una regla editorial para piezas especialmente altas o anchas. Decide entre mostrar el objeto entero con espacio alrededor o preparar otra composición. Prueba a añadir un jarrón alto junto a las tazas antes de aprobar la plantilla reutilizable.
Elige qué imágenes pueden esperar
Las recomendaciones de carga diferida de web.dev respaldan aplazar imágenes fuera de pantalla y cargar inmediatamente las visibles al inicio. Aplica esa decisión al diseño real del catálogo. La primera vista del producto y una galería larga al final sirven a distintos momentos de la decisión.
Recorre la galería con una conexión más lenta. Anota las vistas vacías que dificulten comparar y pide al equipo que investigue. Eliminar todas las fotos adicionales puede aligerar la página y dejar al cliente sin detalles necesarios para hacer una consulta. Conserva las imágenes que respondan una pregunta distinta.
Ensaya la próxima actualización del catálogo
Pide al editor habitual que sustituya una foto de taza siguiendo las instrucciones de entrega. Revisad juntos la página resultante y corregid el proceso antes de la siguiente colección. Conserva una lista breve con los ejemplos aprobados.
- Comprueba el objeto completo y los detalles importantes en tarjetas y páginas de producto.
- Verifica archivos y tamaños transferidos en diseños representativos de teléfono y ordenador.
- Observa el catálogo durante la carga y tras añadir un objeto de forma inusual.
- Recorre la galería y confirma que cada fotografía aporta información útil.
- Designa quién aprueba exportaciones, encuadres y sustituciones posteriores.