Обзор графических статических и динамических форматов, условия их использования в среде internet

Обзор графических
статических и
динамических форматов,
условия их использования
в среде internet:
Оптимизация
•
•
•
•
•
Оптимизация изображений для веб-страниц — это процесс сжатия изображения и
настройки параметров его отображения для оптимального использования в среде
Интернет.
При размещении файла в Интернете важное значение имеет размер файла:
размер файла следует задать так, чтобы время на его загрузку было
минимальным, а качество изображения — максимальным. Для размещения
изображений в Интернете используются три основных формата: GIF, JPEG и PNG.
Оптимизированные изображения в этих форматах можно создать следующими
способами:
Чтобы достичь точной оптимизации изображения для применения в
приложениях веб-разработки (например, Adobe® Dreamweaver®), можно выбрать
команду «Сохранить для Web». Диалоговое окно «Сохранить для Web» позволяет
осуществлять предварительный просмотр изображения в различных форматах и с
разными настройками оптимизации. В нем можно также задать параметры
прозрачности и анимации.
Чтобы получить оптимизированные изображения в основных форматах можно
воспользоваться командой «Сохранить как». В зависимости от формата файла
можно указать качество изображения, прозрачность фона.
Свойства графических файлов:
Прозрачность – это свойство позволяет изображению быть в разной
степени прозрачности от твердого состояния до полностью прозрачного.
Сжатие – это свойство позволяет изображению сохраняться в гораздо
меньшем файле, с помощью математических алгоритмов для обработки
группы пикселей как единого элемента.
Переплетение – позволяет изображению быть загруженным сначала по
нечетным строкам, а затем четным. Это позволяет посетителю скорее
увидеть изображение.
Анимация – создает видимость движения с помощью серии
последовательных снимков. Для анимированного GIF не требуется
плагин в браузере и он может работать практически на всех
устройствах.
Прогрессивная загрузка – похожа на переплетение тем, что она
загружает только часть изображения изначально, но не на основе
чередующихся строк.
Формат JPG
JPEG - это масштабируемый упакованный формат, обеспечивающий
высокую степень сжатия с очень небольшим снижением качества
изображения. Формат JPEG может быть наилучшим вариантом для точной
передачи изображений с плавным переходом цветов, то есть для
изображений фотографического типа.
Степень сжатия и, соответственно, размер файла в этом формате определяются параметром Quality
(уровень качества).
JPG сжимает картинку с потерей качества.
для фотографий особенно часто используется формат JPG: удается достичь большого сжатия (малого
размера JPG-картинки) без существенного ухудшения качества изображения.
Резкие цветовые переходы, свойственные рисованной графике, наоборот, не позволяют сделать значение
Quality малым — для таких файлов лучше использовать GIF.
Обычно JPG используется для фотографий и очень сложных по цветовой гамме рисунков с плавными
цветовыми переходами. GIF используется для логотипов, надписей, заголовков, рисунков, имеющих
четкие цветовые границы.
Фото с разным качеством
Формат GIF
•
Формат GIF— это формат для изображений, содержащих 256 или менее
цветов. Формат популярен в Сети и обычно используется для
изображений, содержащих в основном ровные цвета, например, таких, как
иллюстрации. GIF также поддерживает прозрачность и чересстрочное
отображение
•
Если используются 256 цветов (28), то на каждый пиксель требуется 8 бит
(один байт).
Если используются 128 цветов (27), то на каждый пиксель требуется 7 бит.
64 цвета требуют 6 бит на пиксель,
32 цвета требуют 5 бит на пиксель,
16 цветов требуют 4 бита на пиксель,
8 цветов требуют 3 бита на пиксель,
4 цвета требуют 2 бита на пиксель,
2 цвета требуют 1 бит на пиксель.
•
•
•
•
•
•
•
Изображение в формате GIF, сохраненное с 256
цветами (слева) и с 8 цветами (справа)
Формат PNG
•
•
•
•
Невозможность создания полно цветных изображений с прозрачными
участками в рамках форматов GIF и JPEG привела к появлению формата PNG.
Этот формат сохраняет всю цветовую информацию и один альфа-канал
изображения.
Этот формат более эффективно, чем GIF (на 10—30%) реализует сжатие без
потерь, но при этом может хранить не только графику с фиксированной
палитрой, но и очень качественные изображения с 32 битами на пиксель.
Четвертые версии основных браузеров без специальных подключаемых
модулей с форматом PNG не работают. Это означает, что о массовом переходе
на этот графический формат говорить пока еще рано.
Выбор формата картинки
Когда выбор формата для сохранения изображения неочевиден:
1. Начните с JPG.
2. Уменьшайте значение Quality, пока изображение остается приемлемым.
Запомните размер полученного графического файла.
3. Запишите исходную картинку в GIF-формате.
4. Сравните размеры файлов, записанных в форматах GIF и JPG. Остановите
свой выбор на том формате, который дает меньший размер файла при одном
и том же качестве изображения (это качество вам придется оценить “на
глаз”, впрочем, ведь и посетитель вашего сайта будет руководствоваться тем
же критерием).
Замечание. Для маленьких картинок используйте формат GIF, даже если
картинка — фотография. Формат JPG не приспособлен для маленьких
изображений.
Это хорошо видно на примере самой маленькой на свете картинки. Webдизайнеры часто используют для выравнивания информационных элементов
невидимую картинку-распорку. Обычно это прозрачный GIF размером 1 Ч 1,
его “вес” — 43 байта. Один пиксель в формате JPG занимает больше
полутора килобайтов.
Задание
Найдите и законспектируйте информацию о следующих
форматах: BMP, SWF, AVI, MOV.