Рейтинг@Mail.ru

Красивый gif баннер для вашего сайта: доступная инструкция к применению

Лучшим средством для продвижения товара в онлайн-магазине или на веб-портале является анимированная баннерная реклама, спрос на которую не падает на протяжении нескольких лет. И это не мудрено! Современный рекламный ролик в виде gif баннера для сайта, помещённый в привлекательную «мультипликационную» обложку, способен заинтересовать потенциальных клиентов и заставить их перейти на площадку рекламодателя.

 

 

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

 

Рекламная ГИФОмания

Что такое gif баннер? Это уникальная рекламная анимация, которая содержит в себе фиксированное количество изображений, методически сменяющих друг друга. Расположение и частота кадров всегда неизменны: они задаются на этапе создания баннера. Благодаря подобной смене и создаётся «мультяшный» эффект, то есть привлекающая взор анимация.

Формат gif является классикой жанра в русле создания рекламной графики. Gif баннеры для сайта используются в статичном и анимированном варианте. «Мигающие» модели, несомненно, занимают лидирующую позицию по отношению к скучной статике: яркие надписи, поступательно сменяющие друг друга, лучше и эффективней привлекают внимание потребителей интернет-товара или услуги.

 

 

Создавая анимированный gif баннер, необходимо учитывать следующие бонусы подобной рекламы:

 

  • это самый бюджетный и простой вариант в изготовлении привлекательной графики;

  • баннер в формате «гиф» может быть опубликован на рекламном ресурсе любого типа: в баннерных сетях, на сервисе-партнёрке и, конечно же, в блогах.

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

  • индексация баннеров подобного типа происходит очень быстро и продуктивно.

 

Говоря об анимированной рекламной графике, нельзя забывать и о недостатках этого элемента:

 

  • она занимает существенный «вес», который может отрицательно влиять на скорость загрузки веб-страницы;

  • функционал гиф баннера ограничен традиционной сменой кадров;

  • качество «гифки» может существенно пострадать из-за попыток снижения баннерного «веса».

 

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

 

Оптимальная программа для изготовления gif баннеров

 

 

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

 

Вот, собственно, и список популярных программ:

 

  1. BannerMakerPro. Эффективный софт, который применяется в изготовлении элементарных gif баннеров для сайта. Главный бонус программы – доступный и удобный интерфейс. Есть и минусы у BMK, среди которых чаще всего выделяют лимитированный функционал.
  2. EasyGifAnimator. Аналогично первой программе для изготовления gif баннеров: EGA обладает приличным интерфейсом, понятным и для новичка. С её помощью можно создать простецкий gif баннер, однако именно этот момент часто причисляют к разряду недостатков. Софт EGA работает на платной основе, однако можно найти и бесплатные версии (free trial) с ограниченным по времени пользованием.
  3. UnleadGifAnimator. Софт с более-менее замысловатым функционалом. Сделать мигающий баннер для сайта в этой программе будет затруднительно для новичков, однако для профессионалов UGA является настоящим кладом.
  4. BannerDesignerPro. Ещё более усложнённый сервис для изготовления анимированной баннерной рекламы. Софт обладает сложной начинкой, в которой не каждый разберётся. При этом специалисты в области разработки рекламных баннеров считают Banner Design Pro ведущей площадкой в рейтинге лучших программ для изготовления gif баннеров.
  5. AdobePhotoshopCS5. Одна из самых усовершенствованных софтов в плане разработки баннерной рекламы стиля gif. Практически неограниченные возможности, высококачественная графика. Единственный недостаток – программа стоит недёшево. Но, разумеется, этот минус легко перечеркивается вышеперечисленными достоинствами AP.

 

Анимация, сделанная в AP

 

 

Рассмотрим пошаговую инструкцию того, как сделать меняющийся баннер своими руками при помощи Фотошопа. И хотя эта программа считается довольно сложной и мудреной в управлении, однако для создания качественной и привлекательной gif анимации вам потребуется сделать всего 15 шагов.

Рассмотрим рекламную «гифку» на примере стандартной «кнопки сайта», обладающей габаритами – 88*31 pixel. Просмотрев нашу инструкцию, вы научитесь быстро создавать анимированные gif баннеры в софте AP. Не забудьте установить программу Image Ready, которая обязательно входит в лицензионный комплект Фотошопа.

Итак, для того чтобы сделать меняющийся баннер в AP, вам понадобится:

 

1. Создать новый документ при помощи комбинации ctrl+n и установить необходимые габариты. В нашем примере это – 88*31 pix.

2. Задать цветовую палитру фона: к примеру, #FDF8D9.

3. Кликнуть на F7: откроется палитра слоёв. Зажав кнопку alt, щёлкнуть два раза по Background. Получается элементарный фоновый слой.

 

 

4. Необходимо создать обводку для слоя изнутри: кликнуть два раза по созданному пласту и в возникшем окошке выбрать Stroke (найти его можно в нижнем углу окна). Задать характеристики будущего баннера: «размер»: 1; «локализация»: внутри; «цвет»: #A28564. После чего кликнуть O’k.

 

 

5. Придумать привлекательную текстовую часть для первого кадра с помощью инструмента горячей клавиши T. Необходимо на время «скрыть» текст, кликнув по этой иконке – . У нас первая фраза звучит так: «Всё самое интересное в сети Интернет».

 

 

6. Изготовление подложки. Сделать новый пласт с помощью нажатия комбинации shift+ctrl+n. Выбрать инструмент прямоугольного выделения (для удобства можно использовать горячую клавишу М). Выделить необходимую часть для работы: используйте «Пробел», чтобы быстро передвигать выделенную область. Залить форму оттенков #FAEEAC.

 

 

7. Убрать выделенную область при помощи ctrl+d, написать новую фразу. У нас это:

 

 

8. Выбрать пласт с фразой FREEGOLD.RU, копировать его с помощью ctrl+j. Оба текстовых слоя необходимо скрыть и работать с «клонированным» пластом. Найти в раскладке Filter пункт Motin Blur и задать следующие параметры: «угол» - 0, «дистанция» - 10.

 

 

 

9. Анимировать первую сценку: сделать фоновый, «подложный» и текстовый слои визуально просматриваемыми.

 

 

10. Открыть пункт «Анимация» в раскладке Windows и копировать кадр: для этого необходимо активизировать функцию Duplicates selected frames.

 

 

11. Настроить функцию анимации для следующей сценки. Включить копированный слой и посмотреть «мультик» с помощью иконки Play.

 

 

12. Снова сделать «клон» сценки. Размытый пласт выключается, а более чёткий – включается. Выбрать вторую и третью сценки, используя shift, нажать Tweens animation frames.

 

 

Указать в возникшем окне число сценок – 5, нажать O’k. Подобный показатель позволит добиться плавного перехода между сценами.

 

 

13. Дублировать последнюю сценку. Фоновый и текстовый («Самое интересное…») пласты оставить включенными, оставшиеся слои – отключаются. На выходе должно получиться до 9 сценок.

 

 

14. Необходимо задать временной показатель для каждой отдельной сцены. Это делается в нижней вкладке, расположенной внизу любого кадра. В предложенном списке отсутствует подходящий показатель времени? В таком случае следует воспользоваться функцией Others или «Другие».

 

 

Подбирая оптимальный временной промежуток для нашего баннера, мы остановились на:

 

 

15. Последний шаг – сохранение анимированной гифки в разделе File. В появившемся окошке указать формат gif.

 

В итоге, мы получим вот такой мигающий баннер для сайта:

 

Регистрация

Авторизация

Забыли пароль?

Восстановить пароль

Регистрация

Регистрация успешно завершена!

Вы будете перенаправлены автоматически через 5 секунд

Или Вы можете перейти по ссылке: https://ginads.com/ru/account/companies

Или Вы можете перейти по ссылке: https://ginads.com/ru/account/sites