La optimización de imágenes es una de las mejoras de mayor impacto en la velocidad de WordPress. En MD3 Digital Solutions creamos esta guía para que sus imágenes trabajen a su favor.
Las imágenes son una de las principales causas de que un sitio WordPress sea lento. Estudios de Google muestran que las páginas que tardan más de tres segundos en cargar pierden más de la mitad de sus visitantes. Optimizar sus imágenes es una de las cosas más rápidas y de mayor impacto que puede hacer para mejorar el rendimiento de su sitio, la experiencia del usuario y su posicionamiento en los buscadores.
En esta guía repasamos estrategias comprobadas de optimización de imágenes, con ejemplos reales que puede aplicar hoy mismo en su sitio WordPress.
Las imágenes sin optimizar pueden arruinar en silencio el rendimiento de su sitio web. Por eso debería ser una prioridad:
Piense en un fotógrafo independiente que creó un portafolio en WordPress con imágenes en alta resolución sacadas directamente de la cámara. Cada foto pesaba aproximadamente 8–12 MB. La página de inicio tardaba más de 18 segundos en cargar con una conexión móvil.
Después de comprimir las imágenes, convertirlas a formato WebP y activar la carga diferida, la misma página cargaba en menos de 2,1 segundos. El fotógrafo tuvo un aumento del 40% en los formularios de consulta recibidos durante el primer mes después del cambio.
Elegir el formato de imagen correcto es la base de la optimización. Cada formato tiene un propósito distinto:
Una tienda de ropa en línea subía las fotos de sus productos como archivos PNG de 4 MB cada uno en promedio. Después de pasar al formato WebP con el plugin Imagify, las mismas imágenes pesaban en promedio 350 KB, una reducción de más del 90%, sin ninguna diferencia visible de calidad en las páginas de productos.
La compresión de imágenes reduce el peso del archivo eliminando datos innecesarios. Hay dos tipos:
Uno de los errores más comunes y costosos en WordPress es subir imágenes mucho más grandes de lo que nunca se van a mostrar. Si el área de contenido de su blog mide 800 px de ancho, no hay razón para subir una imagen de 4000 px de ancho.
Un blog de cocina popular subía las fotos de sus recetas a 5000 x 3500 píxeles, directamente desde una cámara réflex. El tema del blog mostraba esas imágenes a un máximo de 900 x 600 píxeles. Al ajustarlas a 1800 x 1200 píxeles antes de subirlas (para las pantallas Retina), el autor redujo el peso promedio de las imágenes de 7 MB a menos de 400 KB, sin ninguna diferencia visible para los lectores.
Puede ajustar el tamaño de las imágenes antes de subirlas con herramientas gratuitas como:
La carga diferida (lazy loading) retrasa la carga de las imágenes que no se ven en la pantalla hasta que el usuario se desplaza hacia ellas. Esto mejora muchísimo el tiempo de carga inicial, sobre todo en las páginas largas.
Desde WordPress 5.5, la carga diferida viene activada por defecto en las imágenes mediante el atributo HTML nativo loading="lazy". No necesita un plugin para la carga diferida básica, pero plugins como Smush y WP Rocket ofrecen una carga diferida mejorada con más opciones de personalización.
Un sitio inmobiliario tenía páginas de propiedades con hasta 40 fotos por propiedad. Sin carga diferida, las 40 imágenes cargaban al mismo tiempo y la página tardaba más de 12 segundos en volverse interactiva. Después de activar la carga diferida, la página era interactiva en menos de 3 segundos, porque al principio solo cargaban las primeras imágenes visibles.
Una red de distribución de contenido (CDN) guarda copias de sus imágenes en servidores de todo el mundo y se las entrega a cada visitante desde el lugar más cercano. Esto reduce la latencia y acelera muchísimo la entrega de imágenes para el público internacional.
Una tienda de productos artesanales con sede en Nueva York tenía una tasa de rebote alta entre los visitantes de Australia y Europa. Después de implementar la CDN de Cloudflare, el tiempo de carga de las imágenes para los visitantes internacionales bajó de 8–10 segundos a menos de 2 segundos, y las conversiones internacionales aumentaron un 28% en el trimestre siguiente.
WordPress genera automáticamente varios tamaños de cada imagen que usted sube: miniatura, mediano, grande y tamaño completo. Además, permite que los temas y plugins registren tamaños propios. Con el tiempo, esto crea miles de archivos de imagen innecesarios en su servidor.
Use el plugin Regenerate Thumbnails después de cambiar de tema o los ajustes de tamaño de imagen para limpiar los tamaños obsoletos. El plugin Imagify también permite desactivar los tamaños que no usa para ahorrar espacio.
El texto alternativo no es solo un requisito de accesibilidad: también es una señal importante para el SEO. Los lectores de pantalla usan el texto alternativo para describir las imágenes a las personas con discapacidad visual, y los buscadores lo usan para entender su contenido.
WordPress agrega automáticamente el atributo srcset a las imágenes, que le indica al navegador qué tamaño de imagen cargar según el tamaño y la resolución de la pantalla del visitante. Así, quien navega desde un teléfono carga un archivo más liviano y quien usa una computadora, uno más grande.
Asegúrese de que su tema siga los estándares modernos de WordPress para aprovechar al máximo esta función. Los temas creados después de WordPress 4.4 normalmente admiten imágenes adaptables sin configuración adicional.
La optimización de imágenes no es una tarea que se hace una sola vez. A medida que agrega contenido nuevo, entran a su biblioteca de medios nuevas imágenes sin optimizar. Use estas herramientas para revisar y mantener sus imágenes en buen estado:
La optimización de imágenes es una de las mejoras de mayor impacto y menor esfuerzo que puede hacerle a un sitio WordPress. Como muestran los ejemplos reales de esta guía, desde portafolios de fotografía hasta tiendas en línea con clientes en todo el mundo, los resultados se pueden medir y muchas veces son enormes. Empiece con una herramienta gratuita como Google PageSpeed Insights para identificar sus mayores problemas con las imágenes y luego aplique las estrategias anteriores paso a paso.
Incluso las mejoras más pequeñas en la optimización de sus imágenes pueden traducirse en tiempos de carga más rápidos, mejor posicionamiento, menos rebote y, al final, más conversiones e ingresos para su sitio WordPress.
AI assistant — answers may be inaccurate.
