Форматы графических файлов

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

Существует два основных типа графических файлов: растровые и векторные.

Растровая графика строится по принципу мозаики: она состоит из отдельных "квадратиков", называемых пикселами (иногда ее так и называют – пиксельная графика). Каждый пиксел в точности похож на все остальные и по форме, и по размеру, но отличается цветом, и, естественно, каждый из них стоит на определенном месте. Если размер пикселов достаточно мал, то мы не различаем их по отдельности, а видим изображение в целом.

Форматы растровой графики: GIF, JPEG, JPEG 2000, PNG, BMP, TIFF, ECW, ICO, ILBM, MrSID, PSD, TGA, HD Photo, WebP.

Векторная графика от начала до конца "компьютерное" изобретение. В ней используются математические формулы для описания форм, из которых состоит изображение. Рисунок составлен из сотен отдельных объектов, из которых образуется конечное изображение, которое мы с вами видим.

Форматы векторной графики: Scalable Vector Graphics (SVG и SVGZ), Метафайлы Windows: WMF, EMF, Файлы CorelDraw: CDR, CMX, XAR.

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

У векторной графики есть другой недостаток, не менее значительный, заключающийся в том, что создать векторный рисунок можно только в компьютере. Мы не можем взять фотографию или рисунок, положить на сканер и получить векторное изображение. Растровая же графика без проблем может быть получена через сканер, цифровой фотоаппарат, видеокамеру или веб-камеру. Оговорка. На самом деле получить векторный рисунок из растровой графики возможно – этот процесс называется трассировкой . Однако по ряду причин результат будет только приближенным, точное преобразование математически невозможно.

Существуют также комплексные форматы, которые могут хранить как векторную, так и растровую информацию. Это форматы DjVu, CGM, AI (формат программы Adobe Illustrator), EPS (Encapsulated PostScript – профессиональный универсальный векторно-растровый формат, используемый всеми профессиональными графическими программами) и PDF (Portable Document Format – формат программы Adobe Acrobat, который может содержать растровую и векторную графику, а также текстовую информацию).

Форматы графических файлов для Web

При создании сайтов используются в основном три формата графических файлов: GIF (расширение .gif), JPEG (расширение .jpg) и PNG (расширение .png). Их свойства, преимущества и недостатки надо обсудить подробнее.

Самым распространенным форматом графических файлов для HTML-документов является GIF - Graphic Interchange Format. Для кодирования цвета в нем используется 8 бит, то есть допускается только 256 различных цветов или столько же градаций серого. Наборы цветов (палитры) могут быть различными. Один GIF-файл может содержать несколько изображений, позволяющих создавать движущиеся или изменяющиеся образы. В этом случае требуется согласование палитр различных изображений, составляющих один файл. Похожая проблема возникает, если монитор работает в режиме 256 цветов, а на экране одновременно воспроизводятся несколько изображений с разными палитрами. Очевидно, что для части картинок качество цветопередачи будет ухудшено.

Само по себе 8-битовое кодирование цвета предполагает, что размер графического файла будет относительно небольшим. Но, кроме того, для уменьшения размера файла используется еще и сжатие изображения. Существует две разновидности GIF-файлов: сжатые и обычные, в которых сжатие отсутствует. Компактность файла и дополнительные преимущества стали причиной того, что данный формат прочно утвердился в качестве стандарта де-факто для Интернета.

Дополнительное преимущество этого формата заключаются в том, что хранение информации в файле может быть организовано таким образом, чтобы при выводе рисунка происходило чередование строк (интерлейсинг). То есть вначале будут выводиться строки с номерами 1, 5, 9 и т. д., затем с номерами 2, 6, 10 и т. д., и так до тех пор, пока весь рисунок не будет отображен. Для наблюдателя такой рисунок вначале кажется нечетким, а затем четкость изображения увеличивается. При передаче данных по сети это особенно выгодно, так как еще до окончания передачи файла пользователь имеет возможность увидеть изображение, хотя и в несколько размытом виде.

Еще одно преимущество GIF — возможность сделать часть изображения прозрачной. Прозрачным может стать только один цвет. Так, создание прозрачного фона позволяет более естественно вписать рисунок в документ и избежать появления прямоугольника, обозначающего границы изображения.

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

Формат JPEG – основной формат для размещения фотографий на сайтах. У него практически нет ограничений по количеству отображаемых цветов. Плюс этого формата в том, что используется алгоритм сжатия, благодаря которому объем файла во много раз меньше, чем для того же изображения в таких форматах, как TIFF и BMP. В сжатии заключен и минус этого формата. Изображения, созданные в графических редакторах, таких как Adobe Photoshop, с использованием контрастных линий, не всеми браузерами отображаются качественно.

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

В качестве альтернативы формату JPEG был внедрен формат PNG. Этот формат является основным форматом графического редактора Macromedia (Adobe) Fireworks, поддерживает слои, объекты, надписи, вставляется в Интернет-страницы без конвертации. В дальнейшем могут свободно редактироваться отдельные слои и объекты графического файла. Этот формат характеризуется наилучшим качеством изображения, однако, во-первых, старые браузеры его не поддерживают и, во-вторых, не все браузеры поддерживают прозрачность фона, реализованную в формате. Одним из существенных недостатков является то, что изображение в формате PNG имеет существенно больший объем, чем такое же изображение в формате JPEG.

Полезные ресурсы

Загляните на досуге

Счетчики

Рейтинг@Mail.ru

LiveInternet

Rambler's Top100