Форматы рисунков, используемых на веб-страницах

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

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

• Прежде чем добавлять рисунки на веб-страницу, необходимо определить используемый формат.

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

Точечные и векторные рисунки

Точечные рисунки (часто называемые растровыми)

Образуются набором точек, наподобие того, как закрашенные квадратики образуют рисунок на листе миллиметровки.

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

• Точечные рисунки часто сохраняются с расширением BMP, PNG, JPG или GIF.

 

Векторные рисунки

Создаются из линий, кривых, прямоугольников и других объектов.

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

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

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

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

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

• В Microsoft Windows метафайлы сохраняются с расширением WMF.

В основном на веб-страницах используются рисунки в форматах GIF и JPEG (стандартные форматы файлов для веб-страниц), и, с недавних пор, PNG. Существует много факторов, определяющих использование того или иного формата для каждого рисунка. Выбор зависит от используемого типа рисунка, от размера файла, от размера файла рисунка и от способа загрузки изображения.

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

   • Одно из преимуществ формата сжатия GIF — возможность чередования строк рисунка для улучшения его загрузки в обозревателе.

   • Рисунок в формате GIF с чередованием сначала загружается с низким разрешением, а затем, по мере появления целого рисунка, его качество постепенно улучшается. Таким образом, пользователь сможет увидеть суть изображения перед тем, как изображение появится целиком.

   • Другая полезная сторона использования рисунков в формате GIF - фон рисунка (один из цветов) может быть сделан прозрачным, чтобы видеть цвет фона текущего окна обозревателя.

2. JPEG (Joint Photography Experts Group) - Объединенная группа экспертов по машинной обработке фотоизображений. Был зарегистрирован в 1990г.

   • Формат JPEG обычно используется для рисунков высокого качества, содержащих тысячи и миллионы цветов (до 16,7 миллионов оттенков).

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

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

   Кроме того, допускается добавление рисунков в следующих форматах (3-8).

3. BMP (для Windows и OS/2). Простой растровый формат для среды Microsoft Windows. Такие рисунки состоят из наборов точек и поддерживают до 24 разрядов. BMP формат - третий по популярности после форматов GIF и JPEG.

4. TIFF (Tagged Image File Format). Формат файлов с высоким расширением на основе тегов. Используется в качестве универсального формата для обмена цифровыми изображениями.

5. TGA (Truevision Targa Graphics Adaptor). Этот формат поддерживает от 1 до 32 разрядов и такие профессиональные средства, как альфа-канал, настройки цветовой гаммы и встроенные эскизы.

6. RAS Растровый формат с низкой степенью сжатия, поддерживает до 36 разрядов.

7. EPS (Encapsulated PostScript). Расширенный формат Post Graphic, позволяющий внедрять файлы рисунков PostScript в другие документы.

8. PNG (Portable Network Graphics - Переносимая сетевая графика). Этот формат является альтернативой формата GIF. Позволяет создавать либо 8-битовые, либо 24-битовые изображения. Данный формат поддерживает прозрачность для рисунков, содержащих тысячи и миллионы цветов. Однако в некоторых веб-обозревателях для отображения рисунков PNG требуются особые подключаемые модули (подключаемый модуль: программный модуль, интегрируемый в веб-обозреватели для обеспечения работы определенных интерактивных и мультимедийных элементов).

   Список типов формата PNG, которые можно использовать:

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

   • Формат PNG-24 также похож на формат GIF и поддерживает 24-разрядную цветовую палитру. Подобно формату JPEG формат PNG-24 сохраняет широкую гамму и тонкие переходы яркости и оттенков, присутствующих на фотографиях. Формат PNG-24, как и форматы GIF и PNG-8, сохраняет четкость деталей в штриховой графике, логотипах и иллюстрациях с текстом. Этот формат не распространенный и не все обозреватели его поддерживают.

9. WMF (Microsoft Windows Metafile). Этот формат поддерживает растровые и векторные данные (векторная графика). Способ представления графических объектов, таких как линии, дуги, окружности и прямоугольники с использованием геометрических формул. Противоположность растровой графике (точечные рисунки), где изображение представляется совокупностью точек, а также данными в формате EPS. Если на страницу добавлен рисунок в формате, отличном от GIF и JPEG, то при ее сохранении рисунок автоматически преобразуется в формат GIF, если он содержит меньше 8 разрядов цвета, или в формат JPEG, если он содержит больше 8 разрядов цвета.

10. PDF  (Portable Document Format - Переносимый формат документа) разработан фирмой Adobe Systems. Файлы, записанные в данном формате, имеют расширение *.pdf.

    • Формат PDF - один из форматов для передачи электронных документов через Интернет.

    • Документ, открытый в формате PDF полностью сохраняет внешний вид и структуру оригинала (макет, шрифты, графика) независимо от того, на какой платформе (Win, Mac, Unix) был создан, и каким приложением был открыт файл.

    • Использование электронных документов в этом формате позволяет их успешно распечатывать с сохранением текста, шрифтов и т.д. Беспокоиться о русификации своего компьютера при этом не нужно. Все необходимые русские шрифты уже встроены в документы, записанные в формате *.pdf.

    • В PDF-документ могут встраиваться интерактивные элементы - гиперссылки, видео- и аудиофайлы, кнопки и поля для ввода текста.

    • Для просмотра или печати необходима программа Adobe Acrobat Reader, которая распространяется бесплатно и может быть скачена с сервера фирмы-разработчика www.adobe.com. Данную программу часто можно найти на большинстве дисков с драйверами, на любом диске программного обеспечения компании Adobe Systems, а также при покупке нового компьютера.

Комментарий:

1. Форматы 2-8 используются довольно редко. Предоставление графических материалов для создания и реконструкции сайта в форматах 2-8 нежелательно.

2. Информация о формате PDF представлена в справочных целях. Контент, подлежащий размещению на сайте и представленный в данном формате, мы не принимаем.

• Для рисунка в формате GIF может быть разрешено использование прозрачного цвета. Кроме того, такой рисунок может быть указан как рисунок с чередованием (линии такого рисунка отображаются при загрузке с чередованием).

• Для рисунка в формате JPEG могут быть заданы качество и число последовательных проходов. Чем ниже качество рисунка, тем выше его степень сжатия и меньше размер файла. Число последовательных проходов определяет число проходов, за которое рисунок отображается при загрузке в веб-обозревателе. Эти свойства могут задаваться при сохранении веб-страницы и её рисунков.

• Рисунок в формате GIF и JPEG можно отображать в окне веб-обозревателя постепенно. В ходе загрузки рисунок может отображаться все более четко, пока не будет загружен весь файл.

• Имеется возможность добавлять на веб-страницы анимированные рисунки в формате GIF и видеозаписи. Анимированный рисунок GIF представляет собой набор последовательно отображаемых рисунков GIF. Он может быть создан в графическом редакторе. Кроме того, много анимированных рисунков GIF можно найти в Интернете.

Заказ сайта

• На веб-страницу могут быть добавлены любые видеозаписи, воспроизводимые в универсальном проигрывателе Windows, например видеозаписи в формате AVI (AVI : мультимедийный формат Microsoft Windows, который применяется для записи звука и видеоизображения).

• Этот формат разработан с учетом стандарта Microsoft RIFF (Resource Interchange File Format).

• Кроме того, имеется возможность задавать такие параметры воспроизведения видеозаписей как однократное воспроизведение после первой загрузки страницы, непрерывное воспроизведение или воспроизведение при наведении указателя мыши на видеозапись.