Optimizarea Pozei (SEO) Pastrand Calitatea Ei

Optimizarea Pozei (SEO): Cum optimizam o poza pastrand calitatea ei

Cateva din programele ce le folosim, pot modifica (minor) calitatea pozei, chiar daca noi am dori sa ramana lafel.

Cand ne referim la optimizarea unei poze ne referim practic la reducerea marimii(compresam imaginea), astfel incat sa salvam banda si spatiu iar google pagespeed sa nu ne mai dea eroarea urmatoare:

SEO eroare pagespeed
Optimizare Poza: Eroare Pagespeed

Desigur pentru optimizarea corecta a unei poze trebuie sa nu lipseasca descrierea,titlul precum si numele fisierului sa fie bine ales

Sunt 2’ua metode de optimizare a unei poze: Lossy si Lossless .
Lossy reduce mai mult din dimensiunea pozei, dar cu riscul de a strica calitatea
Lossless reduce cat poate din dimensiune(size) fara a strica calitatea.

Incercam cateva servicii free, sa vedem care optimizeaza mai bine imaginea noastra fara sa strice din calitate. Unde se poate alegem metoda lossless, iar lista va fi alcatuita in functie de cat de mult se reduce din marimea pozei.

Aceasta este poza ce trebuie optimizata(158KB)

Optimizarea Pozei, poza in original
Optimizarea Pozei: Originalul ce trebuie optimizat

Optimizarea Pozei cu kraken.io

Rezultatul aici (click stanga, se deschid 2’ua taburi:in cel din stanga se afla poza originala iar in cel din dreapta cea optimizata. ) (pt cei carora nu li se deschid 2’ua taburi: Tab 1 si Tab 2)

Cei de la kraken au reusit sa reduca din dimensiuni cu 15,80%, au salvat 25KB, rezultand o imagine de 133KB. Poza nu a fost modificata, cel putin nu vizibil, iar pagespeed’ul nu da nici o eroare.

Optimizarea Pozei cu optimizilla.com

Rezultatul se afla aici(pt cei carora nu li se deschid 2’ua taburi: Tab 1 si Tab 2)

Cei de la optimizilla.com au reusit optimizarea pozei cu 55%, dar din pacate culorile pozei sunt mult mai aprinse. Au un batch resize, poti introduce pana la 20 de imagini odata, iar google pagespeed nu da erori. Ca si calitate noi am lasat pe default 90%. Nu am avut posibilitatea de a alege intre lossy si lossless.

Optimizarea Pozei cu tinypng.com

Puteti vedea rezultatul aici(pt cei carora nu li se deschid 2’ua taburi: Tab 1 si Tab 2)

S-a reusit o optimizare de 41% dar culorile pozei sunt mai aprinse. Nu am putut alege metoda de optimizare, in schimb au un API. Pagespeed-ul nu da eroare

Optimizarea Pozei cu tools.dynamicdrive.com/imageoptimizer

Putem compara rezultatul aici(pt cei carora nu li se deschid 2’ua taburi: Tab 1 si Tab 2)

Au o limita maxima de 2,86MB/poza, dar iti optimizeaza poza la diferite dimensiuni. Noi am ales-o pe cea de 80% calitate, iar poza rezultata a fost cu 39% mai mica decat originalul. La calitate 90% imaginea rezultata era numai cu 10%. Poza rezultata ca si calitate este lafel cu originalul dar pagespeed-ul da eroare

Optimizarea Pozei cu compressor.io

Am ales metoda lossless, dar poza noastra nu a putut fi optimizata, rezultatul ca si marime este lafel cu originalul. Sigur daca se alege metoda lossy, rezultatul v-a fi diferit.

Optimizare Imagine cu compressor.io rezultate
Rezutlatele optimizarii cu compressor.io

Optimizarea Pozei: Plugin WordPress Smush.it

Putem compara rezultatul aici(pt cei carora nu li se deschid 2’ua taburi: Tab 1 si Tab 2)

WP Smush.it, a reusit sa reduca dimensiuniile cu 31 Kb, adica cu 11,7%, dar din pacate imagina rezultata nu e de aceeasi calitate.Pagespeed-ul nu da eroare.

Optimizarea Pozei: Plugin WordPress shortpixel.com

Rezultatul aici(pt cei carora nu li se deschid 2’ua taburi: Tab 1 si Tab 2)

Desi am reusit sa aducem poza la 91KB, calitatea imaginii a avut de suferit dar pagespeed-ul nu da eroare.

Optimizarea Pozei: Plugin WordPress EWWW Image Optimizer si CW Image Optimizer

Aceste plugin-uri necesita activarea functiei exec a php’ului, lucru pe ca noi nu o sa il facem deocamdata, deoarece consideram ca slabeste securitatea serverului.

Optimizarea Pozei: Programe offline windows: pagespeed_optimize_image

Programul il gasiti aici.

Cu toate ca imaginea a fost redusa de la 158Kb la 136KB, culorile pozei au fost modificate. Puteti compara rezultatul(pt cei carora nu li se deschid 2’ua taburi: Tab 1 si Tab 2). Pagespeed-ul da eroare.

Optimizarea Pozei: Programe offline: jpegoptim

Programul poate fi downloadat de pe github jpegoptim si poate fi folosit si in windows, din command prompt, numai ca trebuie o versiune compilata.

Noi am gasit versiunea 1.4.3(compilata) de nenea asta (merge windows 64bit, si multumiri lui nenea). Are si un direct download aici

Ca sa va jucati cu el din command prompt, dati jpegoptim -h din directorul in care aveti executabilul jpegoptim.exe. De aici aveti mai multe optiuni, dupa teste singurele care nu au modificat culoarea pozei sunt –strip-com –strip-exif –strip-iptc –strip-xmp, imaginea rezultata avand 137KB. Rezultatul(pt cei carora nu li se deschid 2’ua taburi: Tab 1 si Tab 2). Desi imaginea e ok, pagespeed-ul da eroare.

Daca folosim paramentrul –strip all, culorile imaginii sunt mai aprinse, dar pagespeed-ul nu da erori.

Optimizarea Pozei: Programe offline: jpegtran

Programul il gasiti aici, se poate rula tot din command prompt (pt cei cu windows).

Pentru a pastra calitatea pozei trebuie sa folosim -copy all -optimize (toata comanda are forma: jpegtran -copy all -optimzie pozaoriginala.jpg > pozaoptimizata.jpg). Poza rezultata avand 157KB din 158KB. Rezultatul aici(pt cei carora nu li se deschid 2’ua taburi: Tab 1 si Tab 2). Pagespeed-ul da eroare.

Optimizarea Pozei: Programe offline: mozjpeg 3.1

Versiunea compilata pentru windows o gasiti aici. Multumim Thomas Coward.

Aici avem mai multe posibilitati noi am ales:
1. Setari default si rezultatul este asta(pt cei carora nu li se deschid 2’ua taburi: Tab 1 si Tab 2). Imaginea are 64.9KB din 158KB, culorile nu au fost schimbate, dar din pacate pagespeed’ul da eroare.
2. 90% din calitate si rezultatul este acesta(pt cei carora nu li se deschid 2’ua taburi: Tab 1 si Tab 2). Poza are 94.3KB, culorile nu au fost modificate dar pagespeed’ul da eroare.


Concluzie:

In primul rand nu suntem afiliati cu nici unul din serviciile de mai sus, noi decat le-am testat. Toate pot sa optimizeze o poza, noua ne-au fost de folos in acest caz:
1. kraken.io (imagine ok, pagespeed ok)
2. jpegoptim (Imagine ok, pagespeed eroare, se pot pune alte setari astfel incat imaginea sa fie alterata si pagespeed-ul sa nu dea eroare)
3. mozjpeg (imagine ok, pagespeed eroare, poza redusa foarte mult)


Ce folosim noi pentru optimizarea pozei


Pentru cei care nu au timp, am pus si un videoclip:

Voi ce folositi pentru a optimiza pozele?

Ultima Modificare: 4 ianuarie, 2016