Дизайн баннера как сделать – 12

Содержание

15 дизайнерских приемов — как сделать баннер, за который не будет стыдно

В интернете много шумихи по поводу баннеров. Они уже отжили свое? Кликает ли кто нибудь на них? Может, они уже мертвы? А вдруг появилась лучшая альтернатива баннерам?

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

Сегодня мы рассмотрим 15 дизайнерских приемов для создания баннеров, за которые не будет стыдно. Для примеров мы взяли победителей 2015 года по версии Webby Awards.

1. Придерживайтесь стандартных размеров

Баннерная реклама не относится к типу продукта один «размер для всего». Вы должны исходить из тех спецификаций, которые нужны для ресурса, на котором вы планируете размещать рекламу, а большинство сайтов используют набор стандартных размеров. (Это также касается и email-рассылок)

На Google Adwords, одном из крупнейших серверов баннерной рекламы в интернете, можно узнать про наиболее популярные размеры.

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

  • 728×90 px — полноразмерный баннер (часто показывается вверху или внизу страницы)
  • 300×250 px — встроенный прямоугольник (преимущественно показывается в правой части сайта или вставляется в текст)
  • 300×600 px — блок на половину страницы
  • 320×100 px — мобильный баннер

2. Придерживайтесь последовательности

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

Создайте простую последовательность элементов. Сообщение должно быть кратким — от двух до 10 слов в идеале. Что вы предлагаете и почему люди должны этого хотеть. После этого добавьте логотип или какой-то другой идентификатор. Он должен быть читабельным и не слишком большим. В заключение добавьте причину для клика. Может, у вас сейчас распродажа? Код купона? Подписка на почту?

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

3. Один баннер равняется одному сообщению

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

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

4. Помните о том, где будет размещен баннер

Где вы планируете размещать баннеры после того, как сделаете сам креатив? Если вы используете сервисы подобные Google, у вас будет не сильно много возможностей контролировать размещение. Но если вы хотите разместить их на определенных вебсайтах, в приложениях или email рассылках, вам нужно будет изучить их и принять во внимание их дизайн, прежде чем делать свои баннеры.

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

5. Используйте призыв к действию

Какая самая главная задача баннера? Правильно — на него должны кликнуть. Используйте призыв к действию (Call to Action) в каждом баннере, который вы делаете. Подскажите пользователю, что ему нужно делать дальше.

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

6. Забудьте про Flash

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

Используйте вместо этого HTML5. Если вам нужно сконвертировать какие то свои старые креативы и вдохнуть в них новую жизнь, у Google есть небольшой урок, который поможет это сделать.

7. Используйте кнопки

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

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

8. Сфокусируйтесь на шрифтах

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

Согласно правилу большого пальца, обычно двух начертаний шрифтов бывает достаточно.

  1. Делайте большие заголовки. Используйте жирные, немного необычные или цветные шрифты, чтобы привлечь внимание пользователей.
  2. Отдавайте предпочтение шрифтам без засечек (sans serif). Вы можете использовать два размера или два начертания жирного — один для основного текста, а другой для кнопок или призыва к действию. Просто убедитесь, что они легко читаются.

9. Используйте простую анимацию

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

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

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

10. Сохраняйте правильно

Это важный момент. Никто не разместит вашу рекламу, если файлы слишком много весят или у баннера будет неправильный формат. Оптимизируйте размер по максимуму. Итоговый размер файлов не должен превышать 150 кб, в зависимости от площади рекламного баннера.

После этого убедитесь, что баннер сделан в правильном формате, стандартном для интернет-рекламы. Распространенные форматы баннеров — PNG и JPG для статических баннеров, GIF — для анимированных. SVG формат тоже набирает оборотов и все чаще принимается разными рекламными сетями. Забудьте об SWF (Adobe Flash) — от него сейчас уже практически все отказались, и даже браузеры перестают его поддерживать. Вместо него широкое распространение получили HTML5 баннеры, которые создаются с помощью таких программ, как Google Web Designer, Adobe Animation или рускоязычный онлайн конструктор баннеров Bannerboo.

11. Сфокусируйтесь на текстах

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

Вы же не собираетесь впихнуть в баннер 100 слов, правда? Неплохой вариант — поработать с копирайтером, который поможет подобрать правильное послание. Подбирайте такие выражения, которые отвечают на возможные вопросы пользователей, или придумайте интригующий посыл, чтобы привлечь их внимание.

12. Используйте элементы бренда

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

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

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

13. Используйте яркие визуальные элементы

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

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

14. Релевантный контент

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

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

15. Будьте попроще

Это прописная истина. Если вы переутомите пользователя обилием текстов, анимаций, цветов, фактов, вы рискуете утратить первоначальный смысл. Будьте попроще.

В случае с баннерами, всего по одному будет достаточно.

  • Одна картинка
  • Одно текстовое сообщение
  • Один призыв к действию
  • Один элемент бренда

Выводы

Так что, баннеры еще пока не умерли. (И не факт, что это когда-нибудь случится). Баннерная реклама может стать эффективным способом достучаться к вашей целевой аудитории а также повысить узнаваемость вашего бренда.

Автор — Сarrie Сousins. (Перевод — Bannerboo.com)

spark.ru

15 правил создания кликабельного баннера :: Shopolog.ru

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

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

Цвета

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

Например, наш сервис динамического ремаркетинга при трансляции объявлений учитывает, чтобы цветовая схема объявлений соответствовала сайту магазина (цвет кнопки и фона). Так мы напоминаем пользователям какими товарами и на каком сайте они интересовались. Объявления выглядят как небольшая копия сайта и работают на подсознание. А оно, как известно, есть у всех.

Визуальная иерархия

Обязательные составляющие баннера:

Логотип компании работает на узнаваемость. Проследите, чтобы он был заметен, но не перекрывал предложение и призыв к действию. В сервисе динамического ремаркетинга логотип используется всегда и обязательно. Так, объявления напоминают не только о ранее просмотренных товарах, но и о сайте, на котором человек смотрел товар.

Баннер презентует продукт или услугу, привлекая внимание скидкой или специальными условиями. Помните, на многих площадках есть ограничение — текст не должен занимать более 20% баннера.

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

  • Призыв к действию.

Это главный элемент баннера, который побуждает пользователя кликнуть. Используйте кнопки с фразами “Купить”, “Узнать больше”, “Зарегистрироваться”.

Пример баннера Jaguar:

Наш пример:

Размеры

Загружайте в Гугл Эдсенс баннеры самых конверсионных размеров:

  • 336×280 большой прямоугольник
  • 300×250 средний прямоугольник
  • 728×90 шапка
  • 160×600 “небоскреб”.Идеальное место для показа баннера — первый экран, в окружении основного контента страницы.

Наш сервис работает с Google Adwords. У Google порядка 400 шаблонов и под каждый сайт он самостоятельно подбирает подходящий размер.

По нашей статистике средний сtr по баннерам у нас колеблется от 0,5% — 1,50% в зависимости от аудиторий на тематических площадках Google.

Дизайн

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

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

Рассмотрим в качестве примера наш баннер и расскажем, что в нём учтено. На объявлении есть логотип и основные преимущества жилого комплекса: метро, невысокая стоимость квартир, скидка. Нет кричащих цветов, каждая мысль акцентирована, на баннере изображена знакомая символика метро.

Кнопки на баннерах

Кнопки определяют кликабельность (CTR) баннера. Разместите их под основным содержимым или справа внизу в зависимости от размера баннера. Следите за их единообразием в наборе баннеров.

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

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

Границы, обводка

Убедитесь, что содержимое баннера использует все пространство.

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

Пример баннера Сбербанка:

Наш пример:

Текст

Заголовок и текст должны быть разного размера и занимать не более четырех строк. Откажитесь от курсива, капслока и шрифта мельче 10.

Изображения

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

Реклама джинс от Levis является тому примером:

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

Соответствие стилю компании

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

В качестве примера приведем наш баннер с дальнейшим переходом на целевую страницу:

Соответствие дизайну сайта

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

Ощущение срочности

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

Анимация

Анимированные баннеры могут быть эффективнее статических. Но только в том случае, если анимация не отвлекает от основного сообщения.

Используйте простую анимацию не дольше 15 секунд и не больше трех повторений. Финальный кадр — призыв к действию.

Интерактивность

Интерактивность баннеров больше не ограничена стрельбой по уточкам как в 1999 году. Теперь мы можем выйти за границы баннера.

Формат файла

Сохраните баннер в формате, который поддерживается в сети. Помните, что не все устройства поддерживают flash-баннеры. Стандартные форматы — png и jpg для статических и gif для анимированных баннеров.Выбирайте их и не ошибетесь!

Размер файла

Чем меньше, тем лучше. Google Adwords рекомендует ограничить размер баннера до 150 Кб. Баннер должен загружаться быстро, иначе посетитель страницы пропустит его.

Заключение

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

Качество баннера не в том, как он выглядит, а в кликах, которые он приносит. Он может быть не самым совершенным с точки зрения дизайна. Но, если он приносит клики, вы все делаете правильно.

Автор: Елена Крыкина, Директор по маркетингу Reenter

www.shopolog.ru

Как сделать баннер для сайта: программы, размеры, примеры

Performance Marketing основывается на четко и однозначно измеряемых параметрах Мы находим оптимальные решения в любой отрасли! Работаем над правильными KPI

Мы выпустили новую книгу «Контент-маркетинг в социальных сетях: Как засесть в голову подписчиков и влюбить их в свой бренд».

Подпишись на рассылку и получи книгу в подарок!

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

Что такое рекламный баннер на сайте

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

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

Впервые интернет-баннер увидел свет в 1994 году: он перекочевал в Сеть из печатных СМИ. В дальнейшем данный маркетинговый прием стал развиваться: создавались целые страницы, сверху донизу заполненные агрессивной рекламой. Со временем посетитель привык не обращать внимания на ее обилие — перенаполняемость веб-сайтов рекламой стала считаться дурновкусием.

Как работает рекламный баннер на сайте

Новые клиенты и покупатели

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

Прирост трафика

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

Преимущества данного маркетингового приема

  1. Цена на создание и размещение баннеров намного ниже, чем стоимость прокрутки ролика на ТВ.
  2. Не требуется огромный штат сотрудников для создания материала.
  3. Корректировки под целевую аудиторию, легкое внесение изменений в рекламную кампанию.
  4. Баннерная (медийная) реклама + таргетинг (направленность на определенную целевую аудиторию) — один из самых эффективных приемов в маркетинге.

Виды интернет-баннеров

По типу отображения

  • Статические — одна картинка.
  • Динамические — смена изображений, движущиеся элементы.
  • Видео — ролик проигрывается при наведении мышкой или при клике.

По форматам

  • Простая статическая картинка в растровой графике (JPG, GIF, PNG и т.д.).
  • GIF-анимация — сменяющие друг друга рисунки в растровой графике.
  • Flash-анимация — применяется векторная графика, плавная смена элементов, интересные эффекты, может накладываться звук.

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

По размерам

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

  • 728х90 — «Доска почета».
  • 468х60 — «Горизонтальный».
  • 336×280, 300х250, 300х600, 240х400, 180х50 — «Прямоугольные».
  • 300х600, 120х240 — «Вертикальные».
  • 120х600, 160х600 — «Небоскреб».
  • 250х250 — «Квадрат».
  • 125х125, 120х90, 120х60 — «Кнопки».
  • 88х31 — «Полоса».

Почти все вышеперечисленные размеры доступны для размещения в Яндекс.Директ и Гугл Адвордс.

Как сделать медийную рекламу эффективной

Любой аляпистый блок на веб-ресурсе — это еще не интернет-баннер. Дизайнер должен разместить в небольшом прямоугольнике основную суть о товаре или услуге и одновременно побудить человека кликнуть.

Признаки качественного интернет-баннера

  1. Загружается быстро. Пользователь не должен ожидать долго.
  2. Привлекает внимание. При этом важна не насыщенность цветами или разнообразие кадров. Картинка должна стимулировать посетителя к дальнейшему ознакомлению с материалом.
  3. Оригинальный. Похожими друг на друга изображениями пестрит весь интернет. Поэтому важно заинтересовать искушенного пользователя именно своими ТиУ.
  4. Стимулирует совершить покупку (выполнить действие). Это и есть главная цель любого продвижения.
  5. Вызывает доверие. Особенно важно для малоизвестной компании. При разработке необходимо учитывать психологию цветов и фраз.

Где должен размещаться рекламный блок

Немаловажно также место размещения и размеры медийных материалов.

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

Цветовые гаммы и тексты — важные рекомендации

  • Красный — цвет решительности, побуждения. Но его переизбыток может вызвать агрессию к ТиУ. Его оттенки (пурпур, бордо, розовый) менее агрессивны, но также успешно применяются. Красный в сочетании с черным позволяет подчеркнуть важность чего-либо.
  • Оранжевый — хорошее настроение, побуждение к действию. Считается самым эффективным в рекламе, но плохо подходит для фона.
  • Желтый — радость, настраивает на коммуникабельность, прекрасно сочетается с черным.
  • Зеленый — свежесть, тонус, здоровье. Прекрасно подходит для фона, применяется чаще в медицинских ТиУ.
  • Синий — покой и нежность.
  • Фиолетовый — таинство и торжественность какого-либо события. Подчеркивает оригинальность ТиУ.
  • Серый — самый умеренный цвет, ни у кого не вызывает отторжения.
  • Белый — чистота. Если неагрессивный баннер имеет белый фон, то он не вызывает эмоций.
  • Черный — не подходит для фона, но незаменим как цвет шрифта.

Правила текстового посыла

Картинка только «цепляет» внимание. На медийном блоке важен именно текст, поэтому учитывайте следующие рекомендации:

  • Обращайтесь к вашей целевой аудитории.
  • Придумайте интересный заголовок.
  • Текст должен намекать о вариантах решения проблемы.
  • Он должен интриговать, вызывать любопытство.
  • Должен описывать интересный сюжет, как в любом рекламном ролике.
  • Должен иметь связь с графикой на кадрах.
  • Слова «Вход» или «Нажимай» побуждают к действию.
  • Слово «Бесплатно» интригует каждого.
  • Текст должен занимать до 20% от пространства прямоугольника.
  • Любые цифры вызывают доверие.

Общие рекомендации для дизайна

  • Если у вас есть логотип — не забывайте про него.
  • Оформление шрифта в виде подчеркнутого голубого текста побуждает пользователя кликнуть на ссылку.
  • Используйте элементы дизайна от Windows — на такие баннеры чаще кликают.
  • Не применяйте мигающий, а также черный или красный фоны.
  • Смена изображений не должна быть слишком быстрой. Человеку нужно успеть понять ваш посыл.
  • Если фон прямоугольника белый — обведите его рамкой.
  • Забудьте про курсив, мелкий шрифт и слова, написанные кричащими заглавными буквами.
  • Рекламный материал должен повторять стилистику рекламируемого интернет-проекта.
  • Эротический контекст всегда увеличивает кликабельность (применимо не для всех рекламодателей).
  • Изображения людей привлекают внимание.
  • Создавайте в анимированном блоке не более 4 кадров.
  • Общее время прокрутки анимации — не более 5-6 секунд.
  • Если медиа-реклама всплывает и навязывается, то пользователь ее закрывает.
  • Рекламный материал должен вести на страницу, которая более полно раскрывает его суть.

Программы для создания баннеров для сайта

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

  • ADOBE PHOTOSHOP — платная. Самый мощный графический редактор. Поддерживает множество форматов, инструментов, позволяет использовать разные спецэффекты и добиваться высокого качества изображений.
  • EASY GIF ANIMATOR — платная. Выдает GIF или AVI-формат, позволяет работать как с анимацией, так и со статикой. Предусмотрены красивые эффекты, смена кадров, обладает большим набором инструментов. Доступно 20 открытий для бесплатного тестового применения.
  • BANNER MAKER PRO — платная. Понятный интерфейс, простые функции, любые размеры создаваемых материалов, высокое качество готовой продукции.
  • ARTWEAVER — условно-бесплатная. Российская программа, графический редактор, имеет множество инструментов для обработки изображений. Можно бесплатно работать с базовым набором функций.
  • ULEAD GIF ANIMATOR — условно-бесплатная. Более 15 плагинов, удобная раскадровка, синхронизация с «Фотошопом», сохранение во многих форматах. Можно сохранить материал в HTML.
    ADOBE FLASH CS5 PROFESSIONAL — условно-бесплатная. Сильная программа для разработки FLASH-анимации. Имеет встроенный функционал для производства FLASH-роликов, сотни плагинов, «живую» анимацию, добавление музыки, поддерживает формат FLA. Имеет тестовый период 1 месяц, можно найти бесплатные взломанные версии в интернете.
  • GOOGLE WEB DESIGNER — бесплатный сервис от Гугл. Сложноватый интерфейс, небольшое количество эффектов, зато много подсказок на русском.
  • GIMP — бесплатная. Бесплатный аналог «Фотошопа». По функционалу уступает своему предшественнику, но нулевая стоимость склоняет чашу весов в пользу GIMP.
  • PAINT-NET — бесплатная. Работает только со статикой, ничего лишнего; много возможностей, легкий интерфейс.
  • AURORA 3D-ANIMATION — условно-бесплатная. От статики до FLASH. Много шаблонов, простой интерфейс, тонкая настройка смены кадров, поддерживает формат SWF.
  • SOTHIK SWF — бесплатная. Позволяет создавать FLASH, имеет множество готовых шаблонов и картинок.
  • EASY BANNER — бесплатная. ПО для новичков в дизайне, работает как со статикой, так и с анимацией, есть впечатляющая подборка фонов и стандартных изображений.
  • ALEO FLASH INTRO BANNER — без оплаты. Работает с FLASH, GIF-анимацией и статикой, много шаблонных звуков, готовых анимаций, шрифтов. Простой интерфейс.
  • ATANI — бесплатная. Работает с форматом GIF. Инструментарий очень прост и понятен.
  • BANNER FANS — онлайн-сервис, без оплаты. Много полезных настроек и возможностей. Позволяет рисовать статические медиа-материалы, можно создать баннер онлайн для сайта.
  • ANNERS NACK — онлайн-сервис, без оплаты. Предельно простой принцип работы, есть готовые шаблоны. Пользователь может легко выбрать подходящий готовый вариант и внести свои корректировки.

Резюме

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

semantica.in

15 дизайнерских приемов — как сделать баннер, за который не будет стыдно

В интернете много шумихи по поводу баннеров. Они уже отжили свое? Кликает ли кто нибудь на них? Может, они уже мертвы? А вдруг появилась лучшая альтернатива баннерам?

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

Сегодня мы рассмотрим 15 дизайнерских приемов для создания баннеров, за которые не будет стыдно. Для примеров мы взяли победителей 2015 года по версии Webby Awards.

1. Придерживайтесь стандартных размеров 


Баннерная реклама не относится к типу продукта один «размер для всего». Вы должны исходить из тех спецификаций, которые нужны для ресурса, на котором вы планируете размещать рекламу, а большинство сайтов используют набор стандартных размеров. (Это также касается и email-рассылок)

На Google Adwords, одном из крупнейших серверов баннерной рекламы в интернете, можно узнать про наиболее популярные размеры.

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

  • 728×90 px — полноразмерный баннер (часто показывается вверху или внизу страницы)
  • 300×250 px —  встроенный прямоугольник (преимущественно показывается в правой части сайта или вставляется в текст)
  • 300×600 px —  блок на половину страницы
  • 320×100 px —  мобильный баннер

2. Придерживайтесь последовательности


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

Создайте простую последовательность элементов. Сообщение должно быть кратким — от двух до 10 слов в идеале. Что вы предлагаете и почему люди должны этого хотеть. После этого добавьте логотип или какой-то другой идентификатор. Он должен быть читабельным и не слишком большим. В заключение добавьте причину для клика. Может, у вас сейчас распродажа? Код купона? Подписка на почту?

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


3. Один баннер равняется одному сообщению 



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

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


4. Помните о том, где будет размещен баннер


Где вы планируете размещать баннеры после того, как сделаете сам креатив? Если вы используете сервисы подобные Google, у вас будет не сильно много возможностей контролировать размещение. Но если вы хотите разместить их на определенных вебсайтах, в приложениях или email рассылках, вам нужно будет изучить их и принять во внимание их дизайн, прежде чем делать свои баннеры.

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


5. Используйте призыв к действию



 
Какая самая главная задача баннера? Правильно — на него должны кликнуть. Используйте призыв к действию (Call to Action) в каждом баннере, который вы делаете. Подскажите пользователю, что ему нужно делать дальше.

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


6. Забудьте про Flash

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

Используйте вместо этого HTML5. Если вам нужно сконвертировать какие то свои старые креативы и вдохнуть в них новую жизнь, у Google есть небольшой урок, который поможет это сделать.


7. Используйте кнопки

 

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

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


8. Сфокусируйтесь на шрифтах

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

Согласно правилу большого пальца, обычно двух начертаний шрифтов бывает достаточно.

  1. Делайте большие заголовки. Используйте жирные, немного необычные или цветные шрифты, чтобы привлечь внимание пользователей.
  2. Отдавайте предпочтение шрифтам без засечек (sans serif). Вы можете использовать два размера или два начертания жирного — один для основного текста, а другой для кнопок или призыва к действию. Просто убедитесь, что они легко читаются.


 9. Используйте простую анимацию



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

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

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


10. Сохраняйте правильно


Это важный момент. Никто не разместит вашу рекламу, если файлы слишком много весят или у баннера будет неправильный формат. Оптимизируйте размер по максимуму. Итоговый размер файлов не должен превышать 150 кб, в зависимости от площади рекламного баннера.

После этого убедитесь, что баннер сделан в правильном формате, стандартном для интернет-рекламы. Распространенные форматы баннеров — PNG и JPG для статических баннеров, GIF — для анимированных. SVG формат тоже набирает оборотов и все чаще принимается разными рекламными сетями. Забудьте об SWF (Adobe Flash) — от него сейчас уже практически все отказались, и даже браузеры перестают его поддерживать. Вместо него широкое распространение получили HTML5 баннеры, которые создаются с помощью таких программ, как Google Web Designer, Adobe Animation или рускоязычный онлайн конструктор баннеров Bannerboo.


11. Сфокусируйтесь на текстах

 

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

Вы же не собираетесь впихнуть в баннер 100 слов, правда? Неплохой вариант — поработать с копирайтером, который поможет подобрать правильное послание. Подбирайте такие выражения, которые отвечают на возможные вопросы пользователей, или придумайте интригующий посыл, чтобы привлечь их внимание.


12. Используйте элементы бренда


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

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

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


13. Используйте яркие визуальные элементы



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

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


14. Релевантный контент


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

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


15. Будьте попроще



 
Это прописная истина. Если вы переутомите пользователя обилием текстов, анимаций, цветов, фактов, вы рискуете утратить первоначальный смысл. Будьте попроще.

В случае с баннерами, всего по одному будет достаточно.

  • Одна картинка
  • Одно текстовое сообщение
  • Один призыв к действию
  • Один элемент бренда

Выводы


Так что, баннеры еще пока не умерли. (И не факт, что это когда-нибудь случится). Баннерная реклама может стать эффективным способом достучаться к вашей целевой аудитории а также повысить узнаваемость вашего бренда.

Автор — Сarrie Сousins. (Перевод — Bannerboo.com)

bannerboo.com

Конструктор баннеров онлайн | Конструктор баннеров

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

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

А что если вы не готовы оплачивать услуги студии и агентства, фрилансера? Что если ваш бюджет был затрачен на другие не мало важные задачи для бизнеса? Или возможно вы не нашли ответственных исполнителей, которым вы доверили эту задачу? Не каждый предприниматель, бизнесмен, блоггер – готов потратить свои деньги на работу студии или фрилансера. Возможно, не всегда рационально тратить на дорогостоящие услуги. Команда Баннерович для этого изготовила конструктор баннеров онлайн, что бы каждый пользователь сети Интернет мог изготовить баннер, анимированную открытку, баннер на сайт своими силами и без оплаты дорогих услуг агентства или студии. Изготавливая баннеры у Баннеровича, юзер экономит свои денежные ресурсы и время.

Наша команда Баннерович – предлагает вам услуги для изготовления баннеров, вы изготавливаете баннер в Интернете на веб ресурсе, без загрузки программного обеспечения и своими силами. Конструктор баннеров дает возможность сделать баннер легко, быстро и экономно!

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

Просто возьмите и сделайте баннеры! Хочешь сделать хорошо – сделай сам!

www.bannerovich.ru

Делаем баннер, пошаговая инструкция – мастер-класс для начинающих и профессионалов

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

Не кидайтесь сильно тухлыми помидорами за то, что тема ужа заезжена до дыр.

Но пообещал помочь одной девушке очень подробно разложить по полочкам.
И вот решил, что-бы материал не пропадал даром.
Очень пошаговая инструкция создания баннера для Ярмарки Мастеров.

ШАГ 1

Запускаем Фотошоп. Не важно какой версии. Все что здесь описывается, есть в любой версии.
Для того, что-бы открыть картинку, которую мы будем использовать для фона, нажимаем меню «File»

ШАГ 2
Выбираем пункт меню «Open».

ШАГ 3
Выбираем на своем компьютере заранее записанную картинку, которую мы будем использовать как фон.

ШАГ 4
Создадим шаблон (пустую картинку) для нашего баннера. Выбираем последовательно пункты меню «File->New».

ШАГ 5
Задаем последовательно: Имя файла (нашего баннера) «Name» -> (например «баннер для ярмарки»), ширину картинки «Width» -> 760 pixels, высоту картинки «Height» -> 75 pixels, разрешение картинки «Resolution» -> 72 pixels/inch.

(RUS)

ШАГ 6
У нас открыты 2 картинки. Одна — та которая послужит нашим фоном, вторая — чистый шаблон будущего баннера.

ШАГ 7
Начинаем операцию копирования картинки которая будет фоном в чистый шаблон баннера. Делаем активным файл с фоном (просто кликаем один раз на нем мышкой).

Выбираем последовательно пункты меню «Select -> All».

(RUS)

ШАГ 8
Выполняем операцию «Копировать». Нажимаем последовательно пункты меню «Edit -> Copy».

(RUS)

ШАГ 9
Вставляем скопированную картинку с фоном в шаблон баннера. Выбираем активным файл с пустым шаблоном (просто кликаем мышкой внутри окошка с картинкой баннера) и последовательно выполняем пункты меню «Edit -> Paste».

(RUS)

ШАГ 10
Наш фон теперь поместился в шаблон баннера и мы готовы с ним работать.

ШАГ 11
Например мы просто смасштабируем этот фон и красиво разместим его на баннере. Для этого выберем режим свободной трансформации «Edit -> Free Transform».

(RUS)

ШАГ 12
У нас появилась рамочка вокруг слоя с нашим фоном. Изменяем (уменьшаем и двигаем наш слой с фоном) так, что-бы это было красиво. Если потянуть за крайние уголки этой рамочки, то размер слоя с фоном начнет изменяться (уменьшаться или увеличиваться). Если одновременно с этим нажать и удерживать кнопку «Shift» на клавиатуре, то транcформация слоя с фоном будет пропорциональным, т.е. без искажений по горизонтали и вертикали. Еще можно вращать вокруг центральной точки (отмеченной одной из красных стрелочек). Перед тем, как тянуть за уголки мы должны выбрать инструмент «Move Tool». Как только закончили трансформацию нажмите клавишу «Enter» на клавиатуре.

ШАГ 13
Трансформируем слой с фоном на свое усмотрение.

ШАГ 14
Давайте посмотрим, где же располагается слой с нашим фоном. Выполняем последовательно меню «Window-> Layers». Откроется окошко со слоями. Наш фон сейчас находится вторым снизу. Таких слоев в файле Фотошопа может быть очень много.

ШАГ 15
Напишем название нашего магазина. Для этого выбираем инструмент со сложным названием «Horizontal Type Tool».

ШАГ 16
Кликаем мышкой примерно в том месте где хотим написать название нашего магазина. Возможно придется немного подождать, пока Фотошоп активизирует все ваши установленные шрифты. Как только появится мигающий курсор на баннере в том месте, где мы кликнули и появился новый слой с иконкой в виде буквы «Т», мы готовы набирать название нашего магазина.

ШАГ 17
Пишем название. Меняем цвет и размер шрифта, как в любимом Ворде. Баннер «на скорую руку» готов.

ШАГ 18
Записываем наш баннер «File -> Save As…» в формат *.PSD это для дальнейшей работы с ним (вдруг вы захотите поменять фон или название магазина на баннере). И записываем для загрузки на Ярмарку в формате *.JPG.

Еще раз прошу прощения за избитую тему. Можете даже ругать. 🙂
Надеюсь я помог девушке с такими подробностями.
Если будут какие-то еще уточнения по данному уроку, пишите сразу, пока у меня есть возможность править этот урок.

Извините.

www.livemaster.ru

Как создать баннер в «Фотошопе»: пошаговая инструкция, советы начинающим

Каждый из нас ежедневно сталкивается с рекламой, смотря телевизор, сидя в Интернете, находясь на улице, в торговом центре и еще много где. В этой статье мы расскажем про один из самых популярных видов рекламы – баннеры. Вы узнаете, что такое баннеры, какие виды их бывают и как создать рекламный баннер в «Фотошопе».

Что такое баннерная реклама

Баннерная реклама – графическое изображение рекламного характера. Рекламные щиты на улицах, растяжки над магазинами, картинки на сайтах в Интернете, при клике на которые переходишь на другой сайт – все это баннеры. Уличные баннеры появились давно, когда еще не было даже радио. А вот в Интернет они просочились в 1994 году и быстро начали набирать популярность. На сегодняшний день ни один бизнес не обходится без рекламы, и в частности рекламы в Интернете, а баннеры — это один из весьма эффективных инструментов в деле продвижения товаров и услуг.

Какие виды баннеров бывают

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

Виды интернет-баннеров по способам реализации

Перед тем как узнать, как создать баннер в «Фотошопе», мы познакомимся с разновидностями способов их реализации.

  • Статичные. Простейший баннер – картинка с рекламным содержимым. Размер файла небольшой, поэтому быстро загружается даже при медленном Интернете. Легко создать баннер как в «Фотошопе», так и в других графических редакторах.
  • Анимированные. Весят они в несколько раз больше статичных, в связи с этим загружаются медленнее, но зато больше бросаются в глаза пользователю. Такой рекламный баннер создать в «Фотошопе» уже гораздо сложнее.
  • Ричтекст (Rich text). Баннер, похожий на информационную статью с графической составляющей.
  • HTML5, JS, флеш-анимация. Это уже баннеры, которые являются интерактивными мини-программами. Например: различные тесты, примитивные игры, опросники. Создать такой рекламный баннер в «Фотошопе», как вы понимаете, никак не получится.

Определение размеров баннера

Прежде чем узнать, как создать макет баннера в «Фотошопе», необходимо определиться с его размерами. Стандартом считается размер 100 х 100 пикселей. Самый часто используемый вариант – 468 х 60 и 234 х 60. Первая цифра определяет ширину, а вторая длину. Так что вертикальный баннер будет иметь размер, например, 60 х 468 пикселей. Поэтому важно знать, где вы будете размещать свой баннер.

С чего начать

Вот мы узнали, что можно баннер создать в «Фотошопе» как больших размеров, так и миниатюрных. Но спешить не стоит и прежде, чем открыть программу, чтобы создать баннер, как и в любом творческом деле, надо прикинуть дизайн и содержимое. Мы советуем это сделать при помощи бумаги и карандашей. Сначала чертим прямоугольник, учитывая пропорции будущего баннера. Придумываем необходимый рекламный текст. Затем определяем, каким будет фон. Необходимости в рисовании всего этого нет, достаточно просто задуманное написать словами. Далее уже можно прикидывать, какие картинки можно вставить и где их стильно разместить, в том числе и возможный фирменный логотип. Скорее всего, получившееся на бумаге будет выглядеть как схематический план. Финальная стадия подготовки: ищем в Интернете картинки, подходящие под вашу идею. Важно помнить об авторских правах, поэтому подбираем картинки на бесплатных ресурсах.

Делаем свой рекламный баннер

Итак, ваш макет готов. Теперь приступим непосредственно к основному процессу.

В этой статье мы сделаем статичный горизонтальный рекламный баннер размером 468 × 60 пикселей и текстом «Распродажа iPhone 5. Не упусти шанс» в программе «Фотошоп» версии CS6.

  1. Запускаем программу. Создаем новый документ с размерами 468 × 60 пикселей.
  2. Фон мы сделаем синим, плавно переходящим в белый. Для этого выбираем цвет в нижнем белом углу, затем выбираем инструмент «Градиентная заливка». Чтобы применить заливку, нажмите курсор на одной стороне холста и, не отпуская, проведите на другой конец. Пробуйте различные варианты, пока не найдете устраивающий вас.
  3. Следующим пунктом мы вставим картинку, которую нашли в поисковике. Открываем ее в «Фотошопе». Для начала мы подгоним размер картинки под баннер – выбираем в меню вкладку «Изображение» и нажимаем «Размер изображения». Устанавливаем высоту 60 пикселей, ширина пропорционально уменьшится. Теперь надо отделить изображение смартфона от фона. Выбираем инструмент «Полигональное лассо» и выделяем необходимое пространство. После этого перемещаем выделенный участок при помощи команды «копировать-вставить».
  4. Вставляем текст, используя инструмент «Текст». Подгоняем размеры, подбираем шрифт и цвет. Можно воспользоваться готовыми шаблонами в окошке со стилями. Обратите внимание на вкладку «Слои». Там каждый элемент баннера – отдельный слой. Их можно копировать, удалять, менять различные свойства по отдельности. Мы дублировали слой с картинкой и переместили второе изображение в противоположную сторону холста. Остается только сохранить файл. При сохранении выбрать формат JPG, GIF или PNG.

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

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

fb.ru

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Авторское право © 2024 Es picture - Картинки
top