Optimizar imágenes para WordPress es importante para la velocidad de carga de tu sitio y su desempeño en general. En esta guía vamos a explicarte paso a paso todo el proceso de una buena optimización y todas las herramientas que pueden ayudarte.

Todos hemos visto como se ha popularizado el uso de elementos visuales dentro del marketing de contenidos y está claro que funciona muy bien. Estudios dicen que los posts con imágenes reciben un 94% más de visitas. Pero el uso de este tipo de archivos también afectar tu sitio, por eso en esta guía vamos a tocar el tema de como optimizar imágenes para WordPress, para que estas no tengan un impacto negativo en el performance de tu sitio.

Estos son los temas que vamos a tocar en esta guía…

Por qué necesitas optimizar imágenes para WordPress

Antes de empezar con los pasos del proceso de optimización, hablemos un poquito sobre porqué es tan popular usar elementos visuales en tu contenido y, más importante aún, porque debemos hacer una buena optimización de las imágenes.

Por qué debes usar imágenes en tu contenido

Muy sencillo, los post que incluyen imágenes obtienen un 94% más de visitas.

Las imágenes son el formato más popular en la web. Del 2016 al 2019 el uso de imágenes ha crecido un 106% en páginas móvil y 27% en escritorio.

Todo es porque esto de usar imágenes en tu contenido tiene muchos beneficios, por ejemplo…

• Tus posts son más atractivos visualmente y esto atrae al lector
• Te ayudan a comunicar información más compleja
• Crea una mejor estructura al romper el texto para evitar que parezca una lectura pesada
• Puedes mejorar el ranking de tu sitio en motores de búsqueda (asumiendo que has hecho una buena optimización de tus imágenes)
• Puede ayudar en la indexación de imágenes de Google
• Ayudan a destacar tu contenido cuando es compartido en redes sociales

Por eso y muchas otras razones el uso de imágenes dentro de tu contenido es importantísimo, casi inevitable.

Pero así como tiene muchos beneficios, también puede jugarte en contra, veamos porqué…

Por qué debes optimizar las imágenes

El motivo por el que debemos optimizar es más importante de lo que te imaginas: Las imágenes son el elemento más pesado en una página web.

Según el informe de HTML Archive, que rastrea el tamaño y cantidad de recursos de páginas web, las imágenes se llevan un 21% del peso completo de una página.

Sí, los videos obviamente son aún más pesados, pero su uso no es tan común como el de las imágenes. Ya hablaremos del uso de videos en WordPress en otro post.

El peso de la página significa…

El tamaño de los archivos necesarios para cargar una página, como el HTML, fonts, CSS, imágenes y otros, influyen en el tiempo total de carga. Esto es muy simple:

Página pesada = Carga lenta.

Y qué pasa con una carga lenta…

• Afecta la experiencia del usuario – Más del 50% de los usuarios de móvil abandonan un sitio que tarda más de 3 segundos en cargar
• Afecta el ranking de tu sitio – Google le da prioridad a los sitios rápidos
• Incremento de la tasa de rebote – Página que carga en 3s tiene una tasa de 11% mientras una que carga en 8s tiene una tasa de 59% (Pingdom)
• Utilizas más recursos en tu servidor
• Le haces gastar mas data móvil al usuario que entra a tu página

Si estás pensando… ¿Qué sé yo de optimizar CSS y esas otras cosas? No te preocupes, porque optimizar imágenes para WordPress es algo que todos podemos hacer sin necesidad de ser programador o diseñador. Sigue leyendo que ya te darás cuenta…

El impacto de optimizar imágenes para WordPress

Lo bueno de que las imágenes sean el elemento que más afecta el peso y la velocidad de la página es que:

• Cualquier persona lo puede hacer
• Optimizarlas las imágenes es lo que más impacto tendrá si estás tratando de mejorar la velocidad de tu sitio

Con un poco de esfuerzo es posible reducir drásticamente el peso y velocidad de carga de tu página.

¿Qué es la optimización de imágenes?

Las imágenes que no han sido optimizadas tienen exceso de peso que es totalmente innecesario. Cuando una persona entra a tu pagina pasa lo siguiente:

• El navegador del usuario está obligado a llamar y descargar toda esta información innecesaria
• Tu servidor está obligado a realizar un mayor esfuerzo y utilizar más recursos para enviarla
• El código CSS de tu sitio tiene que ajustar el tamaño de la imagen para que el usuario la pueda como corresponde

Por ejemplo, si tu sitio muestra las imágenes a un tamaño de 600 pixeles de ancho, no deberías subir imágenes con un ancho de 2000px

Por el contrario, una imagen que ha sido optimizada, solamente utiliza lo necesario.

Muchas veces cuando se habla del concepto de optimizar imágenes se reduce a tamaño y compresión, pero existen varios factores que influyen en esto:

• El formato que utilizas (JPG, PNG, etc.)
• Las dimensiones
• El tipo de compresión
• Como se muestran en la página
• La optimización para que carguen en la página

En otras palabras, una imagen en el formato correcto, que se ha cortado a la dimensión precisa, se ha comprimido y se muestra en tu página de forma correcta, ahorra recursos y carga rápidamente en el navegador.

Todos quedan satisfechos, el usuario, Google, tu servidor, el navegador y tú. 😉

Sigamos adelante ahora que tenemos una mejor idea de qué significa esto de optimizar imágenes para WordPress.

Cómo saber si tus imágenes necesitan ser optimizadas

Ahora nos encontramos con dos escenarios diferentes, si se trata de contenido nuevo y de imágenes que te preparas a subir a tu sitio, pues ya sabrás como optimizarlas antes, pero…

¿Qué pasa con las imágenes que ya están en tu sitio? ¿Cómo sabes si esas imágenes están afectando la velocidad de tu sitio?

Para esto vamos al laboratorio a realizar una prueba de velocidad. Te damos dos ejemplos y luego algunas opciones de herramientas que te ayudarán en este proceso.

Prueba de velocidad de carga de las imágenes

Vamos primero con GTMetrix, una herramienta gratuita que mide la velocidad de carga de una página y te da un informe detallado de los tiempos que cada recurso está tomando y recomendaciones de cómo mejorarlo.

En este ejemplo puedes ver (imagen de abajo) que el tiempo de carga de la página completa es de 10.8 segundos. Pero nosotros queremos saber cuales son las causas y cómo reducir ese tiempo, así que vamos más abajo y en la tercera línea encontramos que una de las recomendaciones es optimizar imágenes.

GTMetrix recomienda comprimir las imágenes en las lista para potencialmente reducir el peso en un 22%. Incluso te dice que imágenes específicas tienen el mayor potencial a una reducción de peso significativa.

En este ejemplo te mostramos como, en la prueba de velocidad de carga de Pingdom podemos ver que el peso de las imágenes representa el 48.35% del peso total de esta página.

Análisis de imágenes de Cloudinary

Pero, cuando se trata de medir la velocidad de carga de las imágenes específicamente, nuestra herramienta favorita aquí en WPCafeina, es el Image Analysis Tool de Cloudinary

Simplemente ingresas la dirección de cualquier pagina para que haga un análisis de las imágenes presentes y obtengas un informe de las que necesitan optimización.

No solamente te dice que imágenes necesitan compresión, Cloudinary te da información y recomendaciones mucho más detalladas, por ejemplo:

• El formato y peso de la imagen actual
• El potencial de reducir su peso si utilizas otros formatos
• Y su potencial si ajustas su tamaño

Otra cosa que nos gusta es que muestra la información de una manera mucho más clara. En la siguiente imagen por ejemplo, vemos que la imagen en nuestra página utiliza un formato JPG y pesa 47.3 KB, si cambiamos su formato a JPEG-XR podemos reducir su peso en un 59%, pero si la convertimos en PNG estaríamos subiendo en un 297.9%.

Además, el tamaño de la imagen que hemos subido al sitio es de 1024x536px, pero en realidad en el sitio se está mostrando a 896x469px, hacer ese ajuste tan fácil te baja el peso en un 59%.

Para terminar, Cloudinary ya ha hecho la optimización sugerida para que tu simplemente descargues la nueva versión. Incluso te da diferentes opciones de formatos y te indica la compatibilidad con cada navegador.

Por ejemplo, aquí vemos que la versión más liviana se ha logrado al convertirla al formato WEBP, pero este no es compatible con navegadores como Safari o Firefox, así que por ahora será mejor seleccionar el formato JPG.

Y así es como te enteras si las imágenes que ya están publicadas en tu sitio necesitan ser optimizadas o no.

Ahora vamos a hablar de cómo optimizar imágenes para WordPress, desde un principio.

Paso 1: Selecciona el formato correcto para una imagen

El primer paso de la optimización de imágenes para WordPress es seleccionar el formato correcto. El formato que utilices será clave para su calidad y también para su peso, por eso debes elegir bien.

Para saber qué formato utilizar en cada imagen, simplemente tienes que saber con qué tipo de imagen estás trabajando. Para definir esto lo más fácil posible, veamos qué formatos se usan en cada uno de los tipos de imagen:

Generalmente la decisión del formato esta entre JPG o PNG, pero existen otros que no debemos ignorar porque su uso puede beneficiarnos.

Formato JPG

Casi el 3% de todos los tipos de contenido en sitios son imágenes en formato JPG.

• Uso común: El formato JPG se utiliza más que nada para fotografías porque es capaz de mostrar millones de colores
• Compresión: Tiene varios niveles de compresión: alrededor del 60% está bien para uso en la web
• Compatibilidad: Es compatible con todos los navegadores y dispositivos que existen
• Cuando no debe usarse: JPG no usa transparencias, así que si estás usando una imagen con un fondo transparente, este no es el formato correcto

Este es un ejemplo del uso correcto del formato JPG:

Formato PNG

• Uso común: PNG se usa mas que nada en ilustraciones y en gráficos se usan transparencias
• Compresión: Es un formato sin pérdida que no tiene degradación de la calidad, pero generalmente es más pesado que el formato JPG
• Compatibilidad: Es compatible con todos los navegadores y dispositivos
• Cuando no debe usarse: En fotos porque puedes alcanzar una mejor balance de peso y calidad con un formato JPG

Este es un ejemplo del uso correcto del formato PNG:

Otros formatos de imágenes para web

Como dijimos antes, aunque estos formatos no son tan populares, pueden ayudarte en casos específicos.

Formato SVG

SVG es un formato vector, lo que significa que puede ajustar su tamaño sin perder calidad, cualquiera que sea la resolución de la pantalla del usuario.

Se usa mucho para logos, iconos y mapas, pero no para imágenes que son muy complicadas porque su peso puede subir rápidamente. Además, no es un buen formato para fotos.

Es un formato más liviano que JPG y PNG y es compatible con casi todos los navegadores y dispositivos, con la excepción de algunas versiones viejas de Internet Explorer.

Formato WEBP

WebP es un formato que probablemente será muy popular. Puede llegar a ser hasta 26% más liviano que PNG y entre 25-34% más que JPG.

También puede utilizar transparencias y además fue inventado por Google.

Y si el formato WebP es tan bueno… ¿Por qué no lo usamos para todo?

Porque es relativamente nuevo y todavía no es compatible con todos los navegadores, incluyendo Safari. Si quieres aprender más sobre su uso, puedes leer la pagina oficial de WebP.

Paso 2: Ajusta las imágenes a las dimensiones correctas

Uno de los errores mas grandes y más comunes es el uso de imágenes que no son ajustadas al tamaño correcto.

Por ejemplo subir una imagen de 1620×1620 pixeles cuando en tu sitio se muestra a 800x800px.

Lo que pasa es que, como dijimos antes…

• El navegador de tu usuario tiene que llamar y descargar la imagen a 1620x1620px
• Tu servidor tiene que enviar esa información usando más recursos
• El código CSS de tu sitio tiene que ajustar la imagen de 1620x1620px a 800x800px para mostrarlo correctamente
• Mientras tanto, la persona sigue esperando frente a su pantalla. Y peor aun si esta en un móvil, porque le estás consumiendo su data celular

Esto ha creado una descarga de 64,400 PIXELES TOTALMENTE INNECESARIOS. Y todo eso por no ajustar el tamaño a una imagen. :/

Esta es una tabla de ejemplos publicada por Google.

Cómo saber si tus imágenes están al tamaño que corresponde

¿Cómo sabes si las imágenes en tu sitio estén o no al tamaño que corresponde?

En realidad, esta pregunta nos gusta más… ¿Sabes de qué tamaño deben ser las imágenes en tu blog?

Aquí vamos a matar dos pájaros de un tiro porque, primero vamos a saber si tus imágenes tienen el las dimensiones correctas y segundo, nos vamos a enterar cuales son las dimensiones que necesitas usar en tus posts, de ahora en adelante.

Hay 2 formas de hacer esto muy rápido…

El Inspector de Chrome

Simplemente has un clic derecho encima de la imagen y selecciona “Inspect” para acceder al inspector de DevTools de Chrome (No tienes que instalar nada, esto es parte de tu navegador por defecto).

Esto te dará dos medidas, la primera es a que tamaño se está mostrando la imagen en tu sitio (esto se llama “Visualización”) y la segunda es el tamaño original de la imagen (llamada “Natural”). En el ejemplo de abajo puedes ver cómo la imagen se muestra a 300x200px, pero el original es de 400x266px.

Cloudinary

Ya hablamos de Image Analysis Tool de Cloudinary antes, así que no vamos a volver a explicar como funciona, pero si mencionar que esta es otra forma de enterarse rápidamente de las medidas de “Visualización” y “Natural” de las imágenes en la página.

Herramientas para ajustar el tamaño de las imágenes

Existen diferentes herramientas que puedes usar para ajustar las dimensiones de una imagen.

Programas de escritorio:

• Photoshop
• Gimp
• Affinity Photo

Herramientas en la web:

• BeFunky
• Canva
• Pixlr
• Social Image Resizer Tool
• PhotoResizer
• IloveIMG

Plugins de WordPress:

Los plugins de WordPress te permiten adaptar las imágenes que subes a tamaños específicos que tú determinas. Nosotros no recomendamos esto porque creemos que es mejor subir las imágenes a tu servidor ya ajustadas al tamaño que corresponde.

• Imsanity
• Resize Image After Upload
• Canvas Image Resize

Asegúrate de siempre ajustar el tamaño de tus imágenes antes de su comprensión y antes de subirlas a tu sitio.

Como dijimos, los plugins que ajustan las dimensiones una vez que haz subido las imágenes no nos gustan, pero si esta es la única forma que vas a poder hacerlo, es preferible que dejar el tamaño original.

Paso 3: Comprime los archivos de imágenes

Imagenes en paginas de WordPress representan un peso promedio de 1.19 MB

El archivo de una imagen contiene mucha información, alguna que es redundante y otra que es totalmente innecesaria para mostrarla en una página web obteniendo el mismo resultado visual.

La compresión de las imágenes es probablemente el paso más importante de este proceso porque es lo que más impacto tiene en la reducción de peso.

En esta sección vamos a explicarte los tipos de compresión y las herramientas que puedes usar.

Tipos de compresión

La clave de una buena compresión es encontrar un buen balance entre peso y calidad.

Existen dos tipos de compresión:

Lossless (Sin pérdida)

El método de compresión “Lossless” no reduce tanto el tamaño del archivo porque se enfoca en mantener la calidad de la imagen.

El formato PNG es de compresión Lossless.

Lossy (Con pérdida)

En cambio el método “Lossy” utiliza técnicas más avanzadas para reducir el peso, pero debes tener cuidado porque al mismo tiempo le baja la calidad a la imagen.

En este caso tienes que determinar el nivel de compresión que vas a aplicarle a la imagen. Por ejemplo, en un formato JPG puedes llegar a aplicar una compresión de 50% o hasta 60% y mantener una calidad aceptable para web.

Los formatos JPG y GIF son de compresión Lossy.

Herramientas de compresión de imágenes

La compresión de imágenes se puede hacer con diferentes herramientas, empecemos con Photoshop y luego te compartimos otras opciones en la web y también plugins para WordPress.

Compresión de imágenes en Photoshop

Photoshop te permite comprimir la imagen, para esto debes seleccionar “Save for Web”

La ventana de “Save for Web” te permite ajustar el nivel de calidad mientras comparas la versión original con la optimizada en el visualizador y al mismo tiempo ver el peso, de esta forma puedes ajustar hasta llegar al punto óptimo entre calidad y peso.

Herramientas de compresión de imágenes online

También existen muchas herramientas de compresión de imágenes en la web, en este caso lo que estás haciendo es comprimir la imagen antes de subirla a WordPress.

Estas son las más populares:

TinyPNG

TinyPNG es sin duda la herramienta de compresión más popular en la web.

Simplemente arrastrar las imágenes y el proceso da inicio, no te permite configurar ajustes, la herramientas hace la mejor compresión posible por ti. Es completamente gratis y te deja subir 20 imágenes de hasta 5MB al mismo tiempo.

ShortPixel

ShortPixel también es muy popular y también cuenta con un plugin para WordPress.

Tiene un límite de 50 archivos que puedes subir y 10 MB.

Squoosh

Squoosh es la nueva herramienta de compresión de Google.

Esta si te permite ajustar el nivel de calidad y además comparar el resultado en el visualizador. También es una herramienta gratuita.

Optimizilla

Optimizilla es la nueva herramienta de compresión de Google.

Muy similar pero con un visualizador lado-a-lado para comparar las dos versiones mientras ajustas el nivel de calidad. También tiene un límite de 20 imágenes al mismo tiempo y es gratis.

Otras herramientas de compresión en la web

Como dijimos, existe una gran variedad de herramientas online, así que aquí te dejamos el resto:

• Kraken
• Imagify
• Compressor
• Gift of Speed
• JPEGMini

Plugins de compresión de imágenes para WordPress

Si, es obvio que también existe una gran variedad de plugins para compresión de imágenes. La diferencia con esto es que la compresión sucede después de subir las imágenes a WordPress.

Estos son entonces los plugins de compresión más conocidos:

reSmush.it Image Optimizer

Muchos dicen que reSmush.it Image Optimizer es el mejor plugin de compresión. Tiene un rating de 4.5 estrellas y ha sido instalado en 60,000 sitios.

Con este plugin puedes comprimir las imágenes al momento de subir y también te permite comprimir todas las que ya están un sitio en un par de clics.

Tu puedes ajustar el nivel de compresión que quieras y ademas no tienes que preocuparte de perder el original, porque trabaja sobre una copia que genera automáticamente.

Compress JPEG & PNG images (de TinyPNG)

Compress JPEG & PNG images es el plugin de TinyPNG. A diferencia de su versión web, este plugin no tiene límites de peso.

La capacidades que tiene son similares, compresión al subir o de las imágenes ya publicadas en tu sitio.

EWWW Image Optimizer

EWWW Image Optimizer tiene más de 700,000 instalaciones y un excelente rating.

Aparte de las funciones comunes, también puede comprimir imágenes alojadas en Amazon S3 on en servicios de CDN, puede convertir las imágenes a formato WebP y es compatible con los más populares plugins de galerías de imágenes.

Smush Image Compression and Optimization

Por ultimo esta Smush Image Compression and Optimization, probablemente el más popular con más de 1 millón de instalaciones y un rating de 5 estrellas.

Aparte de lo ya mencionado, Smush cuenta con un detector de imágenes con dimensiones incorrectas, puede usarse en multi-sitios y también puede comprimir imágenes en CDN.

Bueno, creo que ahí tienes suficientes opciones para la compresión de imágenes. Como mencionamos antes, nosotros siempre preferimos hacer todo el proceso antes de subir las imágenes a WordPress, pero si eso funciona mejor en tu caso, es mejor que mostrar las imágenes en tu sitio sin compresión alguna.

¡A comprimir se ha dicho!

Paso 4: Usa un CDN para distribuir las imágenes

Un Content Delivery Network (CDN) es una red de servidores en diferentes partes del mundo y sirve para entregar el contenido de tu sitio de una manera más rápida por su proximidad al usuario que está visitando tu sitio porque la distancia también tiene un impacto en el rendimiento percibido.

En otras palabras, el CDN hace copias de tu contenido desde el servidor principal (tu hosting) y las almacena en diferentes servidores alrededor del mundo para hacer la carga de tu sitio más rápida.

Esto incluye código de CSS, Javascript y también las imágenes de tu contenido.

Estos son algunos de los CDN más conocidos:

Servicios de CDN gratis

Empecemos por los que tienen versiones gratis.

Cloudflare

Cloudflare es quizás el más conocido. Tiene más de 165 centros de datos alrededor del mundo para distribuir tu contenido.

Ademas cuenta con su propio plugin para WordPress que hace que la implementación sea sumamente sencilla.

Jetpack

Jetpack es un servicio de Automattic que hace muchas cosas. Recientemente adquirió Photon y ahora también puede ofrecer servicios de CDN para las imágenes de WordPress.

Tiene una opción gratis y además cuenta con su famoso plugin que seguramente habrás visto más de una vez.

Servicios premium de CDN

Y estos son algunos de los servicios de CDN de pago más conocidos.

StackPath

Nosotros utilizamos StackPath para el sitio de WPCafeina y algunos de nuestros clientes. Cuenta con 45 centros de datos en todos los continentes.

Ofrece el primer gratis y luego puedes suscribirte al paquete de $10/mes.

KeyCDN

KeyCDN es otro de los servicios populares. No tiene un costo fijo mensual y pagas por el uso según tu tráfico.

También cuenta con su propio plugin para que lo integres a WordPress.

Sucuri

Ya antes hemos hablado de Sucuri aquí en este blog porque es uno de las plataformas más robustas para la seguridad de WordPress, pero Sucuri también ofrece servicios de CDN.

Su plan básico tiene un costo de $199/año.

Un servicio de CDN puede acelerar la carga de las imágenes en WordPress de forma significativa, además del resto de tu contenido, en lugar de cargar desde tu propio servidor.

Si no conoces mucho de este tema, te aconsejamos empezar con CloudFlare, que es el más fácil de configurar y tiene un plan gratis.

Paso 5: Optimiza la carga de imágenes con Lazy Loading

El uso de Lazy loading en imágenes tiene el potencial de ahorrar 800 KB en la carga inicial de una página.

Empecemos por definirlo: Lo que hace el Lazy Loading es demorar la carga de las imágenes que todavía no aparecen en pantalla. Esto acelera la carga inicial de la pagina y recién empieza a cargar cada imagen a medida que se necesita cuando el usuario va bajando.

Este es un ejemplo de cómo aparecen las imágenes con lazy loading cuando todavía no aparecen en pantalla y luego como se carga completamente para mostrarse.

Pero si quieres ver claramente cómo funciona, visita esta demo.

El Lazy Loading es muy fácil de implementar en WordPress, aquí te compartimos un par de opciones…

WP-Rocket

Nosotros usamos y recomendamos WP-Rocket, que es un plugin de Cache para WordPress y tiene la opción de habilitar la funcionalidad de Lazy Loading.

Es tan sencillo como seleccionarlo dentro de sus opciones, como puedes ver en esta imagen…

Además, te da la opción de desactivar el Lazy Loading en paginas especificas.

WP-Rocket tiene un costo de $49 al año, sabemos que hay otros plugins de Cache que son gratis, pero en este caso vale la pena hacer esa pequeña inversión.

Plugins de WordPress para Lazy Loading

Y obviamente también existen los plugins que te pueden ayudar a implementarlo, aquí te compartimos los principales:

Lazy Load by WP Rocket

Si no tienes WP-Rocket para una solución de Cache completa, puedes usar su plugin Lazy Load by WP Rocket que es gratis y muy fácil de configurar.

Lazy Loader

Lazy Loader es otro plugin popular con más de 4,000 instalaciones y un rating de 4.5 estrellas.

Puede hacer lazy loading para imágenes, video y audio.

Otros plugins para Lazy Loading

Aquí te dejamos el resto de las opciones:

• BJ Lazy Load
• a3 Lazy Load
• Lazy Load XT
• Lazy Load Optimizer

Como ves, esto del Lazy Loading no es ninguna ciencia, pero sí puede ayudar muchísimo a la carga de las imágenes de una manera mucho más efectiva.

Crea un flujo de trabajo para optimizar imágenes para WordPress

Todo esto puede parecer mucho trabajo, pero una vez que agarres el ritmo lo podrás hacer muy rápido.

La mejor forma de hacerlo es creando un flujo de trabajo, ya sea que trabajes solo o en equipo, de esta forma sabes cada paso y quién es el responsable.

Nuestro checklist para optimizar imágenes para WordPress es así:

• Crear todos los gráficos (si son necesarios, por ejemplo en este post)
• Buscar imágenes
• Reunir todo el material visual que se va a usar para el post o página en una carpeta
• Ajustar los tamaños de todas la imágenes (ya sabiendo cuales son las dimensiones que se necesitan)
• Hacer save en el formato correcto (en realidad se hace como parte del paso anterior)
• Hacer la compresión de todas las imágenes
• Subir todas las imágenes a WordPress
• Agregar el SEO de las imágenes (Títulos y Alt Tags)
• Agregar cada imagen dentro del contenido desde la librería de WordPress

Hay que mencionar dos cosas aquí…

Primero que debes tratar de trabajar en bloques y no imagen por imagen, por ejemplo puedes hacer la compresión de todas las imágenes juntas o puedes subir todas las imágenes a la librería de WordPress, en lugar de hacerlo individualmente. Esto ahorra muchísimo tiempo.

Y segundo es que los demás pasos que hemos incluido en esta guía, como el uso del CDN para la distribución o implementar Lazy Loading, son cosas que ya están establecidas y no necesitas hacer nada dentro del flujo de trabajo.

Conclusión

Tenemos que ser sinceros y admitir que esto de trabajar con imágenes en el marketing de contenidos es una de las cosas más entretenidas, pero hay que hacerlo bien para darle una buena experiencia al usuario cuando visita tu sitio.

Aquí tienes todo lo que necesitas para hacer una optimización de imágenes para WordPress, esperamos que te sea útil y la guardes como referencia para el futuro.

¿Te gusto la guia? Ayúdanos a compartirla. 😉