Seleccionar página

El peso de las imágenes sigue siendo uno de los principales cuellos de botella para el rendimiento (Core Web Vitals) y el SEO de cualquier sitio web en WordPress. Tradicionalmente, solucionar esto requería plugins pesados de procesamiento en servidor, suscripciones con consumo de créditos API o herramientas externas. Cimo – Free Instant Image Optimizer & WebP Converter cambia radicalmente estas reglas del juego al procesar y convertir imágenes al formato de nueva generación WebP directamente en el navegador del usuario antes de subirlas al hosting.

En esta guía exhaustiva analizamos cómo funciona la versión gratuita de Cimo, qué valor aporta su versión Pro, cómo integrarlo en tu flujo de trabajo con Divi 4 / Divi 5 y qué buenas prácticas debes aplicar para optimizar tu web sin gastar recursos de servidor.

¿Qué es Cimo y por qué es un cambio de paradigma en WordPress?

Cimo es un plugin revolucionario de optimización de imágenes creado por Benjamin Intal (desarrollador principal de Stackable). A diferencia de los plugins de optimización tradicionales (como Smush, ShortPixel o EWWW), Cimo no utiliza el procesamiento de tu servidor web (CPU/RAM) ni envía las imágenes a un servidor o CDN de terceros.

El secreto técnico: Procesamiento en cliente mediante la API Canvas de JavaScript

Cuando arrastras una imagen PNG o JPG a tu panel de administración o al editor de WordPress, Cimo intercepta el archivo en tu navegador antes de que comience la subida. Utiliza la API Canvas de JavaScript del navegador para comprimir y convertir la imagen a formato WebP al instante. Lo que finalmente se envía y almacena en tu servidor es únicamente el archivo .webp optimizado.

Características clave de la versión Gratuita de Cimo

La versión gratuita de Cimo ofrece funciones potentes sin límites de créditos ni cuotas mensuales:

  1. Uso 100 % ilimitado y gratuito: No hay marcas de agua, ni límites de imágenes al mes, ni pagos por API.
  2. Cero consumo de servidor: Ideal para hostings compartidos o servidores con recursos ajustados, ya que tu servidor no ejecuta tareas pesadas de procesamiento de imagen (GD o Imagick).
  3. Conversión automática a WebP: Reduce el tamaño de los archivos entre un 70 % y un 90 % sin pérdida apreciable de calidad visual.
  4. Ajustes de calidad y redimensionamiento: Permite configurar el nivel de compresión WebP (por defecto al 80 %) y definir una dimensión máxima en píxeles (ancho/alto) para evitar la subida accidental de imágenes gigantescas.
  5. Control de miniaturas (Thumbnails): Opción para deshabilitar la generación excesiva de tamaños de imagen secundarios de WordPress y ahorrar espacio en disco.
  6. Privacidad garantizada: Al no transmitir datos a servidores externos, las imágenes nunca salen del navegador local antes de guardarse en tu propio sitio.

Nota de compatibilidad: Cimo funciona en todos los navegadores modernos como Google Chrome, Mozilla Firefox, Microsoft Edge y Opera. En Apple Safari, debido a limitaciones del navegador en la API Canvas, la imagen se optimiza manteniendo su formato original sin convertir a WebP.

¿Qué añade Cimo Premium (Versión Pro)?

Mientras que la versión gratuita se enfoca en las nuevas imágenes que subes, la versión de pago (Cimo Premium) amplia las capacidades del plugin para gestionar la biblioteca preexistente y agregar funciones avanzadas de rendimiento:

  • Optimización masiva en lote (Bulk Optimization): Permite procesar y convertir imágenes, vídeos y audios que ya existían en tu biblioteca de medios previa a la instalación de Cimo (todo ejecutado localmente en el navegador sin sobrecargar el servidor).
  • Placeholders de baja calidad (LQIP): Genera marcadores de posición (Low Quality Image Placeholders) de carga diferida (lazy loading) para los bloques de imagen, mejorando la experiencia visual del usuario mientras descarga el contenido final.
  • Optimización de Audio y Vídeo: Soporte extendido para compresión de archivos multimedia pesados.
  • Modo Oculto (Stealth Mode): Oculta por completo la interfaz y marca de Cimo dentro del panel de administración de WordPress, función indispensable para agencias de desarrollo web.

Cómo usar Cimo en WordPress con el maquetador Divi

Integra Cimo en tu flujo de trabajo con Divi para mantener la velocidad de tus páginas al máximo:

Paso 1: Instalación y activación

  1. Dirígete al panel de administración de WordPress: Plugins > Añadir nuevo plugin.
  2. En la barra de búsqueda escribe: Cimo.
  3. Haz clic en Instalar ahora y posteriormente en Activar.

Paso 2: Configuración recomendada en WordPress

  1. Ve al menú lateral en Ajustes > Cimo.
  2. Configura el WebP Quality Slider en 80% (equilibrio óptimo entre peso y calidad visual).
  3. En Max Image Dimension, establece un límite adecuado (por ejemplo, 1920 píxeles para banners o contenido principal).
  4. Guarda los cambios.

Paso 3: Flujo de trabajo en Divi

  • Desde la Biblioteca de Medios (Recomendado): Sube tus imágenes JPG o PNG en Medios > Añadir nuevo. Verás cómo Cimo las convierte al instante en archivos WebP livianos. Luego, en el Visual Builder de Divi, selecciona la imagen optimizada desde la biblioteca en cualquier módulo de Imagen, Blurb o Fondo de Sección.
  • Arrastrar y soltar (Drag & Drop): Al arrastrar archivos desde tu equipo directamente a la biblioteca o al editor, Cimo intercepta el proceso automáticamente.

Snippet de código: Desactivar la generación de tamaños de imagen innecesarios vía PHP

Si deseas maximizar el ahorro de espacio en disco en tu hosting junto con Cimo, puedes agregar este código PHP al archivo functions.php de tu tema hijo (Child Theme) de Divi o usando un plugin como Code Snippets:

<?php
/**
* Desactivar la creación de tamaños de imagen no deseados en WordPress
*/
function divicontent_desactivar_tama_os_imagen($sizes) {
    // Descomentar los tamaños que desees desactivar de la lista
    // unset($sizes[‘medium_large’]); // 768px
    // unset($sizes[‘1536×1536’]);   // 2x Medium Large
    // unset($sizes[‘2048×2048’]);   // 2x Large
   
    return $sizes;
}
add_filter(‘intermediate_image_sizes_advanced’, ‘divicontent_desactivar_tama_os_imagen’);
?>

Explicación del código línea por línea:

  • Línea 1-4: Declaración estándar de apertura PHP y encabezado explicativo.
  • Línea 5: Definición de la función personalizada divicontent_desactivar_tama_os_imagen que recibe el arreglo $sizes con los tamaños activos en WordPress.
  • Líneas 7-9: El comando unset() elimina del registro de WordPress las resoluciones adicionales especificadas. Si no las necesitas en tus maquetas de Divi, evitas que se generen copias redundantes en el servidor.
  • Línea 11: Devuelve el arreglo filtrado.
  • Línea 13: Aplica la función al gancho o filtro nativo intermediate_image_sizes_advanced.

Preguntas Frecuentes (FAQ)

¿Cimo guarda la imagen original en JPG o PNG en mi hosting?

No. A diferencia de otros plugins que guardan copias de respaldo de las imágenes originales ocupando doble espacio en disco, Cimo procesa la imagen en el navegador y únicamente sube la versión final comprimida en formato .webp (o la versión optimizada en formato original si usas Safari).

¿Puedo usar Cimo si ya tengo instalado otro plugin como Smush o Rank Math?

Sí. Sin embargo, no es necesario mantener un plugin de optimización de imágenes en el servidor activado en paralelo para las imágenes cargadas a través de Cimo, ya que tus archivos ya llegan en formato WebP con un tamaño mínimo.

¿Cimo ralentizará el panel de administración de mi hosting?

En absoluto. Dado que todo el trabajo pesado de compresión lo ejecuta la memoria RAM del ordenador o dispositivo desde el cual estás subiendo las imágenes, el consumo de CPU de tu servidor se mantiene en 0 %.

 

Referencias

Repositorio Oficial de WordPress: Cimo – Free Instant Image Optimizer & WebP Converter — https://wordpress.org/plugins/cimo-image-optimizer/
Sitio Web Oficial de Cimo Optimizer — https://wpcimo.com/
Red de Desarrolladores de Mozilla (MDN): API Canvas de JavaScript — https://developer.mozilla.org/es/docs/Web/API/Canvas_API
Documentación Oficial de Elegant Themes (Divi Performance) — https://www.elegantthemes.com/documentation/

Compartir:

Ir al contenido