Antes de empezar a optimizar las imágenes de nuestro WordPress, nos tenemos que preguntar con qué formato de imagen vamos a trabajar, cuál de ellos se adapta más a nuestras necesidades, por ejemplo, no utilizaremos el mismo formato para mostrar un logo que una fotografía de un producto.
Por qué debemos optimizar imágenes en WordPress
- Mejora la velocidad de carga de tu Sitio Web.
- Cuanto mayor sea la velocidad de carga de tu Sito Web, más aumentará la retención de tus visitantes.
- Optimización de recursos de tu servidor.
- Mejora la optimización SEO.
Tipos de formatos de imágenes
GIF
- Admite 256 colores (8 bits).
- Compresión sin pérdidas.
- Incluye transparencia.
- Ideal para logotipos, gráficos e infografías.
- GIF89a adecuado para crear pequeñas animaciones.
PNG
- PNG-8 Bits: 256 colores.
- PNG-24 Bits: 16 millones de colores.
Incluye transparencia mejorada.
Compresión sin pérdidas. - Ideal para logotipos y gráficos.
JPG
- Admite 16 millones de colores (32 bits).
- Permite compresión de tipo lossy o con pérdidas.
- A mayor nivel de compresión, peor calidad y menor tamaño.
- La mayoría de cámaras puede almacenar las fotografías en este formato.
- Es el formato más utilizado en Internet.
SVG
- Formato vectorial.
- Escalable sin pérdida de calidad.
- Tamaño reducido.
- Compatible con navegadores al 97%.
WEBP
- Formato de archivo de imagen de bitmap.
- Permite compresión con pérdida o sin pérdida de calidad.
- Desarrollado por Google.
- Alternativa mejorada a .GIF, .PNG y .JPG.
- Compatible con navegadores al 92%.
Cómo optimizar imágenes en WordPress
Elige el formato adecuado
- GIF: Imágenes con colores planos como logotipos, gráficos e infografías.
Está siendo sustituido por formatos más actuales como .png y .jpg - PNG: Imágenes con pocos colores.
Imágenes con texto, gráficos, logotipos y con fondos transparentes. - JPG: Formato de imagen más utilizado en Internet.
Ideal para fotografías o imágenes de calidad. - SVG: Priorizar el uso del formato .svg siempre que sea posible.
- WebP: Alternativa mejorada de los formatos .gif, .png y .jpg.
Problema de compatibilidad con todos los navegadores.
Comprime tus imágenes (peso)
Si puedes, utiliza el formato vectorial .SVG (revisar si hay problemas de compatibilidad).
Algoritmo de compresión (con o sin pérdida).
El formato .PNG no es recomendable utilizarlo para imágenes de gran tamaño porque usa una compresión sin pérdidas (lossless) y genera unos archivos más pesados.
El formato .JPG utiliza un sistema de compresión con pérdiad (lossey).
A mayor compresión, menor calidad de imagen y menor peso.
Hay que encontrar un equilibrio entre calidad de la imagen y un peso óptimo.
La resolución de una pantalla viene determinada por la cantidad de píxeles que puede representar.
El valor estándar de las pantallas de los ordenadores es 72 ppp.
La resolución recomendada para imágenes mostradas en la web es de 72 ppp.
Elegir tamaño correcto (redimensionar)
Sube las imágenes a la resolución en la que van a ser mostradas.
Si la imagen va a ser mostrada a 768×768, no la subas a un tamaño superior, por ejemplo 1024×1024, ya que tardará más en cargar.
Es recomendable que el peso de la imagen no supere los 100 kB.
Herramientas online para optimizar imágenes
Codecs: Son programas que emplean algoritmos de compresión para codificar/decodificar la información multimedia según el formato.
Se utilizan para comprimir archivos de imágenes, video y audio.
Gracias a estos codecs la transferencia será mucho más rápida y el archivo pesará menos.
Plugin de WordPress para optimizar imágenes
– Imagify (plugin gratuito con versión de pago)
- Genera imágenes en formato WebP (pesan menos), a partir de .JPG, PNG, GIF y PDF.
- Deber registrarte para obtener la clave API y poder utilizarlo.
- 200 imágenes gratis al mes aproximadamente (2O MB).
Tiene 3 niveles de comprensión: Normal, agresivo y ultra.Por defecto viene configurado con el modo agresivo activado y funciona perfectamente.
Desde la v2.0 ha desaparecido los niveles de compresión.- Sustituye las imágenes al formato WebP, si el navegador es compatible con el formato.
Aquí te dejo cómo optimizar tus imágenes con Imagify
– EWWW Image Optimizer (plugin gratuito con versión de pago).
Optimiza y convierte imágenes gif, png y gif o WebP.
El proceso de optimización se realiza en sus propios servidores.
– ShortPixel Image Optimizer (plugin gratuito con versión de pago).
Optimizer convierte imágenes JPG, PNG, GIF, WebP y Avif.
Deber registrarte para obtener la clave API y poder utilizarlo.
Optimiza 100 imágenes gratis al mes.
