Основы Web графики

часть 2

Перейти к "Основы web - графики" часть1

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

Формат JPEG (Joint Photographic Experts Group - Объединенная группа экспертов фотографии) - самый популярный формат для хранения фотореалистичных изображений. JPEG является стандартом в Интернете и предназначен для сохранения растровых изображений со сжатием, уменьшающим размер файла от десятых долей процента до 100 раз за счет удаления избыточной информации, не влияющей на отображение документа. Но практически диапазон сжатия составляет от 5 до 15 раз. Хотя алгоритм сжатия изображения этого формата и ухудшает качество, он может быть легко настроен на минимальные, практически незаметные для человеческого глаза потери. Распаковка JPEG-файла происходит автоматически, во время его открытия. Между качеством изображения и степенью уплотнения существует обратная зависимость: чем более высокую степень сжатия для результирующего изображения вы зададите, тем хуже будет его качество. Рисунки, сохраненные в формате JPEG, иногда имеют мозаичную структуру, т. е. заметное на глаз разбиение изображения на прямоугольные области. Обычно формат JPEG рекомендуют использовать для фотографий, на которых снижение качества, сопутствующее сжатию по этой технологии, наименее заметно.

Формат GIF (Graphics Interchange Format - Формат для обмена графической информацией) был разработан в 1987 году для ускорения пересылки файлов по телефонным линиям. Необходим был формат, который бы содержал достаточно хорошо упакованные данные. Хотя с тех времен пропускная способность модемов значительно увеличилась, требования к компактности файлов, передаваемых по сети, по-прежнему актуальны. Web-страница, которая со всем своим текстом и графикой занимает свыше 40-50 Кбайт, может долго загружаться из Интернета. По этой причине формат GIF, главным достоинством которого является малый размер файлов, до сих пор сохраняет свое место основного графического формата Всемирной паутины. Степень сжатия графической информации в формате GIF сильно зависит от уровня ее повторяемости и предсказуемости. В отличие от иРЕС формат GIF пользуется сжатием без потерь. Правда, формат GIF ограничен лишь 256-цветной палитрой, в то время как JPEG позволяет хранить полноцветные изображения с 16 миллионами цветов. Первую версию формата GIF называют GIF87а.

В 1989 году появилась новая, усовершенствованная версия формата - С1Р89а, в которой используется «постепенный» показ изображения по мере его загрузки из сети. Эта технология заключается в том, что при отображении 01Р-файлов строки изображения выводятся на экран не подряд, а в определенном порядке: сначала каждая 8-я, затем - каждая 4-я и т. д., то есть полностью изображение показывается в четыре прохода. Такая система показа позволяет понять, что отображается на картинке еще до того, как она полностью загрузится, что очень важно на медленных линиях связи. Нечто подобное используется в телевидении для передачи одного полного кадра за два прохода луча - «чересстрочная развертка». Поэтому такие изображения были названы чересстрочными. Приняв из сети очередной проход чересстрочного GIF-файла, браузер не только рисует каждую его строку на своем месте, но и заполняет копиями предыдущей строки все промежутки между строками, иначе после первого прохода изображение было бы почти невидимым. Также в формате GIF89а есть возможность указывать прозрачный цвет, включать строки текста, восстанавливать область экрана, занятого рисунком. Вы можете вставить в GIF-файл комментарии, которые не будут отображаться при выводе изображения.

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

Формат PNG (Portable Network Graphics - Переносимая сетевая графика) пока широкого распространения не получил. Этот формат, основанный на вариации алгоритма сжатия без потерь качества, в отличие от GIF сжимает растровые изображения и по горизонтали, и по вертикали, что обеспечивает более высокую степень сжатия. Преимуществом данного формата является поддержка цветных графических рисунков с глубиной цвета до 48 бит. PNG реализует гораздо более эффективный алгоритм чересстрочности. Каждый пиксель PNG-файла может иметь любую градацию прозрачности: от полной непрозрачности до абсолютной невидимости. Чтобы сгладить различия в яркости дисплеев, существующие между разными типами компьютеров, формат PNG позволяет хранить в файле исходный коэффициент яркости дисплея, на котором изображение было создано. PNG-формат не дает возможности создавать анимационные ролики. Поэтому для хранения анимации можно использовать вариацию PNG - формат MNG (Multiple Network Graphics - Множественная сетевая графика).

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

Чтобы изображение можно было использовать на web-странице, его необходимо предварительно оптимизировать, уменьшив до минимума размер файла, а значит, и его время загрузки из Интернета. При этом качество рисунка не должно заметно ухудшиться. Оптимизация обеспечивает компромисс между размером файла и качеством изображения.

 
   return_links(1); ?>
   return_links(1); ?>
   return_links(); ?>

По материалам: "Создаем, программируем, шлифуем и раскручиваем WEB-сайт" Ю.Ю.Замятин, М.А.Горин, В.А.Ищенко. -М: Лучшие книги, 2009г.

Перейти на главную страницу

Главная страница

Зарабатываем деньги:

Где заработать??? обзор рыбных мест.

 

Разное

Наш сайт в каталогах

 

 

   

Написать письмо вебмастеру folvarok@mail.ru

Использование материалов данного сайта разрешено при условии обязательной гиперссылки на данный ресурс. Авторские права на данный ресурс принадлежат Кузьминичу Евгению.

февраль 2010г.