Электронная библиотека книг Александра Фролова и Григория Фролова.
Shop2You.ru Создайте свой интернет-магазин
Библиотека
Братьев
Фроловых

Сервер Web своими руками. Язык HTML, приложения CGI и ISAPI, установка серверов Web для Windows

© Александр Фролов, Григорий Фролов
Том 29, М.: Диалог-МИФИ, 1997, 288 стр.

[Назад] [Содеожание] [Дальше]

Как выбрать формат графического файла

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

Прежде всего вы должны выбрать формат файла, в котором будет храниться графическое изображение. Несмотря на то что сегодня существуют десятки различных графических форматов, практически для оформления документов HTML используются только два. Первый формат - это формат обмена графикой GIF (Graphics Interchange Format), второй - JPEG. Рассмотрим особенности этих форматов, не углубляясь в несущественные для нас технические подробности.

Формат JPEG

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

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

Минимизация размера графического изображения без существенных потерь качества - очень важная процедура. Дело здесь в том, что в среднем информация передается через сеть Internet со скоростью примерно 1 Кбайт в секунду, поэтому на загрузку больших изображений может уйти слишком много времени. Поэтому даже и не думайте о том, чтобы разместить в документе HTML цветную фотографию, занимающую на диске 1 Мбайт - посчитайте сами, сколько времени эта фотография будет передаваться пользователю.

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

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

Есть ли у формата JPEG недостатки?

Конечно есть, а как же без них.

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

Формат GIF

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

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

Во-вторых, вы можете существенно уменьшить размер графического файла, записав в него сокращенную цветовую палитру вместо полной 256-цветной.

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

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

И, наконец, в пятых, формат GIF позволяет создавать файлы с чересстрочным (interlaced) изображением. Что это такое?

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

Как устроен файл GIF?

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

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

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

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

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

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

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

Выбор палитры

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

На что влияет этот размер?

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

Например, если палитра (то есть таблица цветов) содержит только два элемента, в изображении имеются два цвета (например, черный и белый, либо красный и желтый). При этом для представления цвета каждого пиксела достаточно использовать один бит. Если же палитра содержит 256 цветов, для представления цвета пиксела необходимо использовать восемь бит данных.

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

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

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

Подробнее об использовании палитр в операционной системе Microsoft Windows вы можете узнать из 14 тома “Библиотеки системного программиста”, который называется “Операционная система Microsoft Windows для программиста. Графический интерфейс GDI”.

Какой формат лучше

Современные навигаторы позволяют работать с форматами GIF, JPEG, PCX, BMP и XBM, однако форматы PCX и BMP не обладают развитыми средствами компрессии, поэтому они практически не используются. Формат XBM родился в мире операционной системы UNIX с оболочкой X-Windows и применяется только для хранения черно-белых изображений. При размещении в документе HTML графического изображения вы должны будете сделать выбор между форматами GIF и JPEG.

Если вы размещаете в документе HTML копию экрана или другое аналогичное изображение (например, изображение окна приложения или диалоговой панели), выбор сделать легко. В этом случае вам придется использовать формат GIF, так как сжатие с потерей качества приведет к неудовлетворительному результату.

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

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

[Назад] [Содеожание] [Дальше]