- Дагаджаць Google - минифицируем усё і ўся
- Чым аптымізаваць JPG / JPEG?
- Як выкарыстоўваць jpegoptim
- Чым аптымізаваць PNG?
- нататкі
Думаю, няма ні аднаго ўладальніка сайтаў, які не сутыкнуўся з інструментам PageSpeed Insights і яго патрабаваннямі да аптымізацыі малюнкаў. З зноў дадаваліся малюначкамі ўсё больш-менш зразумела і існуе маса модуляў практычна для любых CMS, якія дазваляюць аптымізаваць карцінку ў момант загрузкі. А вось са старымі фотаздымкамі, назапашанымі гадамі, не ўсё так проста і масава аптымізаваць іх з дапамогай модуляў не заўсёды магчыма.
Дагаджаць Google - минифицируем усё і ўся
З-за чаго нашы фатаграфіі і малюнкі не аптымальныя для web і на што глядзіць Google? Не паверыце, але ад якасці :) любая аптымізацыя памяншае якасць малюнка за кошт падмены блізкіх па параметрах кветак да адзінага і згладжванню малюнка (калі выяўляцца зусім груба).
Як гэта ні дзіўна, але памер залежыць не толькі ад самога фота, але і ад яго метададзеных. Калі вы проста загрузілі фота з тэлефона на сайт, разам з фатаграфіяй перадаліся кілабайты дадатковых дадзеных у выглядзе даты здымкі, месцы, ўладальніка і службовых каментароў, змагацца з якімі неабходна ачысткай meta інфармацыі файлаў, але сёння менавіта пра графіку. Пачытаўшы мануалы Гугла [1] мы ўбачым, што гігант рэкамендуе выкарыстоўваць шэраг інструментаў для сціску JPEG і PNG файлаў без ўплыву на якасць карцінкі (візуальна без ўплыву).
Чым аптымізаваць JPG / JPEG?
Для JPG / JPEG рэкамендуюць усталяваць і выкарыстоўваць jpegtran або jpegoptim. Абодва плагіна даюць падобныя вынікі і выбар застаецца за вамі, мы выкарыстоўваем jpegoptim.
Як выкарыстоўваць jpegoptim
Усе працы ў прыкладах мы праводзім на серверы з CentOS
yum install jpegoptim
Для пошуку і масавай аптымізацыі ўсіх файлаў на сваіх сайтах можна выкарыстоўваць каманду
find / home / -name * .jpg -exec jpegoptim --strip-all '{}' \
Пасля выканання дадзенай каманды ўсе выявы дадзенага фармату на сайце будуць аптымізаваныя і перапісаныя новымі
Чым аптымізаваць PNG?
Для PNG рэкамендуюць усталяваць і выкарыстоўваць OptiPNG або PNGOUT
yum install optipng
Для пошуку і масавай аптымізацыі ўсіх PNG файлаў можна выкарыстоўваць каманду
find / home / -name * .png -exec optipng -o4 '{}' \
Усё як і ў выпадку з jpg. У прыкладзе ёсць дадатковы параметр -o4, які з'яўляецца ключом -oX, у якім пра - optimixation, а X - узровень сціску вашых фатаграфій, які можа быць ад 1 да 7. Асабіста я не рэкамендую выстаўляць у ключ значэнне больш за 4.
Пасля таго як абедзве каманды завершаць сваю працу, можна ісці ў PageSpeed [3] і радавацца паляпшэння вынікаў і паскарэнню [2] загрузкі сайта.
нататкі
- рэкамендацыі Google да малюнкаў на сайце.
- прыклад паскарэння карпаратыўнага сайта на Битрикс.
- Праверка сайта ў PageSpeed .
Чым аптымізаваць JPG / JPEG?