Para optimizar las imágenes de tu web, prepara cada archivo para el espacio donde va a aparecer. Revisa su proporción, sus dimensiones y su peso antes de subirlo; después comprueba el resultado en ordenador y móvil.
1. Comprueba dónde se utilizará
Una foto de portada, una tarjeta del blog y una ficha de producto no ocupan el mismo espacio. Mira si el diseño necesita una imagen cuadrada, horizontal o vertical. Si el catálogo usa imágenes cuadradas, prepara una versión que conserve el producto completo: recorta con criterio o añade espacio alrededor, pero no estires la fotografía.
2. Ajusta las dimensiones
Trabaja con una copia del original. Redúcela a unas dimensiones acordes con el tamaño máximo de uso, teniendo en cuenta las pantallas de alta densidad. No hay una medida universal para todas las webs. Si una miniatura ya se ve borrosa, ampliarla no recupera detalle: vuelve a una fotografía de mayor resolución.
3. Elige el formato y compara
Para fotografías, prueba WebP o AVIF si tu instalación los admite. JPEG sigue siendo una alternativa para fotos. Cuando necesites transparencia, utiliza un formato que la conserve, como PNG o WebP. Compara siempre la exportación con el original: revisa letras, bordes y textura al tamaño al que se verá.
4. Reduce el peso sin perder información útil
Ajusta la compresión y compara el resultado. Un archivo más ligero puede ayudar a cargar antes, pero una etiqueta ilegible o una captura borrosa no sirven al lector. No persigas una cantidad fija de kilobytes para cualquier imagen. Evita volver a guardar repetidamente un JPEG con compresión: conserva el original y genera las versiones desde él.
5. Añade nombre y texto alternativo
Utiliza un nombre de archivo descriptivo antes de subirlo. En la biblioteca de medios, revisa el título y escribe un texto alternativo que describa la información de la imagen. Por ejemplo: «Vista lateral de una zapatilla azul con cierre de velcro». No lo rellenes con palabras clave. Añade un pie solo cuando aporte contexto.
6. Comprueba la imagen en la página y el listado
Revisa tanto la imagen dentro de la página como el recorte que usa la tarjeta del blog o del catálogo. En una captura de instrucciones, comprueba que se leen los botones en móvil. Si el original está bien y la web lo recorta, revisa la proporción y el ajuste de visualización antes de volver a comprimir.
Para continuar, consulta cómo corregir imágenes cortadas o borrosas, publicar tu primera entrada.
