Una de las claves del diseño web con WordPress actual, y más concretamente de la optimización SEO y WPO de nuestra página, es optimizar las imágenes para WordPress. En esta guía actualizada te cuento cómo hacerlo, con los formatos y las herramientas de hoy.
¿Por qué optimizar imágenes?
Las imágenes son uno de los elementos esenciales del diseño de un sitio web. Atraen la atención de los visitantes, permiten presentar una idea e influir en un punto de vista sin escribir ni una línea de texto.
Sin embargo, usar imágenes de buena calidad y alta resolución implica archivos muy pesados. Ese peso ralentiza tu web, empeora la experiencia de usuario y perjudica métricas como el LCP (las Core Web Vitals de Google), porque a menudo la imagen principal es lo que más tarda en cargar. Para ver imágenes grandes sin penalizar la velocidad, necesitamos comprimirlas y adaptarlas.
En este artículo te muestro los métodos que puedes usar en tu página web hecha con WordPress.
Conoce el peso, el tamaño y el formato de tus imágenes
Peso y resolución
Para empezar, debes saber cuánto pesa una imagen y qué resolución tiene. Puedes verlo en la biblioteca de medios de WordPress o en tu ordenador. No hay un tamaño perfecto: lo ideal es un equilibrio entre calidad y peso. Como orientación, una imagen de contenido suele estar bien por debajo de los 200–300 KB, y las imágenes grandes de cabecera, algo por encima pero sin pasarse.
Formatos de imagen
- JPG: ideal para fotografías, con muchos colores y degradados. Permite comprimir mucho.
- PNG: ideal para logotipos, iconos y gráficos, y cuando necesitas transparencia. Suele pesar más que un JPG en fotografías.
- WebP: formato moderno, con mejor compresión que JPG y PNG y compatible con todos los navegadores actuales. WordPress lo admite desde hace tiempo y hoy es mi opción recomendada.
- AVIF: aún más eficiente que WebP. WordPress lo admite en sus versiones recientes y su uso crece, aunque conviene comprobar la compatibilidad con tu plugin y tu hosting.
- SVG: para logos e iconos vectoriales, que se ven nítidos a cualquier tamaño y pesan muy poco.
Tamaño en píxeles
No subas una foto de 4000 × 3000 píxeles si en tu web se va a ver a 1200 píxeles de ancho. Como referencia, un ancho máximo de unos 1920 píxeles es suficiente para la gran mayoría de webs. WordPress, además, reduce automáticamente las imágenes enormes y genera varios tamaños de cada una para adaptarlas a cada dispositivo.
Hay dos momentos para optimizar las imágenes: antes de subirlas y una vez publicadas.
Comprimir imágenes antes de subirlas
Editor de fotografías
La primera opción es comprimirlas con un editor como Photoshop, GIMP o Affinity Photo. Suelen tener la opción «Guardar para web» o «Exportar como», con la que puedes ajustar el tamaño, la calidad y el formato.
Herramientas online para comprimir
Una de las más utilizadas, y la que uso yo en muchos de mis trabajos, es TinyPNG (que también comprime JPG y WebP). No hace falta registrarse: arrastras y sueltas tus imágenes, una o varias a la vez, y descargas las optimizadas. Puede reducir una parte muy importante del peso y mantiene la transparencia en los PNG. Otra excelente opción gratuita es Squoosh, de Google, que te permite comparar la calidad antes y después y convertir a WebP o AVIF.
Optimizar imágenes ya publicadas en WordPress
Una vez que las imágenes están en tu biblioteca, puedes comprimirlas automáticamente con un plugin. Algunos de los más usados son Smush, ShortPixel, Imagify y EWWW Image Optimizer. Todos tienen versión gratuita con límites y planes de pago, y casi todos pueden convertir tus imágenes a WebP y optimizar las nuevas cada vez que las subes.
En el caso de Smush, una vez activado, solo tienes que pulsar el botón de optimización masiva para que trabaje en el proceso. La versión gratuita limita cuántas imágenes procesa cada vez, así que si tienes muchas, tendrás que repetir el proceso.
Además, al configurar el plugin puedes limitar el tamaño máximo de las imágenes. Si subes fotos de 4000 × 4000 píxeles, no hace falta: pon como límite un ancho razonable (por ejemplo, 1920 px) y bajarás todavía más el peso.
Consejo: si subes pocas fotos, puedes tener el plugin inactivo cuando termine la compresión, y así tu web no tendrá que cargarlo en cada visita (aunque la optimización automática de nuevas imágenes es muy cómoda). También puedes apoyarte en un plugin de caché y optimización como WP Rocket.
Otras buenas prácticas con las imágenes
- Carga diferida (lazy loading): WordPress la aplica por defecto a las imágenes. Asegúrate de no aplicarla a la imagen principal de la parte superior de la página (la que se ve nada más entrar), porque ralentizaría el LCP.
- Indica siempre el ancho y el alto de las imágenes para evitar saltos de diseño mientras carga la página.
- Usa una CDN si tu web recibe visitas de distintos países.
- Revisa tu maquetador: si usas Elementor, evita imágenes de fondo gigantes y aprovecha las opciones de imágenes responsive.
Extra: describe bien tus imágenes para mejorar el SEO
Es esencial dar información sobre cada imagen para mejorar su posicionamiento y accesibilidad. En la biblioteca de medios de WordPress rellena el texto alternativo (alt), que describe lo que muestra la imagen, el título y, si procede, la descripción. Y ponle un nombre de archivo descriptivo antes de subirla (por ejemplo, «optimizar-imagenes-wordpress.webp» en lugar de «IMG_4521.jpg»).
Preguntas frecuentes
¿Qué formato de imagen es mejor para WordPress?
WebP es hoy la mejor opción general. Usa JPG para fotografías si necesitas máxima compatibilidad, PNG solo cuando necesites transparencia, y SVG para logos e iconos.
¿Cuánto debe pesar una imagen en la web?
No hay un número mágico, pero como regla general, cuanto menos, mejor: las imágenes de contenido, por debajo de unos 200–300 KB.
¿Optimizar imágenes mejora el SEO?
Sí: mejora la velocidad de carga, la experiencia de usuario y la presencia en Google Imágenes.
Por último, después de hacer esta optimización puedes comprobar si tu página ha mejorado en velocidad de carga. Si no sabes cómo, lee el artículo sobre ¿Cómo medir la velocidad de carga de tu web?
Si te ha gustado, déjame un comentario o comparte este artículo en redes sociales. ¡Me hará mucha ilusión!
