Las imágenes pueden mejorar mucho una web, pero también convertirse en una de sus principales fuentes de peso, lentitud y problemas de accesibilidad. En WordPress, optimizarlas bien no consiste únicamente en comprimir archivos: también implica elegir formato, dimensiones, contexto, texto alternativo, carga responsive y una integración coherente con el contenido.
Google recomienda combinar calidad visual, velocidad y metadatos descriptivos. La clave es que la imagen tenga una función real en la página y que el navegador no tenga que descargar más información de la necesaria.
1. Empieza por la función de la imagen
Antes de subir un archivo, conviene responder una pregunta sencilla: ¿qué aporta esta imagen al usuario?
- explicar un concepto;
- mostrar un producto o servicio;
- apoyar una guía;
- reforzar identidad visual;
- servir como imagen destacada;
- ilustrar un caso concreto.
Si la respuesta es únicamente “rellenar espacio”, probablemente esa imagen no merece ocupar ancho de banda ni atención.
2. No subas una imagen mucho mayor de lo que vas a mostrar
Uno de los errores más comunes es cargar fotografías de varios miles de píxeles para mostrarlas después en una columna de 700 u 800 píxeles. WordPress puede generar tamaños intermedios, pero la plantilla debe utilizar realmente el tamaño adecuado.
El objetivo es que cada dispositivo reciba una versión razonable para su ancho y densidad, evitando descargar un archivo enorme en móvil cuando no aporta ninguna mejora visible.
3. Utiliza formatos modernos cuando encajen
WebP y AVIF permiten reducir peso en muchos casos manteniendo buena calidad visual. JPEG sigue siendo válido para fotografía y PNG puede tener sentido cuando necesitas transparencia o características concretas.
No existe un formato perfecto para todo. Lo importante es comparar calidad y tamaño real del archivo y comprobar que el flujo de WordPress, CDN y caché mantiene compatibilidad con los navegadores que necesitas soportar.
4. Comprueba que WordPress sirve imágenes responsive
WordPress genera diferentes tamaños y puede utilizar atributos responsive para que el navegador elija una versión adaptada a la pantalla. Esto ayuda especialmente en móviles y evita transferencias innecesarias.
Conviene revisar el HTML final, porque un constructor o una personalización puede terminar cargando siempre el archivo original aunque existan miniaturas optimizadas.
5. Cuida especialmente la imagen principal
La imagen que aparece en la parte visible al cargar una página puede influir mucho en el rendimiento percibido. Si además es el elemento visual principal, puede afectar al Largest Contentful Paint.
Por eso la imagen principal merece una optimización distinta a las imágenes situadas más abajo:
- dimensiones correctas;
- compresión equilibrada;
- prioridad de carga adecuada;
- sin dependencias innecesarias;
- espacio reservado para evitar movimientos de diseño.
La guía sobre Core Web Vitals en WordPress explica cómo relacionar este trabajo con LCP, INP y CLS.
6. No apliques lazy loading a todo sin criterio
Retrasar la carga de imágenes que están fuera del primer viewport puede ahorrar recursos, pero hacerlo sobre la imagen principal puede empeorar la percepción de velocidad.
La carga diferida tiene sentido para contenido que el usuario todavía no necesita. Para elementos prioritarios, la estrategia debe ser la contraria: facilitar que el navegador los descubra y descargue pronto.
7. Escribe un texto alternativo útil
El atributo alt describe el contenido y la función de una imagen cuando esta no puede verse y es especialmente importante para usuarios de lectores de pantalla. Google también utiliza ese contexto para comprender mejor la temática de la imagen.
Un buen alt no es una lista de palabras clave. Debe describir de forma breve lo que aporta la imagen dentro de esa página.
Ejemplo conceptual
- Poco útil: “SEO WordPress posicionamiento web mejor SEO”.
- Mejor: “Panel de Search Console con evolución de clics e impresiones”.
Si una imagen es puramente decorativa, puede ser preferible que no añada ruido al lector de pantalla. La decisión depende de la función real del elemento.
8. Usa nombres de archivo descriptivos
Antes de subir un archivo, cambia nombres como IMG_4839.jpg por otros que expliquen su contenido, por ejemplo auditoria-seo-search-console.webp.
El nombre del archivo es una señal secundaria, pero además mejora organización, mantenimiento y búsqueda dentro de la biblioteca de medios.
9. Coloca la imagen cerca del texto relacionado
Una imagen se entiende mejor cuando aparece en un contexto coherente. Google recomienda que las imágenes estén cerca de texto relevante y en páginas cuyo tema coincida con lo que representan.
Esto también mejora la experiencia del usuario: no obliga a interpretar una captura o una ilustración sin saber qué quiere explicar.
10. Evita incrustar contenido importante solo como fondo CSS
Si una imagen es informativa y forma parte del contenido, conviene que se inserte como imagen HTML en lugar de depender únicamente de un fondo decorativo. Google puede descubrir imágenes estándar mediante los elementos de imagen del documento, mientras que los fondos CSS tienen otra función.
Los fondos siguen siendo útiles para ambientación visual, siempre que no contengan información esencial que desaparezca para usuarios o rastreadores.
11. Revisa la imagen destacada y Open Graph
Una entrada puede tener una imagen correcta dentro del contenido pero compartir en redes una imagen equivocada si la configuración Open Graph no está alineada. Conviene comprobar qué recurso se está declarando como imagen destacada y qué imagen aparece en los metadatos sociales.
La imagen elegida debería ser representativa de la página, nítida y con una proporción razonable.
12. No dupliques archivos sin necesidad
Subir varias veces la misma imagen con nombres distintos complica la biblioteca y puede aumentar almacenamiento. Cuando un mismo recurso es válido para varias páginas, puede reutilizarse; cuando el contexto exige una imagen específica, conviene crear una variante que realmente aporte información distinta.
13. Optimiza también las imágenes antiguas
Una web que lleva años publicando contenido puede acumular cientos de archivos demasiado pesados. En ese caso, conviene priorizar:
- imágenes de páginas con más tráfico;
- hero y cabeceras principales;
- entradas que posicionan;
- medios de mayor tamaño;
- archivos sin texto alternativo cuando sean informativos.
No es necesario rehacer toda la biblioteca en una sola intervención. Una estrategia por impacto reduce riesgo y esfuerzo.
Checklist para cada imagen nueva
- ¿aporta algo al usuario?
- ¿las dimensiones son adecuadas?
- ¿el formato es razonable?
- ¿el peso está optimizado?
- ¿WordPress sirve tamaños responsive?
- ¿el alt describe la función real?
- ¿el nombre del archivo es comprensible?
- ¿está cerca del contenido relevante?
- ¿la carga diferida está bien aplicada?
- ¿la imagen destacada y Open Graph son correctas?
SEO de imágenes y rendimiento deben trabajar juntos
Optimizar imágenes no es una tarea aislada de SEO ni una tarea aislada de rendimiento. Afecta a experiencia móvil, accesibilidad, Core Web Vitals, descubrimiento en buscadores y percepción de calidad.
En una estrategia SEO para WordPress, las imágenes deberían auditarse como parte del contenido y del rendimiento real de cada plantilla. Si el problema está en la carga general del sitio, también conviene revisar arquitectura, tema, plugins y recursos de terceros.
