15. Растровые форматы вэб-графики jpeg, gif, png

Формат JPEG – 24-я битовой глубина цвета (порядка 64 млн. цветов), подходит для передачи фотоизображений. Его поддерживают все современные браузеры. Допускает сжатие в убыток качеству. Чем ниже процент качества, тем меньше вес файла изображения и тем хуже оно выглядит.

На веб-страницах используют формат JPEG с прогрессивной развёрткой. Такие изображения отображаются в браузере поэтапно, по мере обработки: сначала пользователь видит часть картинки, потом ещё часть, и наконец – весь оригинал полностью. Если же не применять прогрессивную развёртку, то изображение отобразится в браузере только после полной загрузки. Прозрачность форматом JPEG не поддерживается.

Формат GIF расшифровывается как формат обмена графикой. Подойдёт для изображений, в которых значительные области закрашены одним цветом, без плавных переходов (логотипы, диаграммы, различные чертежи, графики и т.д.)

Основной параметр, влияющий на объем графического файла, – индекс цвета. В формате GIF может быть использовано от 2 до 256 цветов. Для изображений с небольшой палитрой применяется меньший индекс цвета, что уменьшает размер файла.

В формате GIF можно сохранить любое изображение, при этом, если в нем используется больше 256 цветов, часть информации о цвете будет утрачена: похожие оттенки будут отображаться одинаково. Формат GIF поддерживает однобитовую прозрачность – т.е. области изображения (пиксели, из которых они состоят) могут быть либо прозрачными, либо непрозрачными: среднего не дано. При отображении в браузере графических элементов эта особенность проявляется очень заметно.

Неоспоримым плюсом формата GIF является поддержка простой анимации. В одном файле можно сохранить несколько изображений, которые через заданное время будут сменять друг друга. Файлы GIF можно сохранять в чересстрочном режиме. В этом случае они ведут себя как прогрессивные JPEG-файлы: изображение прорисовывается в браузере по мере загрузки.

Формат PNG был создан в качестве альтернативы GIF.

Формат PNG по сравнению с предыдущими обладает некоторыми преимуществами.

1.  обширный, по сравнению с GIF, выбор цветовых форматов (24-битовый RGB, шкала оттенков серого цвета и 8-битовая GIF-подобная палитра) 2.  вариативная прозрачность. Каждый пиксель характеризуется не только цветом, но и уровнем прозрачности – от 0 (полностью непрозрачный) до 255 (полностью прозрачный) Наиболее значимый недостаток PNG – это значительный объем файлов. Когда изображение не содержит полупрозрачных областей, рекомендуется использовать форматы GIF и JPEG.

Браузеры хорошо приспособлены к работе с растровыми изображениями форматов GIF, JPEG и PNG. Каждому присущи свои достоинства и недостатки, поэтому для работы требуется знание их технических особенностей.

Оптимизация позволит уменьшить вес его страниц без потери качества для чего нам и требуется знание особенностей форматов GIF, JPEG и PNG. Задача по оптимизации сайта сводится к поиску наиболее выгодного соотношения между количеством графических элементов (т.е. весом страницы) и удобством посетителя (т.е. временем ее загрузки).