Mejore el rendimiento del sitio web optimizando automáticamente todas sus imágenes para cualquier dispositivo con Cloudimage
Publicado: 2020-04-22La optimización de imágenes es, según Lighthouse, uno de los problemas más comunes relacionados con la velocidad y el rendimiento deficientes de un sitio web.
Es posible que las imágenes no optimizadas estén ralentizando la velocidad de carga de su página en más de 9 segundos, en algunos casos incluso más.
Las páginas lentas conducen a una mayor tasa de rebote y un posicionamiento SERP más bajo, lo que a cambio significa menos tráfico y menos clientes que pagan.
¿Qué incluye la optimización de imágenes?
La optimización de todas las imágenes de tu sitio web es un trabajo muy complejo, que requiere experiencia y bastantes horas para hacerlo bien.
Los complementos pueden ayudar a ahorrar algo de tiempo, pero también pueden romper toda la estructura de su sitio web y eliminar permanentemente algunos de sus medios si no se manejan correctamente.
Para ver por qué consideramos que este es un trabajo complejo, aquí hay una lista de verificación de 20 puntos de lo que Cloudimage considera esencial para la optimización adecuada de la imagen:
- Incorporar la entrega de CDN
- Optimizar el TTFB
- Usar vista de producto de 360 grados
- Asegúrate de que tus imágenes sean responsivas
- Redimensionar correctamente las imágenes
- Usa el formato de imagen correcto
- Comprimir imágenes
- Optimizar atributos alternativos
- Título de las imágenes claramente
- Cuide los ángulos de su producto
- Saber mezclar colores
- Crea imágenes fusionadas con emociones
- Usar fondos correspondientes al producto
- Optimiza tus miniaturas
- Usar mapa de sitio de imagen
- Aplicar submuestreo de croma
- Carga diferida de imágenes no críticas
- Implementar spriting de imagen
- Comience a almacenar en caché activos de imagen
- Precargar activos de imagen críticos
Desde un aspecto técnico, los puntos más importantes de la lista anterior son el cambio de tamaño, la optimización del formato, la carga diferida, la compresión de imágenes, la capacidad de respuesta y la entrega de CDN.
Si tiene digamos 11.000 imágenes en su sitio web.
¿Cuánto tiempo llevará terminar de optimizarlos?
¡Ahora imagina poder hacer eso automáticamente!
Esto es lo que hace Cloudimage.
Puede cargar de forma masiva todas las imágenes a través de nuestro software y se cobrarán y cargarán automáticamente en la nube.
Después de eso viene la optimización.
Cambio de tamaño de imagen
Los servidores de cambio de tamaño de Cloudimage, ubicados en tres centros de datos en todo el mundo (Canadá, Francia y Singapur) descargarán su imagen original de origin_image_url, la transformarán según los parámetros de operación y filtro y, finalmente, la mostrarán en su sitio web o aplicación móvil a través de un cohete. - CDN rápido.
Un ejemplo con una imagen original alojada en su servidor web, depósito de Amazon S3 o cualquier otro almacenamiento accesible a través de HTTP.
Cuando especifica tanto el ancho como el alto, las proporciones de la imagen original pueden ignorarse o mantenerse. Además, puede optar por agregar relleno a la imagen. Cloudimage proporciona los siguientes modos de cambio de tamaño:
Cultivo
Mantiene las proporciones de la imagen cortando la imagen para que se ajuste al ancho y alto definidos.
Encajar
Cambia el tamaño de la imagen manteniendo las proporciones agregando relleno para satisfacer las dimensiones deseadas.
Ligado
Intenta cambiar el tamaño de la imagen manteniendo las proporciones. Similar al calce pero sin relleno.
Cubrir
Cambia el tamaño de la imagen al ancho y alto dados, ignorando las proporciones originales de la imagen.
Girar
Gira la imagen en un ángulo especificado, en sentido contrario a las agujas del reloj
Podar
Elimina un marco de un solo color alrededor de la imagen.
Compresión de imagen
Puede cambiar la compresión (formato de salida y calidad) de su imagen utilizando filtros de compresión.
Puede utilizar los filtros de compresión junto con las operaciones de cambio de tamaño y los filtros de imagen.
De forma predeterminada, Cloudimage entrega las imágenes como WebP. Si el navegador del cliente no admite el formato, recurre a JPEG o PNG.
Optipress: compresión de imágenes basada en aprendizaje automático
El principal desafío con la compresión JPEG es encontrar el factor de compresión más óptimo para cada imagen diferente.
Diferentes imágenes comprimidas con los mismos parámetros de compresión pueden dar como resultado una calidad percibida diferente.
Además, la misma imagen en diferentes tamaños puede requerir diferentes estrategias de compresión para lograr la máxima ganancia de tamaño sin pérdida de calidad visible.
Para superar esto, hemos desarrollado el algoritmo de compresión Optipress JPEG.
Optipress descubre el mejor enfoque de compresión de JPG analizando las características específicas de la imagen y los parámetros de compresión actuales.
Un modelo de Machine Learning determina la mejor estrategia de compresión para esta imagen.
Luego, la calidad se evalúa en función de un modelo de simulación del sistema visual humano para lograr una compresión óptima sin deterioro de la calidad perceptiva.
Ajustes preestablecidos de transformación
Si desea aplicar las mismas transformaciones en muchas imágenes, puede definir ajustes preestablecidos y aplicar transformaciones solo con el nombre del ajuste preestablecido (X).
p = X
Cualquier transformación de cambio de tamaño o filtro de imagen se puede incluir en un ajuste preestablecido, así como marcas de agua y parámetros de compresión de imagen.
Esto permite el proceso de optimización masiva que ahorra más del 50 % del tiempo de optimización de imágenes y cualquier persona involucrada puede hacerlo fácilmente.
Imágenes receptivas simplificadas
Las imágenes receptivas adaptan el tamaño de la imagen de acuerdo con el tamaño de la pantalla del usuario final, lo que permite que su sitio web o aplicación móvil se cargue más rápido en varios tamaños de pantalla.
El equipo de Cloudimage ha desarrollado un complemento JS para automatizar todo por usted.
Cloudimage JS lib adaptará todas sus URL automáticamente y ofrece Diseño receptivo integrado, Lazyloading y muchas más funciones para que su sitio web responda, sea rápido y agregue buenos efectos de carga a sus imágenes.
Con Lazy Loading y caché habilitado, puede estar seguro de que el tiempo de carga de su sitio web mejorará en al menos un 40%. Agregue CDN a eso y el porcentaje sube incluso al 60%.
Red de entrega de contenidos
Cloudimage aprovecha las redes de entrega de contenido para acelerar la entrega de sus imágenes en todo el mundo. Trabajamos con múltiples proveedores de CDN para optimizar la entrega de sus imágenes y brindar una excelente confiabilidad.
Además de acelerar sus imágenes, la CDN brinda protección DDoS (Distributed Denial of Service), que actuará como un escudo para sus servidores y evitará cualquier tiempo de inactividad.
Las CDN generalmente almacenan imágenes en caché durante el tiempo que los usuarios finales las soliciten.
Implementado en minutos
Lo que hace que Cloudimage sea único es que sus servicios se pueden implementar muy rápido.
Si su sitio web está experimentando picos de tráfico locos, siempre puede comunicarse con cloudimage, optimizar sus imágenes y asegurarse de que esos picos se absorban al instante.
Esto lo deja con un rendimiento impecable y una velocidad de carga de página rápida en varios dispositivos.
Además, la implementación es muy fácil y hace que el proceso de colaboración entre equipos (equipos a cargo del sitio web desde la producción de contenido hasta la publicación y el monitoreo) sea simple y eficiente.
Esto es especialmente importante cuando la mayoría de nosotros nos vemos obligados a utilizar nuestras oficinas en casa en el próximo período de tiempo.
Para obtener más información sobre cómo funcionan los servicios de Cloudimage, visítenos en cloudimage.io