Mejore las imágenes en WordPress para acelerar las cosas

Mejore las imágenes en WordPress para acelerar las cosas

Crecí en un pequeño pueblo de Costa Rica donde solo tenía Internet de 6k / seg (56k hubiera sido un sueño hecho realidad), así que cuando se trata de optimizar un sitio para la velocidad, soy muy exigente. Todavía me estoy reduciendo para que los sitios se carguen lo más rápido posible. Creo que en un momento WPExplorer.com tuvo una clasificación de velocidad de página de Google de 97-98. Por supuesto, ahora con botones de redes sociales y cosas que tuve que adaptar.

Aparte de la codificación general de su tema de WordPress, el otro factor que tiene un gran efecto en la velocidad de su sitio son las imágenes. Los temas de WordPress en estos días son extremadamente “pesados ​​en imágenes” y, por supuesto, tomaré algo de eso porque me gusta agregar imágenes destacadas siempre que sea posible 🙂

Este es solo un artículo rápido con algunos consejos sobre cómo puede ayudar a optimizar las imágenes en su sitio para aumentar los tiempos de carga de su sitio. Si eres un usuario de WordPress o un desarrollador de temas, este artículo puede ayudarte un poco. ¡No dudes en publicar más consejos en los comentarios!

Consejos para acelerar el tiempo de carga de imágenes

A continuación, encontrará algunos consejos generales para que sus imágenes se carguen rápidamente en su sitio. Nada especial, solo algunas sugerencias:

  • Los archivos JPG tienden a tener tamaños de archivo más pequeños que los PNG
  • Cuando utilice Photoshop, asegúrese de guardar su imagen “para la web”
  • No use etiquetas IMG de ancho y alto para cambiar el tamaño de sus imágenes, recórtelas tanto como sea posible
  • Asegúrese de configurar los atributos de ancho y alto para que el navegador no tenga que hacer ningún trabajo

Complementos y servicios de optimización de imágenes

A continuación se muestran varios servicios y algunos complementos de WordPress que pueden ayudarlo a optimizar sus imágenes para reducir el tamaño de sus archivos y / o acelerar la carga de imágenes en su sitio.

Smush it y el complemento WP Smush.it

Yahoo Smush It

Smush.it es un servicio increíble creado por Yahoo que le permite cargar imágenes y eliminar archivos meta innecesarios o aplanar png para reducir su tamaño de archivo. Puede visitar su sitio para optimizar sus imágenes, pero aún mejor, ofrecen una API que hace la optimización (excepto para eliminar los metadatos JPEG).

Alex Dunae creó el WP Smush.it plugin que utiliza API para que pueda sobrescribir automáticamente las imágenes en su sitio de WordPress con tecnología al cargar.

Este es uno de los mejores complementos de optimización de imágenes del mercado y querrá tenerlo en todos.

de sus sitios.

PunnyPNG

PunnyPNG es otro alarde del servicio de compresión de imágenes que recomiendo a los desarrolladores de temas.

PunnyPNG lleva smush.it un paso más allá para optimizar aún más sus imágenes y es ideal para imágenes de sus archivos de temas que se cargan en todas sus páginas.

Uso de una CDN (red de entrega de contenido)

Red de entrega de contenidos

La forma más eficaz de aumentar la carga de imágenes en su sitio es probablemente el CDN – Content Management System. Una CDN es básicamente una red de computadoras que mantendrá copias de sus datos en diferentes nodos de una red y brindará a sus visitantes los datos de la ubicación más cercana al visitante. Esto puede ayudar a reducir drásticamente el tiempo de carga de las imágenes en su sitio.

Todos los “mejores perros” utilizan los servicios CDN y esto puede marcar una gran diferencia en los tiempos de carga. Puede ser bastante caro, por lo que la mayoría de los blogueros probablemente no usarán uno, especialmente si no tienen mucho tráfico.

Para desarrolladores: use la imagen destacada de WordPress Al lugar Por Timthumb

Imágenes destacadas de WordPressMuchos desarrolladores de temas (ese era yo en ese momento) usan el script TimThumb para cambiar el tamaño de las imágenes automáticamente. El problema con este script es que se ejecuta cada vez que se cargan las páginas (siempre que las imágenes no estén ya almacenadas en caché), por lo que lleva tiempo ejecutar el script y guardar la imagen almacenada en caché. Además, esta es una secuencia de comandos hambrienta de base de datos, especialmente si tiene muchas páginas en su sitio y está alojado en algún lugar como la cuadrícula de MediaTemple, esto tomará una gran parte de su uso mensual de GPU.

Por otro lado, al establecer tamaños de imagen específicos para las imágenes que se muestran, todas sus imágenes se recortarán al cargarlas (o cuando ejecute el complemento Regenerate Thumbnails) y no tendrá que ejecutar un script solo para ver una imagen en el sitio. WordPress también cambia un poco la calidad de las imágenes redimensionadas, lo que puede hacer que el tamaño del archivo sea un poco más pequeño.

Cambio de la calidad de imagen de las miniaturas JPEG

Encontré este truco increíble de Glyin Mooney en Skidoosh.co.uk para cambiar la calidad JPEG en WordPress …

Básicamente, puede agregar una función simple a su archivo functions.php para establecer la calidad JPEG predeterminada de sus imágenes. Si bien muchas personas pueden usarlo para aumentar la calidad a 100 (como sugiere en el artículo), usted puede usarlo para disminuir la calidad y acelerar su sitio también.

La calidad JPEG actual para miniaturas redimensionadas en WordPress es 90, solo agregue lo siguiente para cambiar el valor (digamos que queremos algunas imágenes realmente geniales al 60% de la calidad original)

add_filter('jpeg_quality', function($arg){return 60;});

Simplemente cambie el “valor de retorno” a la calidad que desea que tengan sus imágenes. Y si obtiene un error “T_FUNCTION inesperado”, pruebe la siguiente función en su lugar:

function jpeg_quality_callback($arg) { return (int)100; } add_filter('jpeg_quality', 'jpeg_quality_callback');

¿Cómo mantiene su WordPress cargando rápido?

¿Tiene otros buenos consejos para optimizar la velocidad de las imágenes utilizadas en su blog? ¿Qué otros pasos está tomando para mantener su sitio web funcionando rápidamente y mantener contentos a Google y a sus usuarios?

Notar: Grandes personas dejan comentarios 🙂

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Ir arriba