Gif баннеры

GIF Баннеры

от 4 500 руб.

Можно сказать, без преувеличения, что формат изображений и анимаций GIF знаком каждому пользователю Интернета. Баннеры на сайтах, анимированные “гифки”, смайлики и стикеры в мессенджерах  GIF применяется в сети повсеместно. Это один из самых популярных и доступных типов файлов растровой графики и анимации.

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

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

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

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

Немного теории.

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

Формат GIF (англ. Graphics Interchange Format — «формат для обмена изображениями») был разработан компанией CompuServe в 1987 году, на заре Интернета, для обеспечения передачи растровых изображений по сетям вне зависимости от компьютерной платформы и операционных систем. С тех пор GIF дорабатывался и модифицировался, но суть осталась прежней.

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

Цветовая палитра GIF  256 цветов. Как правило, это так называемые Web Safe (безопасные) цвета, которые одинаково отображаются во всех браузерах и программах.
Однако, количество используемых цветов в конкретной гифке можно уменьшать. Таким приемом часто пользуются дизайнеры, объединяя близкие цвета и оптимизируя вес GIF-файла.
Можно создать гифку даже из 2 цветов, например, черного и белого.

GIF может состоять из одного кадра и тогда картинка будет неподвижной, статичной, такой же, как изображения JPG, PNG или BMP.
Но Animated GIF может состоять и из нескольких кадров, которые переключаются с заданной скоростью и в таком виде гифка становится больше похожей на видеофайл, ведь любое видео — это переключение кадров с заданной скоростью и алгоритмом сжатия.
Расширение файла у статичной и анимированной гифки одно  GIF, это один и тот же формат.

Как работает анимированный GIF?

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

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

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

Доступные варианты:

  • бесконечно (loop);
  • остановить после нескольких циклов (количество указывается при экспорте GIF-файла);
  • проиграть только один раз.

Обращаем ваше внимание, что многие рекламные сети ограничивают этот параметр, например, Google AdWords, требует остановки GIF после 30 секунд показа. При этом баннер может показываться циклично, но в пределах этих 30 секунд. То есть, баннер общей продолжительностью 10 секунд может быть проигран 3 раза и затем остановлен.

Особенности передачи изображения.

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

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

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

Оптимизируй это.

Размещая gif-баннер в интернете, вы рано или поздно столкнетесь с требованием рекламной площадки по ограничению веса файла. У Google AdWords это ограничение в 150кб., у Яндекса 120 - 150кб. (в зависимости от типа размещения и размера баннера).

Что же делать, если ваша короткая гифка весит больше мегабайта, а рекламная сеть требует значительно сократить вес?

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

Приемы оптимизации, следующие:

  • сокращение количества используемых цветов. Часто, уменьшение выставленного по умолчанию показателя в 256 цветов, до 128 или 64, практически визуально незаметны;
  • настройки Lossy (сжатия файлов за счет объединения близких похожих цветов);
  • настройки Diffusion (или Noise)  изменение схемы смешивания близких по расположению цветов и добавление “пустых” белых пикселей по паттерну, создающему эффект визуального “шума”, в некоторых случаях, вполне приятный глазу;
  • объединение похожих кадров анимации;
  • сокращение количества кадров за счет удаления, например, каждого 2-го кадра при уменьшении скорости проигрывания, что визуально часто незаметно. Меньше кадров = меньше вес.

Все эти настройки могут значительно, а иногда в разы, уменьшить вес GIF-баннера.

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

Использование GIF баннеров в рекламе.

Практически все рекламные площадки и сети принимают к размещению баннеры в формате GIF.Google AdWords, Яндекс.Директ, Рамблер, adFox, Mail.ru, myTarget  везде вы можете использовать гиф-баннеры, при соблюдении, разумеется, технических требований.
Как правило, требуемый вес GIF баннера будет находиться в районе 150кб.

GIF баннеры обеспечивают рекламодателю самое широкое покрытие. Дополнительно GIF баннеры часто используются в качестве так называемых “заглушек”  то есть, картинок, повторяющих содержимое анимированного HTML5-баннера (или Flash-баннера). В случае невозможности показа HTML5 или Flash на устройстве пользователя ему демонстрируется GIF версия баннера.

Хорошей практикой стало изготовление комплекта анимированных HTML5-баннеров разных размеров и дополнительное создание дублирующего комплекта в формате GIF.

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

GIF баннеры для соцсетей и мессенджеров.

В популярных социальных сетях и мессенджерах GIF анимации и картинки тоже широко используются для рекламы.GIF баннер ВКонтакте можно вставить в универсальную рекламную запись или обычную запись в ленте сообщества. Рекомендуемые размеры гиф-баннера в ВК  ширина до 1000px, вес для проигрывания в режиме автозапуска (автоплея) в районе 10-12мб.

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

GIF в рекламе с помощью Email-рассылок.

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

Общие рекомендации к дизайну и содержанию рекламных GIF баннеров.

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

Но, в любом случае стоит придерживаться основных правил создания GIF баннеров:

  • избегать слишком быстрых, раздражающих пользователя вспышек, миганий;
  • выбирать скорость переключения кадров баннера комфортной для прочтения информации;
  • использовать четкие контрастные шрифты, облегчающие прочтение текста;
  • избегать слишком длинных текстов и лишней информации, которая продублирована на сайте или посадочной странице, на которую приведет баннер;
  • применять в дизайне чистые цвета и качественные изображения, не замусоривать баннер мелкими деталями;
  • размещать на баннере мотивирующие кнопки с призывом к действию («Купить», «Подробнее», «Заказать»), которые повышают CTR (показатель кликабельности) баннера.

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

Примеры GIF баннеров

Данные отправляются

Данные отправляются