Читать «Разгони свой сайт» онлайн - страница 28

Группа разработчиков Mozilla расширила текущий (для одного изображения) PNG-формат в браузере Firefox 3, добавив несколько дополнительных кадров для анимации. Существует также встречное предложение со стороны членов группы PNG, подразумевающее создание чего-то подобного; однако, не противоречащего спецификации PNG. Оба этих направления значительно проще, чем MNG, и оба открыты для голосования в группе PNG.

Сейчас же для анимации изображений лучше всего применять GIF89a или Flash. Однако последние достижения в векторной графике, SVG и развитие анимационных JavaScript-библиотек составляют реальную конкуренцию указанным форматам. Вполне возможно, что через несколько лет вся несложная анимация в браузерах будет осуществляться при использовании именно такого подхода.

Двигаемся к маленьким PNG

PNG работает лучше с большими однотонными областями. Чтобы увеличить степень сжатия, стоит уменьшить количество «шума» в ваших картинках для увеличения размеров однотонных областей. Уменьшайте области размывания, хотя для изображений с градиентами размывание позволяет использовать меньшую глубину цвета. Избегайте сглаживания текста для уменьшения числа цветов, которые для него необходимы, в финальном изображении.

По возможности уменьшайте число цветов в вашем исходном изображении, если в процессе разработки этот фактор можно контролировать. Стоит также избегать использования многослойных PNG-изображений для уменьшения размера файла, так как семипроходная многослойная схема может добавить от 20% до 35% к размеру PNG-файла. Наконец, можно применять специальное программное обеспечение для оптимизации PNG-изображений, которое специально разрабатывается с этой целью, например pngout или pngcrush.

Полезные советы

Ниже приведено несколько простых советов, как текущие изображения можно дополнительно уменьшить в размере. Можно написать простой скрипт, который перебирает директории с изображениями перед публикацией сайта и делает следующие действия (далее приведены примеры запуска утилит из командной строки для ОС Linux):

Преобразовывает GIF в PNG (и проверяет, есть ли при этом выигрыш):

convert image.gif image.png

или так

gif2png -nstO image.gif image.png

Уменьшает PNG-файлы в размере:

pngcrush –qz3 –brute image.png result.png

если при этом нужно удалить и gAMA-чанк, то:

pngcrush –qz3 –rem gAMA –brute image.png result.png

если при этом хотим удалить другие чанки, отвечающие за цветовую коррекцию, то:

pngcrush –qz3 –rem gAMA -rem cHRM -rem iCCP -rem sRGB \

–brute image.png result.png

Уменьшает JPEG-файлы в размере (без потери качества):

jpegtran -copy none -optimize -perfect image.jpg > result.jpg

Под Windows для уменьшения PNG-изображений можно использовать TweakPNG ( http://entropymine.com/jason/tweakpng/ ). Аналогом jpegtran является набор портированных утилит jpeg, которые можно загрузить по адресу: http://sourceforge.net/projects/gnuwin32/ .

Для отдельно взятой страницы общий размер изображений может быть уменьшен на 20–30% только благодаря следованию этим простым советам.