ESTÁS LEYENDO...

Optimizar imágenes para tu web

Optimizar imágenes para tu web

¿Cómo optimizar imágenes para tu blog y tu web?

La carga de un buen diseño web en parte se la llevan las imágenes que usamos para construir nuestras páginas o para ilustrar las noticias del blog. Por eso, optimizar imágenes debe ser siempre el paso previo antes de subirlas a la web.

Una vez tengamos elegida la imagen que vamos a subir, aplicaremos unas pautas para que cumplan los requisitos de resolución y tamaño adecuados. No es lo mismo subir una imagen para la cabecera de la home que para un post, por eso debemos tener claro que tamaño van a tener nuestras imágenes. Las pautas que os recomendamos son las siguientes:

· 700×490 píxeles (imágenes para blog/noticias)
· Resolución de 72 píxeles/pulgada
· Colores RGB
· Usar extensiones jpg o jpeg (intentar evitar los png)

¿Esto quiere decir que no se pueden usar imágenes de tamaños superiores? Sí, si se pueden ¿pero lo necesitas? Ten en cuenta que la media de tamaño de un monitor de ordenador es de 1080×720 px… ¿quieres que tu imagen ocupe toda la pantalla? A medida que vayamos aumentando el tamaño de la imagen, irá aumentando su peso y aumentando el tiempo de carga de nuestra web. Podemos usar imágenes de 1000 px por ejemplo, para encabezar páginas, pero no abusar de su uso para no sobrecargar la web.

2 plugin para optimizar tus imágenes

Todo esto que hemos dicho es el trabajo previo a subir una imagen a la web, ahora viene la ayuda que nos aportan algunos plugin de WordPress para optimizar nuestras imágenes. (otros plugin que seguro te interesan)

WP Smush

EL plugin por excelencia para la optimización de imágenes con más de 700.000 descargas. Analizará cada imagen que subamos a la web y la redimensiona/comprime para optimizar su tamaño. Tiene una versión gratuita y otra de pago donde ampliaremos utilidades y potencia además de hacer una copia de todas las imágenes que nos comprime.

Ver WP Smush

Lazy load

La carga diferida es una maravilla… Este plugin hace que nuestra web vaya como un tiro mostrando solo las imágenes a las que el usuario ha llegado cuando hace scroll. No modifica nuestras imágenes como el anterior, sino que optimiza el tiempo de carga no mostrando las imágenes que el usuario no tiene a la vista.

Ver Lazy load

 





¿TE HA GUSTADO ESTE ARTÍCULO?

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

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.