Cómo optimizar las imágenes de WordPress y hacer que su sitio sea MÁS RÁPIDO

Si desea brindar una excelente experiencia de usuario a su visitante, deberá asegurarse de que su sitio web se cargue más rápido, para que no lo frustre. De hecho, la velocidad de su sitio web puede hacer o deshacer su negocio en línea. DEBE optimizar las imágenes de WordPress para hacer que su sitio sea más rápido, porque las imágenes suelen ser la parte más pesada de su contenido,

Walmart ha encontrado un 2% de aumento en su tasa de conversión siempre que mejoraran la velocidad en 1 segundo.

Y también debes Amazon encontró un aumento en los ingresos del 1% por cada 100 milisegundos de mejora en la velocidad de su sitio. Estas estadísticas indican que hacer que su sitio web sea rápido es fundamental para su sitio web. Una forma fácil de hacer que su sitio web sea más rápido es optimizando todas las imágenes en su sitio web de WordPress.

Contenido[Mostrar]
 

optimizar las imágenes de wordpress para mejorar las tasas de conversión

Si aún no ha considerado la velocidad de su sitio web de WordPress como un componente crítico de su negocio, tendrá que pensarlo nuevamente y comenzar a tomar medidas para mejorar la velocidad de su sitio web de WordPress.

Recomienda leer: Cómo conseguir un sitio web rápido de WordPress: una guía completa [25 acciones]

Hay muchas formas de hacer que su sitio web sea más rápido. Algunos de ellos se enumeran a continuación.

  • Evite usar demasiados complementos de WordPress
  • Utilice los servicios de WordPress CDN
  • Optimizar la entrega de CSS
  • Optimizar las imágenes de WordPress

Las imágenes que no se han optimizado para la web suelen ser grandes. Estas imágenes tardarán más en cargarse. Es importante que optimices tus imágenes haciéndolas lo más pequeñas posible. Sin embargo, la mayoría de las veces, el proceso de optimización de imágenes para WordPress y su sitio web es tedioso u obstaculiza la producción de contenido.

En esta publicación, explicaremos diferentes formas de optimizar sus imágenes de WordPress y así hacer que su sitio se cargue más rápido.

Comprime imágenes o guárdalas para la web

Es obvio que el tamaño de su imagen puede influir en el tiempo de carga de su sitio web de WordPress. Como las imágenes de alta resolución tendrán un tamaño de archivo mayor, siempre es mejor comprime las imágenes antes de subir.

Ahora es posible que tenga una pregunta: ¿qué es la compresión de imágenes de WordPress y cómo puede reducir el tamaño sin afectar la calidad?

La compresión es el proceso de disminuir drásticamente el tamaño de la imagen mediante la eliminación algorítmica de la información de la imagen que el ojo humano no puede percibir. Esta es una forma muy eficaz de optimizar las imágenes de WordPress.

Aunque la compresión de imágenes es un método seguro para reducir el tamaño de la imagen, cuando se trata de comprimir archivos JPEG, a veces el proceso pierde el contenido real de las imágenes durante el proceso. Este es el único inconveniente de este enfoque. Recuerde comprobar cuidadosamente los resultados posteriores a la compresión para asegurarse de que está satisfecho con los resultados de la compresión.

WP Smush es un popular complemento de WordPress que le permite reducir fácilmente el tamaño del archivo de imagen escaneando cada imagen que carga y eliminando información de datos innecesaria. La versión gratuita de este complemento le permite comprimir imágenes de hasta 1 MB de tamaño, mientras que, con la versión pro, puede comprimir imágenes de hasta 32 MB.

Puede descargar WP Smush aquí.

wp smush para optimizar imágenes de wordpress

Tenga en cuenta también que este complemento le permite optimizar todas las imágenes recién cargadas a su sitio web de WordPress. Si desea comprimir las imágenes existentes, puede usar el enlace Bulk Smush.it debajo de la pestaña de la biblioteca de medios para optimizar las imágenes existentes de WordPress.

Carga diferida: optimiza el tiempo de carga de las imágenes de WordPress

[ACTUALIZACIÓN: WordPress 5.4 tiene carga diferida integrada en el núcleo, por lo que solo necesita realizar esta acción si su versión de WordPress está por debajo de esta versión]

Todos sabemos que "Una imagen vale más que mil palabras".

Pero usar demasiadas imágenes en una sola página puede hacer que su sitio web se cargue más lento.

Una forma sencilla de mejorar el tiempo de carga es eliminar las imágenes innecesarias y conservar solo las que son absolutamente necesarias. Sin embargo, no todos quieren reducir la cantidad de imágenes que se utilizan en una página web, solo para que la página se cargue más rápido.

¿Cómo se puede solucionar este problema?

Es posible que ya lo haya notado: los sitios web que usan muchas imágenes en cada página resuelven este problema haciendo que la imagen se cargue solo cuando es visible para el usuario. Esta táctica no solo reduce el tiempo de carga de la página, sino que también ahorra ancho de banda del servidor. Esto se llama carga diferida. Debido a que la imagen es "perezosa", solo aparece cuando se necesita.

Si está en WordPress, es más fácil hacer que la imagen se cargue solo cuando está visible. Todo lo que necesita hacer es instalar un complemento de carga diferida. Una vez más, esta es una excelente manera de optimizar las imágenes de WordPress para mejorar la velocidad.

Usted puede descargar el Complemento de carga diferida aquí.

Optimiza las imágenes de wordpress con carga diferida

Este complemento no necesita ninguna configuración adicional, ya que funciona de inmediato tras la instalación y activación.

Leer más: Divi vs Elementor

Utilice el formato de imagen correcto y optimizado

JPEG, PNG y GIF son los formatos de imagen más populares.

Conocer las diferencias entre cada formato de imagen te permite usar el formato correcto en tu sitio web, lo que incluso te ayuda cuando se trata de optimizar la imagen.

¿Qué formato es mejor para las imágenes optimizadas de sitios web de WordPress y cuándo debería usarlo? A continuación se presentan algunos consejos:

  • GIF: Use GIF cuando su imagen sea demasiado pequeña y use un less número de colores. Por ejemplo, GIF es una buena opción para imágenes prediseñadas, viñetas y gráficos. Por otro lado, las imágenes complejas con mejoras como sombras paralelas no se podían mostrar correctamente usando GIF.
  • JPEG / JPG: Es adecuado para imágenes complejas con muchas variaciones de color o si contiene imágenes fotográficas.
  • PNG: El formato PNG es el más adecuado para imágenes transparentes.
  • WebP: este es el mejor formato en estos días, pero la creación de estas imágenes requiere soporte de servidor en su sitio web

Tenga en cuenta que estas son solo recomendaciones generales. Como cualquier regla, hay excepciones y algunas de estas reglas están destinadas a romperse.

Hacer un uso efectivo de la caché del navegador

Cuando cargue imágenes en una página web, asegúrese de cargarlas en un solo directorio. Cargar sus imágenes en un solo directorio en una página web ayudará al navegador a cargar fácilmente esas imágenes usando la caché del navegador durante visitas repetidas.

Está bien si está cargando imágenes a través del cargador de imágenes predeterminado de WordPress. Pero, por ejemplo, si está creando páginas de destino HTML en WordPress, es probable que no utilice el cargador de imágenes predeterminado de WordPress. En estos casos, en lugar de cargar las imágenes de una página web en diferentes directorios, asegúrese de cargarlas todas en un solo directorio.

Si desea leer más sobre el almacenamiento en caché del navegador y cómo aprovecharlo, consulte nuestro artículo detallado aquí: Cómo aprovechar el almacenamiento en caché del navegador en WordPress con o sin un complemento [5 formas]

 

Usa la misma imagen varias veces

Otra forma de utilizar el almacenamiento en caché del navegador para reducir el ancho de banda de la imagen es utilizando las mismas imágenes varias veces en todo el sitio.

Por ejemplo, cuando usa logotipos o elementos de menú de una página, asegúrese de llamar a las mismas imágenes en todo el sitio, para que los usuarios no necesiten descargarlas varias veces, pero una vez, y los navegadores pueden mostrar las imágenes desde el navegador. cache.

Mientras usa un fondo con textura, asegúrese de usar imágenes más pequeñas repetidamente en lugar de usar una sola imagen grande. Esto también puede ayudar a reducir el tiempo de carga.

De forma predeterminada, cuando carga imágenes usando el cargador de medios en el panel de WordPress, va a la carpeta dependiendo de cuándo lo cargue. Eso significa que todas las imágenes que se cargan en un mes se ubicarán en un solo directorio.

Por ejemplo, si carga una imagen en enero de 2021, se ubicará en este directorio: wp-content / uploads / 2021/01.

Veamos los beneficios de cargar a través del cargador de medios y luego, le diremos lo que debe considerar cuando no esté cargando a su cargador de medios para acelerar su sitio web.

El cargador de medios hace que la imagen se cargue más rápido: La carga será más rápida si las imágenes se almacenan en la misma carpeta mientras se navega por una página web. Cuando las imágenes se llaman repetidamente, el navegador puede recuperarlas fácilmente del caché del navegador si están en una sola carpeta.

A menudo, sin embargo, los bloggers de WordPress no usarán el cargador de medios predeterminado, especialmente mientras trabajan en una página de destino personalizada. En aras de la facilidad, cargan imágenes en un directorio separado.

En tales casos, asegúrese de cargar todas las imágenes de esa página en un solo directorio en lugar de cargarlas en varios directorios. Esta táctica puede mejorar el tiempo de carga, ya que el almacenamiento en caché del archivo será más fácil durante las visitas repetidas.

Usa CSS en lugar de imágenes

¿Sabes que puedes mejorar el tiempo de carga si no utilizas ninguna imagen?

Por ejemplo, es totalmente posible generar ciertas formas usando CSS simple en lugar de imágenes como rectángulos redondeados, degradados, sombras e imágenes transparentes. Dicho esto, asegúrese de estar atento a la verificación de compatibilidad del navegador cada vez que reemplace cualquier imagen con CSS porque no todos los navegadores son compatibles con estas técnicas.

Sobre el autor
Shahzad Saeed
Autor: Shahzad SaeedPagina Web: http://shahzadsaeed.com/
Shahzaad Saaed ha aparecido en una gran cantidad de sitios web de autoridad, como experto en WordPress. Se especializa en marketing de contenidos para ayudar a las empresas a aumentar su tráfico.

Una cosa más... ¿Sabías que las personas que comparten cosas útiles como esta publicación también se ven IMPRESIONANTES? ;-)
Por favor deja un eficiente Comente con sus pensamientos, luego comparta esto en su (s) grupo (s) de Facebook que lo encontrarán útil y cosechemos los beneficios juntos. ¡Gracias por compartir y ser amable!

Divulgación: Esta página puede contener enlaces a sitios externos para productos que amamos y recomendamos de todo corazón. Si compra productos que le sugerimos, es posible que ganemos una tarifa de referencia. Tales tarifas no influyen en nuestras recomendaciones y no aceptamos pagos por reseñas positivas.

Autor (es) destacado en:  Logotipo de la revista Inc   Logotipo de Sitepoint   Logotipo de CSS Tricks    logotipo de webdesignerdepot   Logotipo de WPMU DEV   y muchos más ...