Интернет-реклама

Методики создания баннеров

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

Либо ее нет. Креативность, в отличие от маразма, с возрастом не наступает...

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

Графические Форматы

Работая с персональным компьютером, вы наверняка не раз сталкива­лись с различными графическими изображениями, представленными в электронной форме. Такие картинки хранятся в файлах, имеющих определенное расширение: .tif, .bmp, png и. рсх Именно расширение ука­зывает на файловый формат, в котором записано каждое изображение. Формат определяет не только свойства и качество картинки, но и воз­можную область ее применения. Например, графика, представленная в стандарте TIFF (файлы с расширением. tif) чаще всего используется в полиграфии. В частности, все иллюстрации, дополняющие текст этой книги, первоначально были переведены именно в этот формат. Изоб­ражения BMP (Windows BitMap) предназначены для отображения гра­фики в приложениях операционной системы и считаются графическим стандартом MS Windows.

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

GIF

В 1978 году двое израильских исследователей - Якоб Зив (Jacob Ziv) и Абрахам Лемпел (Abraham Lempel) разработали принципиально но­вый для того времени алгоритм сжатия информации без потери данных, которому дали полученное из сокращения собственных фамилий и даты завершения своего проекта название LZ78. Информация о принципах построения этого алгоритма была общедоступной, и спустя несколько лет американский программист Терри Уэлч (Terry Welch) усовершен­ствовал его, добавил в обозначение первую букву своей фамилии и за­патентовал новый алгоритм под названием LZW, также предоставив свою разработку для использования всем желающим. Одним из таких желающих оказался сотрудник компании CompuSer­ve Inc. Боб Берри (Bob Berry), взявший LZW в качестве основы для созданного им в 1987 году принципиально нового графического форма­та GIF (Graphic Interchange Format). Следует отметить, что созданная Терри Уэлчем компания Unisys, которой и принадлежали авторские права на алгоритм LZW, взимала плату за его использование только с производителей аппаратного обеспечения для компьютеров, в котором применялся данный стандарт, например с изготовителей модемов. Раз­работчики программного обеспечения «комиссионными сборами» не облагались.

Однако зимой 1994 года компания Unisys, начавшая испытывать фи­нансовые проблемы, объявила LZW коммерческим стандартом, потре­бовав оплаты за его использование. Это автоматически сделало GIF единственным в мире «платным» графическим форматом, что вызвало волну недовольства среди пользователей Интернета, поскольку прак­тически на всех современных web-сайтах, а также в 90% рекламных изображений так или иначе применяются элементы GIF. Тем не менее GIF чрезвычайно широко используется в Интернете и сейчас, причем пользователи не обязаны оплачивать кому бы то ни было возможность опубликовать во Всемирной сети изображение в данном формате, так как упомянутые выше финансовые претензии касаются в первую оче­редь, производителей работающего с GIF программного обеспечения. Благодаря возможностям алгоритма LZW стандарт GIF позволяет зна­чительно сокращать объем итогового графического файла по сравне­нию с исходным изображением. Достигается это методом смешения сходных оттенков в один. Если, например, в составе рисунка имеется участок, состоящий из нескольких сходных полутонов, к примеру го­лубого, светло-голубого и темно-голубого цвета, они будут кодирова­ны одним оттенком - голубым. Информация об изображении в файле

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

Если вы готовите рисунок для сохранения в формате GIF, необходимо избегать следующих художественных приемов: градиентных заливок, размытий, постепенных цветовых переходов с множеством оттенков. Не следует также пользоваться графическими фильтрами, подобными фильтру «блик» редактора Adobe PhotoShop, для неравномерного сме­шения нескольких цветов на одном участке изображения, например при создании эффектов изменения интенсивности освещения. Это свя­зано с тем, что алгоритм замещения схожих оттенков одним в формате GIF далеко не всегда работает корректно. Поэтому участки с множест­вом различных оттенков на небольшом фрагменте рисунка после сохра­нения изображения в индексированной 256-цветовой палитре будут выглядеть смазанными и «грязными». Этого можно избежать, приме­няя по возможности однотонные и контрастные цвета.

Одно из замечательных свойств стандарта GIF — его уникальная осо­бенность, названная разработчиками «interlace», или, по-русски, < <чересстрочность». Она позволяет загружать картинку с сервера в клиент­ский браузер не целиком, а частями, причем процедура считывания файла выглядит следующим образом: сначала на экране отображаются первая, пятая и десятая строки, составляющие изображение, затем — вторая, шестая и одиннадцатая и т. д. Таким образом, для пользовате­ля создается иллюзия постепенной загрузки графического элемента: картинка как бы медленно проявляется на странице, что не только создает красивый визуальный эффект, но и дает возможность пользо­вателю наблюдать за появлением графического изображения «в про­цессе», вместо того чтобы несколько секунд любоваться на пустой учас­ток экрана.

Через несколько лет после создания стандарта GIF, в 1989 году, компа­ния CompuServe выпустила новую версию этого графического формата, получившую название GIF89a. Данная модификация имеет еще две уникальные особенности, широко использующиеся в современном Ин­тернете.

Первая называется "transparency" и заключается в создании прозрачно­го фона для изображения методом сохранения вместе с файлом так на­зываемого альфа - канала, представляющего собой маску прозрачности рисунка. Цвета, помеченные в альфа - канале как прозрачные, станут невидимыми в браузерах и большинстве других программ, предназна­ченных для просмотра изображений. Эта функция необходима, напри­мер, для того, чтобы разместить на web-сайтах с различным цветовым решением какие-либо тексты или изображения, которые при загрузке картинки отобразятся без «подложки», слившись с фоном страницы. Убрать ненужный фон из файла GIF можно, воспользовавшись встро­енной процедурой графического редактора Adobe PhotoShop, соответ­ствующим образом отредактировав таблицу цветов. Другая полезная особенность стандарта GIF89a заключается том, что этот формат позволяет сохранять в файле с одним заголовком несколь­ко разных изображений, демонстрируя их на экране последовательно одно за другим, причем с возможностью указать порядок их чередова­ния и временной интервал между сменами кадра. Именно на этом прин­ципе построена весьма распространенная в Интернете GIF-анимация, о которой мы поговорим подробнее чуть позже.

JPEG

JPEG (Joint Photographic Experts Group) - графический стандарт, ис­пользующий несколько иной алгоритм сжатия с потерей качества. Он основан на принципе компрессии картинки путем удаления из файла избыточной и малозначительной информации. Изначально он был раз­работан для представления в электронной форме фотографий и слож­ных рисунков (например, репродукций картин) с целью получить «на выходе» файлы небольшого объема.

Максимальное число цветов, которое может содержать изображение в формате JPEG, - 16 миллионов. При сохранении картинки в JPEG-файл пользователю будет предложено выбрать степень сжатия графики, определяющую размер графического файла в килобайтах. Однако сле­дует учитывать, что чем выше степень компрессии такого изображе­ния, тем ниже его качество. Дизайнеру, создающему иллюстрации для баннера в данном формате, необходимо избегать образования больших участков, заполненных одним цветом, чтобы на изображении не появ­лялись цветовые «шумы» и «грязь». Из всего сказанного следует впол­не очевидное заключение: формат JPEG лучше всего использовать для передачи фотографических изображений, а также картинок с большим количеством полутонов и цветовых переходов.

Существует несколько разновидностей стандарта JPEG. Среди них - формат JPEG Baseline Optimized, основанный на более совершенном алгоритме компрессии изображений. Недостатком данного формата JPEG является то, что его не распознает целый ряд часто используе­мых приложений. Так называемый Progressive JPEG был оптимизиро­ван специально для представления графики во Всемирной сети, изоб­ражения в этом формате сжимаются чуть лучше, чем в стандартном JPEG, но хуже, чем в JPEG Baseline Optimized. Отличительная особен­ность Progressive JPEG — возможность сохранять графику в чересстроч­ном режиме, так же, как это реализовано в стандарте GIF. При работе со стандартом JPEG следует учитывать, что сжатию с наи­меньшей потерей качества поддаются изображения, сохраненные с вы­соким разрешением, от 150 до 300 dpi. В процессе обработки иллюстра­ций лучше всего сохранять картинку в формате TIFF и переводить в JPEG лишь готовый результат, поскольку каждое промежуточное со­хранение файла JPEG на диск приводит к удалению второстепенной информации и ухудшению качества рисунка.

PNG

В последнее время многочисленные системы баннерного обмена все чаще и чаще стали принимать рекламные баннеры, представленные в относительно новом для современного Интернета формате, называе­мом PNG (Portable Network Graphics).

Описанная выше «криминальная история» с неожиданным переходом алгоритма сжатия LZW в статус платного спровоцировала стремление пользователей избавиться от формата GIF, дальнейшая судьба которого становилась все более туманной. С этой целью во второй половине де­вяностых годов была создана инициативная группа программистов и исследователей, которую возглавил американский специалист по элек­тронным технологиям Том Боутелл (Thomas Bowtell). Перед ней стоя­ла нелегкая задача: разработать стандарт, который не только вобрал бы в себя все лучшие качества GIF, но и превзошел бы его по всем харак­теристикам, оставаясь при этом совершенно бесплатным для пользо­вателей. Основной областью применения данного формата должен был стать Интернет. Такой стандарт был создан и получил название Portable Network Graphics - PNG.

PNG, как и GIF, поддерживает interlacing (чересстрочность), но не толь­ко по горизонтали, но и по вертикали. Палитра PNG не ограничивается 256 цветами, данный формат позволяет создавать изображения с глу­биной цвета до 48 бит. Любопытные изменения внесены в режим про­зрачности графики: PNG также поддерживает альфа-канал, но состоит он не из одного уровня, как альфа-канал файлов GIF, а из 254 уровней для каждого элемента изображения, с диапазоном прозрачности от 0 до 99%. Благодаря этому дизайнер получает возможность создавать картинки с переменной прозрачностью, например логотипы, фон кото­рых плавно сливается с фоновым цветом html-документа, каким бы тот ни был.

Помимо альфа - канала изображения PNG содержат так называемый блок описания гамма-коррекции. Под переменной «гамма» в данном случае подразумевается некая величина, выражающая зависимость яр­кости свечения каждой точки экрана пользователя от напряжения на электродах кинескопа, которое берется из файлов управления видео­подсистемой компьютера. Таким образом, при открытии изображения, созданного с помощью IBM-совместимой машины, на компьютере дру­гого производителя, например на Apple Macintosh, в яркость цветопе­редачи вводится соответствующая поправка, и картинка на нем ото­бражается совершенно идентично. Этим стандарт PNG еще более при­близился к основной идее Интернета - единообразию отображения web-страниц и графических элементов на компьютерах различных про­изводителей.

Поскольку данный формат появился на свет относительно недавно, его поддерживают далеко не все браузеры, тогда как GIF и JPEG распозна­ются без проблем любыми программами, предназначенными для ото­бражения графики. PNG поддерживают Microsoft Internet Explorer, начиная с версии 4.0, и Netscape Communicator версий 4.04 и выше. Старые браузеры отобразить картинку в формате PNG не смогут.