Не сакрэт, што аптымізацыя графікі сайта можа істотна паскорыць загрузку і адлюстраванне вэб-старонкі, павысіць сумяшчальнасць з іншымі прыладамі і зрабіць сайт больш прывабным для пошукавых сістэм. У асноўным, сайты ўтрымліваюць мноства абразкоў, графікі ў png фармаце. Па-змаўчанні, у стандартных тэмах CMS графіка ўжо аптымізавана, але калі ўзнікае жаданне нешта палепшыць, - напрыклад, абнавіць абразкі, - узнікаюць і праблемы.
На папулярных сайтах, такіх як www.iconsearch.ru , www.iconfinder.com і іншых, абразкі ўтрымліваюцца ў фармаце PNG-24 з альфа каналам, якія забяспечваюць празрыстасць фону. Гэта значыць такі малюнак можна змясціць абсалютна на любой фон, аднак яго памер велізарны - прыблізна ў 5 разоў вышэй, чым у аптымізаванага малюнка.
Такім чынам, артыкул аб тым, як выканаць пакетную аптымізацыю графікі сайта ў фармаце PNG і максімальна без страт якасці паменшыць памер выходных малюнкаў. Перш за ўсё, варта вызначыцца з тым, ці патрэбен Вам альфа-канал, то ёсць празрыстасць абразкі. Справа ў тым, што менавіта празрыстасць дадае малюнку лішнія кілабайты. У разгляданым намі прыкладзе мы будзем меркаваць, што фон асноўнай вобласці сайта, якія змяшчаюць абразкі, - белага колеру.
Вось тэчкі, у якіх знаходзяцца выявы для аптымізацыі.
Зыходныя папкі з абразкамі
Адкрываем праграму пад назвай Photoshop. Ціснем Alt + F9 - адкрыецца акно «Аперацыі». Ствараем новую аперацыю пад назвай «Абразкі».
Ствараем новую аперацыю ў Photoshop
Пасля гэтага пачнецца запіс аперацыі, якую мы будзем выкарыстоўваць для пакетнай апрацоўкі. Адкрываем якое-небудзь тэставае выява, якое можна «пакалечыць». Далей пераходзім у меню Выява -> Памер малюнка. Змяняны памер, паказваючы канчатковы памер у пікселях. Калі гэтая аперацыя не патрабуецца, - прапусціце гэты крок.
Далей мы выбіраем асноўны колер, які будзе фонам нашай абразкі (у самым нізе панэлі інструментаў злева). У нашым выпадку - гэта белы. Пасля гэтага пераходзім у меню Выява -> Рэжым -> індэксавацца колеру. У якое адкрылася акне паказваем такія параметры:
Палітра - Лакальная (селектыўнасці),
Колеру - тут паказваем лік да 256-ці. Гэта колькасць кветак, якія выкарыстоўваюцца ў малюнку і ад гэтага параметру залежыць наколькі будзе зменшана малюнак. Рэкамендую паставіць значэнне 128. Калі абразок не ўтрымлівае шмат кветак, то можна паставіць менш;
Прымусовыя - не паказваць;
Празрыстасць - здымаем галачку;
Падкладка - Асноўны колер (гэта будзе фон абразкі);
Дизеринг - Выпадковы, 75%.
Photoshop. Індэксаваная колеру.
Націскаем ОК, захоўваем файл і потым - спыняем запіс аперацыі ў акне «Аперацыі». Далей пераходзім у меню Файл -> Аўтаматызацыя -> Пакетная апрацоўка. Выбіраем створаную намі аперацыю, а таксама паказваем шлях да тэчцы з нашымі абразкамі. Галачкі выстаўляем падобныя на малюнак унізе:
Photoshop. Пакетная апрацоўка.
Калі аперацыя будзе скончаная памер абразкоў не зменіцца - не палохайцеся! Выявы ўжо аптымізаваныя: мы «адсеклі» непатрэбныя колеру, прыбралі альфа-канал, аднак выявы ўсё яшчэ ўтрымліваюць шмат пустых байтаў, якія не нясуць карыснай інфармацыі. Мы іх павінны прыбраць. Для гэтага ёсць вельмі добрая праграма, якую я ледзь-ледзь знайшоў. Гэта адзінае працаздольнае і найпростае ў выкарыстанні дадатак, якое можа ачысціць PNG малюнак ад «смецця», пакінуўшы толькі тыя байты, якія ўтрымліваюць інфармацыю. Такім чынам яна не шкодзіць якасці малюнка - яго мы ўжо зафіксавалі і абмежавалі ў Photoshop.
Называецца праграма PngOptimizer. Пераходзім на сайт http://psydk.org/PngOptimizer.php і спампоўваем ZIP архіў з праграмай (яна бясплатная). З яго нам спатрэбіцца толькі невялікі файлік пад назвай PngOptimizer.exe. Кладзём у зручны для нас месца, запускаем праграму і проста перацягваюць туды ўсе тэчкі з абразкамі. Праграма пересохранит ўсе файлы, пакінуўшы іх у тых жа лакацыях, дзе яны і ляжаць:
Аптымізацыя PNG з дапамогай праграмы PngOptimizer
Працэс зойме зусім няшмат часу і Вы будзеце задаволены вынікам. Цяпер нам трэба выдаліць усе бэкапы (рэзервовыя копіі), пакінутыя праграмай. Яны пачынаюцца з знака ніжняе падкрэсліванне. Пераходзім у тэчку, дзе ўтрымліваюцца тэчкі з абразкамі і ўбіваем ў пошук «_ *. Png«. Правадыр знойдзе ўсе файлы з пашырэннем PNG, якія пачынаюцца з ніжняга падкрэслення. Вылучаем іх усё і выдаляем.
Ўсё. Цяпер абразкі гатовыя да загрузцы на сервер!
