Графические изображения

Анимированные изображения

Несколько одиночных изображений можно упаковать вместе для создания анимированных изображений GIF. Они являются файлами изображений, содержащими два и более изображений, которые открываются по очереди в определенном порядке.

Рис. 5.4. Анимированное изображение GIF

Следующий экран Adobe ImageReady показывает создание нескольких из 60 изображений, которые используются для создания показанных выше часов, секундная стрелка которых последовательно показывает все 60 секунд. Каждое положение стрелки создается в отдельном слое изображения. Программа преобразует слои в анимационные кадры, или ячейки, которые выводятся в определенной последовательности, когда сохраняются как файл GIF.

Рис. 5.5. Экран Adobe ImageReady, который показывает анимационные ячейки, созданные из отдельных слоев изображения часов

Немного отличающаяся техника анимации используется в других программах анимации. Некоторые программы для анимации GIF требуют создания отдельных сохраненных изображений GIF. Каждое изображение представляет собой отдельный кадр анимации. Эти отдельные файлы GIF импортируются в программу и преобразуются в последовательность ячеек анимации.

Файл анимированного GIF извлекается браузером, так же, как и любой другой файл GIF. При выводе в браузере файл создает анимацию. Конечно, если у вас нет опыта работы с графикой или не хватает терпения создавать последовательность изображений для анимации, то необходимые анимированные изображения GIF вполне можно найти в Web.

Формат изображений PNG

Более новым форматом с увеличивающейся популярностью является формат PNG (Portable Network Graphic - переносимая сетевая графика, произносится "пинг"). Этот формат используется для тех же целей, что и GIF; однако, он создает файлы меньшего размера и без потери качества разрешения. Он может выводить многослойные изображения и делает это быстрее, чем формат GIF.

Наиболее заметное различие между форматами PNG и GIF находится в области прозрачных изображений. Формат PNG допускает до 254 уровней прозрачности, позволяя изображениям лучше смешиваться с цветом фона или узором страницы. Рисунок 5.6 показывает различия при смешивании между изображениями PNG и GIF.

Рис. 5.6. Сравнение форматов PNG и GIF на фоне страницы

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

Формат изображений JPEG

Формат JPEG (Joint Photographic Experts Group) был создан для хранения с различной степенью сжатия фотографических изображений с миллионами цветов. Во время сжатия графические программы используют специальные алгоритмы для выделения и вывода цветов, близких к цветам исходного изображения, но не сохраняют при этом всю информацию о цвете, чтобы минимизировать размер файла.

Обычно при сохранении изображений в формате JPEG имеется возможность задания степени сжатия. Меньшие размеры файлов обычно означают большую потерю деталей изображения. Тем не менее, при умеренном сжатии можно вывести на экране изображение, которое выглядит очень похоже по качеству на исходное изображение. Четыре изображения ниже показывают исходное изображение и три сжатых вместе с размерами файлов. Можно заметить потерю четкости изображений с более высокой степенью сжатия и меньшим размером файла.

Рис. 5.7. Изображения JPEG с различной степенью сжатия

Для изображений Web, которые выводятся обычно с разрешением 72 пикселя на дюйм, степень сжатия, уменьшающая размер файла от 1/8 до 1/4 исходного размера файла, сохраняет удовлетворительную визуальную точность.

Изображения JPEG сохраняются как файлы с расширением .jpg. Формат JPEG не поддерживает многослойность или прозрачность; он также плохо подходит для текста или штриховых изображений, так как точность, которая требуется для создания прямых линий или четких ребер, будет недостаточна при сжатии.