Эта статья была создана в сотрудничестве с StudioWorks . Спасибо за поддержку партнеров, которые делают возможным использование SitePoint.
Баннерная реклама была вокруг с рассвета Интернета. И плохо разработанные рекламные баннеры, которые раздражают многих пользователей, были вокруг очень долго. Но 30 лет спустя компании все еще платят за размещение их на веб-сайтах и в ротации рекламы, поэтому они должны работать, когда все сделано правильно. Правильно?
Баннерная реклама, особенно анимированная, используется как никогда широко в профилях социальных сетей, а также в социальных сетях, поскольку маркетологи осознают, что видео привлекает внимание. Современные рекламные баннеры сложны и хорошо продуманы и могут быть очень эффективными. Но для дизайнеров они представляют огромную проблему.
Кодирование баннерной рекламы сложно и дорого
Баннерную рекламу, особенно анимированную, общеизвестно сложно кодировать в HTML5. Конечно, вы можете создавать анимированные баннеры во Flash, но iOS от Apple не поддерживает их, и Adobe заявляет, что они полностью закрывают Flash в 2020 году.
GIF-файлы — это еще одно возможное решение, но они обычно имеют низкое разрешение, и большинство веб-пользователей ассоциируют GIF-файлы с мемами и юмором, а не с серьезными продуктами. Итак, вы остались с HTML5.
Кодирование HTML5-рекламы — в частности, анимационных — требует опыта, а экспертиза стоит дорого. Хорошие программисты знают свою ценность, и найти того, кому можно доверять, может быть невыполнимой задачей. Внешние платформы могут показаться очевидным местом для старта, но кодеры, которые стоят их усилий, вскоре отойдут от сторонних сайтов.
К счастью, сейчас эра SaaS, и дизайнеры теперь могут использовать такие приложения, как Bannersnack, с интерфейсами перетаскивания, которые позволяют быстро и эффективно создавать рекламные баннеры.
Что делает Bannersnack?
Bannersnack — это онлайн-приложение, которое помогает вам создавать полностью адаптивные рекламные баннеры для веб-сайтов и социальных сетей без каких-либо навыков кодирования или дизайна. Создатели Bannersnack разобрались со всеми сложными задачами кодирования, поэтому вы просто должны войти в систему, выбрать свой размер, добавить свое изображение, выбрать цвета и шрифты и проявить творческий подход.
Источник изображения: Bannersnack Давайте быстро пробежимся по платформе Bannersnack и посмотрим, что она может сделать.
1. Выберите свой размер
Начните с нестандартного размера и ориентации (вертикальный, горизонтальный и квадратный) или выберите заданный размер. Вы даже можете выбрать рекламу на Facebook или в Instagram:
Источник изображения: Bannersnack 2. Создай свою рекламу
Вы можете либо разработать с нуля, либо использовать существующий шаблон Bannersnack. Bannersnack предлагает статичные или анимированные дизайны в своей галерее шаблонов, так что вы можете начать работу даже без идеи дизайна.
Источник изображения: Bannersnack 3. Добавить изображения и текст
Настройте свой дизайн всего за несколько кликов. Если вы можете использовать Mailchimp или другие инструменты маркетинга SaaS, вы можете использовать Bannersnack. Редактируйте заголовки, текст, кнопки, фон, добавляйте свои собственные логотипы и изображения и изменяйте нюансы дизайна, такие как высота линий и прозрачность. Вы можете создавать красиво оформленные рекламные баннеры, которые идеально соответствуют вашим существующим стандартам и цветам бренда.
Источник изображения: Bannersnack 4. Анимировать с легкостью
Ни для кого не секрет, что анимированные объявления более привлекательны и стимулируют действия лучше, чем статичные. Читатели с большей вероятностью будут реагировать на видео, чем неанимированный контент, и с большей вероятностью посещают страницу или веб-сайт издателя.
Источник изображения: Impactbnd.com Но анимация, как известно, хитрая. Bannersnack удалось преодолеть это препятствие — с помощью HTML5-анимации, включающей в себя постепенное увеличение, скольжение и отскоки. Это не полные видеообъявления, но они по-прежнему притягивают взгляды пользователей на занятой веб-странице и повышают вашу заинтересованность. У них есть дополнительное преимущество быстрой загрузки, что крайне важно для того, чтобы пользователи мобильных устройств не могли прокрутить ваше объявление еще до его загрузки.
HTML5 редактор Bannersnack имеет интуитивно понятный и удобный интерфейс и систему управления слайдами, чтобы сделать анимацию простой. Попробуйте один из 32 готовых пресетов анимации, чтобы оживить любую часть вашего объявления:
Или создавайте собственные анимации и настраивайте такие параметры, как длительность, задержка и переходы.
5. Создайте полный набор баннеров различных размеров и форм.
После того, как вы завершили макет, попробуйте опцию Smart Resize от Bannersnack. Вы можете создать набор из 30+ рекламных баннеров, основанных на одном дизайне, всего за несколько минут, чтобы вы могли использовать одни и те же объявления на веб-сайте вашего клиента, в рекламных кампаниях и на социальных сетях. (Проверьте это видео на YouTube .)
Источник изображения: Bannersnack Вы можете настроить макет отдельных баннеров, если хотите, изменив временные графики перехода или переставив определенные слои, но это обычно не требуется благодаря интуитивно понятным функциям изменения размера Bannersnack.
Клип YouTube, который изображен выше, проведет вас через процесс создания набора квадратных, горизонтальных и вертикальных баннеров из одного базового дизайна.
6. Сотрудничайте с легкостью
Ничто не тратит впустую время, как отправка дизайнерских доказательств для комментариев и разметки. Вместо загрузки файлов и отправки писем по электронной почте для получения одобрений, используйте онлайн-интерфейс совместной работы Bannersnack. Ваша команда может просматривать объявления, оставлять комментарии и предложения и даже помечать объявления как одобренные — все в системе.
И вы можете держать все свои проекты организованными, устанавливая свои собственные папки и рабочие пространства.
7. Экспортируйте и отправляйтесь
Когда все будут довольны рекламой, просто выберите нужный формат и экспортируйте его. Ваш баннер готов для вставки. Вы можете выбрать JPG, PNG, GIF или HTML5 — совместимый со всеми основными платформами медийной рекламы, включая Google Ads, ReTargeter и другие.
Для HTML-рекламы вы можете загрузить HTML5 или AMP HTML (предпочтительный формат Google для безопасности и быстрой загрузки).
Совет профессионала : Bannersnack может даже помочь вам создать видеообъявления в Facebook , которые, как было показано, привлекают больше посетителей и увеличивают конверсии по сравнению со статическими объявлениями.
Когда вы подписываетесь на подписку Pro или Plus Bannersnack, вы можете загрузить свои объявления в формате MP4, как того требует Facebook.
Что это будет стоить мне?
Вы можете протестировать Bannersnack бесплатно, но чтобы получить максимальную отдачу от этого инструмента — включая наборы баннеров, загрузки AMP HTML и MP4 — вам понадобится подписка Pro или Plus. Хотя это может показаться страшным, цены на удивление доступные. И если учесть, сколько времени вы сэкономите на найме кодера или выполнении работы самостоятельно, вы увидите, что это окупается в самом первом проекте, который вы создаете.
Профессиональные советы по разработке баннерной рекламы
Теперь, когда у вас есть хороший инструмент для создания баннерной рекламы, давайте подготовим несколько профессиональных советов, которые помогут максимально эффективно использовать ваши рекламные инвестиции.
1. Ретаргетинг
Баннерная реклама часто получает плохую репутацию, получая низкий процент ответов. Это правда, но то же самое можно сказать о любом средстве, от телевизионной рекламы до рекламных щитов. Это зависит от того, насколько хорошо креатив, и насколько хорошо таргетировано объявление … и перенастроено.
Ретаргетинг баннерной рекламы дает вам второй шанс повлиять на решения о покупке. Зритель видит вашу маркетинговую графику во второй или третий раз. Другим фактором является то, что пользователи сети снова видят ваши объявления, потому что они заинтересованы в ваших услугах.
Показатель кликов для ретаргетинга объявлений в десять раз выше, чем для впервые показанных объявлений.
Цифровой информационный мир имеет несколько отличных идей, которые помогут вам перенастроить как профессионал.
2. Преодолеть рекламную слепоту
Читатели хорошо умеют игнорировать медийную рекламу. У Джеффа Булласа есть несколько полезных советов, которые помогут вам преодолеть слепоту рекламы:
- разместите свои объявления в необычных местах
- держать ваши объявления релевантными для вашей аудитории
- использовать уникальные цвета, форматы и размеры
- использовать меньше рекламы для оптимизации для мобильных пользователей
- сделать вашу рекламу частью вашего дизайна
Следуя этой логике, вы получите лучшее взаимодействие со своими объявлениями, если:
- вы избирательно относитесь к тем, кого показываете
- вы используете нестандартные размеры и цвета, которые контрастируют с вашими основными цветами сайта (не конфликтуя с ними)
- разместите свои баннеры там, где пользователи вынуждены их видеть, например, в середине поста в блоге
3. Тест, тест, тест
Сплит-тестирование, многовариантное или A / B-тестирование: как бы вы это ни называли, тестирование ваших объявлений — это ключ к повышению их эффективности.
ConversionXL говорит, что вам нужно много трафика (более 100 000 уникальных посетителей в месяц), прежде чем многомерное тестирование будет иметь смысл. Большинство компаний должны вместо этого проводить простое A / B-тестирование, при котором вы тестируете два варианта рекламы, отправляя половину посетителей на одно объявление и половину на второе.
Разработка рекламных баннеров и возможность их быстрого изменения являются ключами к разделенному тестированию; Использование такого сервиса, как Bannersnack, может сделать его экономически эффективным для вас.
Вы можете изменить что-либо в своем сплит-тестировании. Начните с больших переменных: тип перехода, статический или анимированный, шрифт, цвет, цвет CTA и изображение. Как только ваши результаты А / Б схожи, и вы думаете, что нашли лучшее объявление с точки зрения основных переменных, пришло время протестировать менее очевидные переменные — такие как время перехода, размещение изображения, размер шрифта и небольшие цветовые вариации.
Кроме того, обязательно проверьте, являются ли ваши результаты А / Б случайными или статистически значимыми с помощью этого инструмента тестирования .
Источник изображения: VWO Если вы довольны тем, что одно из ваших объявлений превосходит другое, откажитесь от менее эффективного объявления. Даже небольшие улучшения в вашем рейтинге кликов с непрерывным тестированием.
4. Будьте бдительны в отношении аналитики
Ваша рекламная онлайн-платформа, вероятно, включает аналитику. Платформы автоматизации баннерной рекламы, безусловно, включают их, наряду с возможностью видеть интерактивные тепловые карты и знать, какая реклама работает лучше всего для вас.
Проверьте интерфейс аналитики, предлагаемый вашим разработчиком или рекламной платформой, и найдите шаблоны поведения пользователей, которые помогут повлиять на ваш следующий дизайн и копирование рекламы.
Баннеры могут быть мощными … Если вы делаете их правильно
Чтобы действительно использовать ваши рекламные баннеры, вам нужно выделиться — в хорошем смысле. Создавайте с учетом ваших клиентов, занимаясь чем-то интересным или просветляющим, вместо того, чтобы поразить клиентов чрезмерной рекламой.
Приложения для создания баннеров, такие как Bannersnack, позволяют быстро создавать баннеры и легко вносить изменения, чтобы вы могли использовать измененное объявление вместо исходного, чтобы повысить рентабельность инвестиций и по-настоящему привлечь своих клиентов.
Попробуйте сами. Посмотрите на результаты, которые вы получили с баннерной рекламы, которую вы разработали с нуля, и сравните их с результатами, которые вы можете получить с профессиональным создателем баннерной рекламы. Посмотрите, видите ли вы или клиенты какую-либо разницу — потому что, несомненно, их клиенты увидят.