Optimizar las imágenes de WordPress consiste en subirlas con el tamaño justo, en un formato moderno como WebP, comprimidas, con un nombre descriptivo, con texto alternativo y con carga diferida cuando están lejos de la pantalla. Es uno de los cambios que más acelera una web y casi nunca requiere tocar código.
El problema suele ser el mismo: alguien sube la foto tal como sale del móvil, con 4.000 píxeles de ancho y varios megas de peso, para llenar un hueco de 800 píxeles. El visitante la ve pequeña, pero su móvil se descarga la grande.
En las webs que me llegan he visto auténticas barbaridades: imágenes de 6 MB, 7 MB o más. Lo primero que hago es localizar dónde están esas imágenes y reducir su peso.
1. Sube cada imagen con el tamaño que necesita
Antes de subir una foto, comprueba a qué ancho se va a mostrar en tu web. Si tu contenido ocupa como mucho 1.200 píxeles, no tiene sentido subir una imagen de 4.000. Como regla práctica, sube como máximo el doble del ancho al que se muestra, para que se vea nítida en pantallas de alta densidad.
Redimensionar es gratis y no requiere ningún plugin: lo puedes hacer con cualquier editor de imágenes, incluso el que trae tu ordenador, antes de subir el archivo. Lo mismo vale para tu logo y tu favicon: cuida su tamaño y su formato.
2. Elige un formato moderno
Los formatos que Google puede indexar en las imágenes son BMP, GIF, JPEG, PNG, WebP, SVG y AVIF, según su guía de SEO de imágenes. Eso no significa que todos sean igual de buenos para tu web.
| Formato | Para qué sirve | Cuándo usarlo |
|---|---|---|
| JPEG | Fotografías | Cuando no puedes usar WebP |
| PNG | Imágenes con transparencia o capturas con texto | Solo cuando necesitas transparencia y WebP no es opción |
| WebP | Fotografías y gráficos, con menos peso que JPEG y PNG | Es mi punto de partida para casi todas las imágenes |
| AVIF | Todavía menos peso a igual calidad | Si tu servidor lo soporta y tienes un plugin que lo gestione |
| SVG | Logotipos e iconos que se escalan sin perder calidad | Para elementos gráficos sencillos, no para fotos |
WordPress admite WebP desde la versión 5.8 (nota oficial) y AVIF desde la 6.5. Con AVIF hay tres matices que conviene saber: depende de la biblioteca de imágenes de tu servidor, WordPress no genera una versión de reserva en JPEG para los navegadores que no lo entiendan y tampoco convierte las imágenes que ya tienes (nota oficial). Por eso, para una pyme, WebP suele ser la opción más cómoda.
3. Comprime sin que se note
La compresión reduce el peso del archivo eliminando información que el ojo casi no percibe. Con una compresión razonable, la imagen se ve igual y pesa mucho menos.
Puedes comprimir antes de subir, con una herramienta de escritorio o una web de compresión, o dejar que un plugin lo haga al subir cada imagen. Yo suelo usar herramientas online como iLoveIMG para convertir y comprimir, y solo recurro a un plugin cuando el volumen de imágenes es realmente grande. Si puedo evitar instalar un plugin, mejor. Si ya tienes la biblioteca de medios llena de imágenes pesadas, un plugin de optimización puede procesarlas todas de una vez. Haz una copia de seguridad antes, porque es un cambio masivo.
4. Ponle un nombre que describa la imagen
Un archivo llamado IMG00023.JPG no le dice nada a nadie, ni a tus visitantes ni a Google. Google recomienda nombres de archivo cortos y descriptivos, como mi-nuevo-gatito-negro.jpg en lugar de IMG00023.JPG.
Fíjate en la diferencia: escaparate-tienda-ropa-infantil.webp explica qué hay en la foto. Escríbelo en minúsculas y separa las palabras con guiones.
5. Escribe un texto alternativo útil
El texto alternativo (alt) describe lo que se ve en la imagen. Sirve para las personas que usan lector de pantalla, para cuando la imagen no carga y para que Google entienda su contenido. Google pide que describa la imagen en su contexto y avisa de que rellenarlo con palabras clave perjudica la experiencia (fuente).
- Bien: “Fachada de la tienda de ropa infantil con el escaparate de primavera”.
- Mal: “ropa niños ropa infantil tienda ropa niño barata”.
- Imágenes decorativas: si solo adornan, déjalas con el alt vacío para que el lector de pantalla las ignore.
Si tu web está en varios idiomas, el alt también hay que traducirlo. Lo cuento en el artículo sobre WordPress en varios idiomas.
6. Activa la carga diferida, pero no en la imagen principal
Desde WordPress 5.5, las imágenes llevan por defecto el atributo loading=»lazy», que hace que el navegador no descargue las que están lejos de la pantalla hasta que el visitante se acerca (nota oficial). Solo se añade a las imágenes que tienen ancho y alto definidos, así que conviene que los tengan.
Hay una excepción importante: la imagen principal que se ve nada más entrar, como la del encabezado, no debe cargarse en diferido. Es normalmente el elemento que Google mide en la métrica LCP, que debería ocurrir en los primeros 2,5 segundos (Google). Si la retrasas, empeoras justo lo que querías mejorar.
Errores habituales con las imágenes
- Subir la foto del móvil sin redimensionar. Es el origen de la mayoría de webs lentas por imágenes.
- Usar PNG para fotografías. Pesa mucho más que el mismo contenido en WebP o JPEG.
- Meter texto importante dentro de la imagen. No se puede traducir, no se lee en móvil y Google no lo lee como texto. Google recomienda además evitar imágenes con texto como imagen preferida de una página.
- Sliders con fotos enormes. Cada diapositiva es una imagen que se descarga.
- Alt vacío en imágenes importantes o relleno de palabras clave.
- No medir. Pasa tu página por PageSpeed Insights antes y después, para ver si el cambio ha servido.
Perder visitas casi nunca se debe a un único factor, suele haber varios. Pero que una web cargue lenta es, sin duda, uno de los más importantes, y las imágenes pesadas son de las causas más frecuentes.
Las imágenes son solo una parte de la velocidad. Para el resto de factores, tienes la guía para optimizar WordPress y que cargue más rápido, y si estás montando tu web desde cero, la guía para crear la web de tu empresa con WordPress te da el orden de trabajo.
¿Tu web carga lenta y no sabes por dónde empezar?
Reviso tu web, optimizo las imágenes y los demás factores que la frenan, y te cuento qué he cambiado. Precio cerrado antes de empezar.
Preguntas frecuentes sobre optimizar imágenes en WordPress
No hay una cifra única, porque depende del tamaño y del tipo de imagen. Lo importante es subirla al tamaño con el que se va a mostrar, en un formato como WebP y comprimida. Si dudas, mide la página con PageSpeed Insights y revisa las imágenes que señala.
AVIF suele comprimir más, pero WordPress no genera una versión de reserva para navegadores que no lo entiendan y depende de la biblioteca de imágenes de tu servidor. WebP es la opción más sencilla y compatible para empezar.
No es obligatorio. Puedes redimensionar y comprimir antes de subirlas con herramientas online. Yo solo uso un plugin cuando el volumen de imágenes es muy grande, porque si puedo evitar un plugin más, mejor. Ayuda si tienes muchas imágenes ya subidas o si quieres que la optimización sea automática.
Sí, porque ayuda a Google a entender qué muestra la imagen en su contexto, y además mejora la accesibilidad. Debe describir la imagen con naturalidad, sin rellenarla de palabras clave.
¿Prefieres que te la haga yo?
Diseño webs WordPress para pymes: rápidas, claras y listas para Google, con mantenimiento incluido. Desde 75 €/mes, con precio cerrado antes de empezar.
¿Prefieres que me ocupe yo?Diseño, mantengo y arreglo webs WordPress para pymes, con todos los precios publicados y un presupuesto cerrado antes de empezar.
Ver servicios
