0

Optimiza las imágenes de tu blog y gana velocidad

1 Estrella2 Estrellas3 Estrellas4 Estrellas5 Estrellas (Sé el primero en calificar)
Loading ... Loading ...

Sabemos que el tiempo de carga de nuestro sitio es clave para un buen posicionamiento y desde luego nuestros visitantes lo apreciarán.. Numerosos blogs usan imágenes para complementar los artículos escritos (este blog sería un ejemplo), y muchas veces algo que no tenemos en cuenta es: el peso de esas imágenes y la cantidad de ellas..

El peso de las imágenes =>

Afecta notablemente el tiempo de carga de nuestro sitio, si tenemos 8 imágenes en nuestro home y cada una pesa alrededor de 500kb, podemos decir que las 8 imágenes generan casi 4mb de peso adicionales sin mencionar: .css .js .ttf Una forma de mejorar fuertemente la velocidad de nuestro sitio es reduciendo el peso de dichas imágenes.

La cantidad de imágenes =>

La cantidad de imágenes es clave, cada imagen es un petición que hacemos al servidor.. Y esto juega un papel muy importante a la hora de optimizar el tiempo de carga de nuestro blog. No solo nos favorecemos en velocidad sino también en datos recibidos y enviados que a veces tenemos limitado en nuestro plan contratado

Para beneficiarnos de una reducción de peticiones podemos usar Sprites que sería agrupar todas esas imágenes (pequeñas) en una sola, de este modo la petición al servidor sería una, pero en realidad dentro de ese archivo hay varias imágenes agrupadas.Pero este artículo no va de como usar Sprites (Eso mas adelante).

Cómo reducir el tamaño de las imágenes? =>

En este artículo explicaremos como reducir notablemente el peso de esas imágenes que subimos a nuestros artículos, en la mayoría de los casos puede reducirse a la mitad. Veamos un ejemplo;

eduardo-martinez-blog

Para este ejemplo, hemos tomado el Blog de Eduardo Martinez. Haciendo un breve análisis (test de velocidad), podemos apreciar que su peso completo es de 4.6MB , pero por de donde sale ese peso? que es lo que lo hace “pesado”? vamos a mirar los detalles:

eduardo-martinez-blog2

A simple vista, vemos algunas imágenes (png) con un peso no muy reducido. Vemos que solo 4 imágenes pueden llegar a pesar 1.5MB. (las seleccionadas en rojo).. Ahora bien, que podemos hacer?Muchas veces el “optimizar” imágenes está relacionado con “perder calidad”.. Pero esto no es así!!
Muchos dirán, es que si las “optimizo” perderán muchísima calidad, casi prefiero que mi blog pese 5GB antes de perder un solo pixel en la calidad de mis imágenes.
Pues bien, te mostraré un programa que no afecta en lo absoluto el rendimiento de la imagen (el pixelado) y puedes aplicarlo en todas tus imágenes “pesadas” ganando así hasta un 500% de su peso.

Cómo comprimir imágenes? =>

El programa que te quiero presentar es: RIOT (Radical Image Otimization Tool).  Un programa gratuito que puedes descargar desde softonic por ejemplo.

Pero cuanta velocidad podemos ganar con él? Veamoslo con un ejemplo, usaremos una imagen del blog de Eduardo Martínez, aquella que pesaba 567kb por ejemplo.

imagendeejemplo1

Sorprendido? hemos reducido casi casi 500kb, la imagen ha pasado de pesar 566,7KB a pesar 78,83KB. Luego solo es cuestión de dar “guardar” y ya tienes la imagen optimizada y lista para subir a tu blog :)

La herramienta tiene varias opciones para la optimización, yo te recomiendo que te familiarices pero tampoco hace falta hacerlo.. El programa carga y ajusta la imagen lo justo y necesario para no perder calidad, si le quitas mas calidad probablemente se verá de pena y tampoco ahorrarás mas de 5KB, por lo que el programa está para:  Abrir » cargar imagen » guardar nueva imagen. Sin mas.

PERO, no pierde NADA NADA de calidad?.. Veamos un zoon de ambas versiones y veamos si estamos satisfechos:

imagendeejemplo2Te parece bien? Desde luego, al hacer zoon, se pixela un poco como CUALQUIER imagen.. Lo importante aquí es comparar ambas versiones y ver si se “diferencian” mucho en cuanto a calidad de una con la otra..

Si aplicamos esto mismo con todas las imágenes desde luego reduciremos notablemente su peso ergo la velocidad de carga de nuestro sitio.. A esta imagen la hemos reducido un 500%, por regla de 3, podemos decir que optimizaremos nuestro sitio (en cuanto a imágenes) en un 500%.

Sin duda una herramienta para tener en nuestro escritorio siempre a mano.

Nota: Usarlo preferiblemente con imágenes con un peso superior a 150 o 200KB. Menos de eso no vale la pena.

Te ha gustado? quieres reducir el peso de tu sitio? Corre a tu blog y optimiza todas tus imágenes :D Pero antes, ya sabes: #COMPARTIR.. Si quieres recibir mas artículos y estar al día con el blog #Suscríbete y si tienes alguna duda, sugerencia o insulto (nah insulto noo jaja).. #Comenta.

Comparte!

LuisLY

Soy Luis LY, la mayor parte de mi tiempo lo invierto aprendiendo y compartiendo sobre Diseño Web, Marketing y SEO.

Deja un comentario