Банер для розсилки: ідеї та приклади дизайну
Шукаєте посібник про банери в листах? Тоді ви за адресою!
Банери в розсилках чудово привертають увагу аудиторії. Вони помітно впливають на те, наскільки легко читаються і наскільки привабливо виглядають ваші кампанії. Сьогодні ми розберемо, що таке банери для розсилок, навіщо вони потрібні і як їх робити, дамо практичні поради для створення власних банерів і покажемо, як із цим допоможе Blocks.
Що таке банер для розсилки?
Банер для розсилки — це зазвичай перший візуальний елемент, який читачі бачать, відкривши лист. Це графічний блок, що задає тон усій розсилці, — приблизно як заголовок у газеті.
Зазвичай на банері в листі є логотип компанії, назва розсилки (або яскраве повідомлення, яке зачепить вашу аудиторію) і візуал, так чи інакше пов’язаний із брендом. Головне — щоб банер інтригував, був доречним і відповідав айдентиці бренду.
Розмір банера для розсилки
У дизайні банера для листа дуже важливо вгадати з розміром: банер має добре виглядати на всіх пристроях і не займати забагато місця. Ось 2 найпоширеніші розміри банерів для розсилок:
• Банер на всю ширину. Такий банер зазвичай тягнеться на всю ширину листа (найчастіше це 600px — стандартна ширина листа). Цей розмір підтримує більшість поштових клієнтів, від Gmail до Outlook, тож банер відображатиметься правильно.
А от висота банера може бути різною — зазвичай від 200px до 500px. Так він лишається помітним, але доволі компактним. Остаточний вибір залежить від дизайну шаблону: просто подбайте, щоб банер візуально гармоніював із загальною версткою.
Джерело: Really Good Emails
• Банер на половину ширини. Такий банер зазвичай має ширину близько 300px. Це чудовий варіант, якщо банер має ділити простір з іншими важливими елементами — текстом чи зображеннями.
Щодо висоти, банери на половину ширини підпорядковуються тим самим принципам, що й банери на всю ширину. Важливо зберегти візуальний баланс: банер не повинен тиснути, але має бути достатньо великим, щоб привертати увагу.
Джерело: Really Good Emails
Мобільні пристрої додають власних нюансів. Екрани тут зазвичай менші, тож важливо, щоб банер добре підлаштовувався і лист зручно читався з телефона. Ретельно тестуйте банери й перевіряйте, чи правильно вони масштабуються на різних пристроях.
4 речі, які варто додати на банер у листі
Добре продуманий банер — це більше, ніж просто гарна картинка. Це вивірене поєднання кількох елементів, які разом ловлять погляд читача й доносять головне повідомлення.
Розгляньмо 4 ключові складові, про які варто подумати, створюючи банери для листів.
Логотип бренду або компанії
Логотип миттєво видає ваш бренд. Розмістіть його на банері на видному місці, щоб потенційні й наявні клієнти краще впізнавали бренд. Узгодьте його з візуальними настановами — кольоровою гамою й типографікою, — щоб усе було послідовним і в стилі бренду від початку до кінця.
Джерело: Really Good Emails
Чіпкий заголовок
Сильний заголовок — це гачок, на який ловиться аудиторія. Він має бути коротким, цікавим і прямо пов’язаним зі змістом розсилки. Добрий заголовок розпалює цікавість, викликає емоції або обіцяє користь і спонукає читати далі.
Джерело: Really Good Emails
Доречні зображення
Візуальна привабливість банера — невіддільна частина кампанії. Використовуйте якісні зображення, що відповідають змісту розсилки, і завжди пам’ятайте: візуал має органічно поєднуватися з іншими елементами дизайну.
Джерело: Really Good Emails
Заклик до дії (CTA)
Хай то «Купити зараз», «Дізнатися більше» чи «Зареєструватися» — CTA на банері підказує аудиторії наступний крок. Зробіть його помітним: контрастні кольори, достатньо вільного простору й шрифт, який легко читати. Подбайте, щоб CTA відповідав меті розсилки й підштовхував читачів до потрібної дії.
Джерело: Really Good Emails
10 ідей дизайну банера для розсилки, щоб надихнутися
А тепер час робити першокласні банери для ваших шаблонів!
Хоч анонсуєте запуск нового продукту, хоч рекламуєте розпродаж чи ділитеся іншими важливими новинами — ці 10 ідей дизайну банерів стануть дієвим способом посилити вашу email-маркетингову стратегію.
Грайте з кольорами
Кольори на банері — не просто для краси: вони викликають емоції й виокремлюють ваш лист. Використовуйте кольори бренду заради послідовності або експериментуйте з різними дизайнами й палітрами, щоб додати шаблонам творчої іскри. Наприклад, яскраві кольори на банері передають збудження, а приглушені тони — вишуканість.
У цьому прикладі від Resy червоний колір банера збігається з логотипом, а чорний і жовтий роблять банер помітним. Таке поєднання додає сміливості й чіпляє погляд із першої секунди.
Джерело: Really Good Emails
Розумно працюйте з типографікою
Типографіка суттєво впливає на читабельність і настрій банера. Поєднуйте різні стилі й розміри шрифтів, щоб вибудувати візуальну ієрархію й повести за собою читача. Але стежте, щоб шрифти легко читалися й доповнювали один одного.
Приклад нижче показує, як використати нестандартні шрифти, не ускладнюючи читання банера. У результаті маємо лист, що і працює, і тішить око.
Джерело: Really Good Emails
Виділяйте пропозиції на банерах
Ваш бренд пропонує спецумови чи знижки? Виділіть їх на банері, щоб підштовхнути продажі! Використовуйте елементи, що привертають увагу й розпалюють інтерес. Наприклад, на банері можуть бути:
- жирні літери
- контрастні кольори
- жваві формулювання
- добре помітні цифри
Команда Glossier дає тут один із найкращих прикладів. Спецпропозиція займає центральне місце, а банер чудово працює і на десктопі, і на мобільному.
Джерело: Really Good Emails
Оживіть банер анімацією
Анімовані GIF — елемент, що ловить погляд і додає банеру руху. Хай то ледь помітний перехід чи повноцінний анімований мультик, він зробить банер цікавішим і запам’ятовуванішим. Тільки стежте, щоб анімація не відволікала від головного повідомлення.
Ось класний приклад від Lyft. GIF на банері не лише робить повідомлення веселим і яскравим, а й показує сам продукт.
Джерело: Really Good Emails
Розкажіть історію
Хто не любить гарних історій? Розповідь на банері підкреслює повідомлення й зачіпає одержувачів на емоційному рівні. Спробуйте зробити для банера послідовність зображень чи текстових елементів, які розгортають захопливу історію про:
- ваш бренд
- лінійку продуктів чи послугу, показані в листі
- особливу подію, з якою пов’язана кампанія
Цей приклад від Sauna House показує всю гаму відчуттів, які чекають на вас у сауні. Чудовий візуал гарантує, що потенційні клієнти легко асоціюватимуть себе з людьми на фото.
Джерело: Really Good Emails
Покажіть відгуки
Ніколи не недооцінюйте силу соціального доказу! Позитивні відгуки клієнтів на банері підсилюють довіру до бренду та його репутацію.
Додайте короткий переконливий відгук з іменем і фото клієнта для достовірності — і створіть атмосферу довіри навіть серед найскептичніших одержувачів! Звісно, не забудьте спитати в клієнта дозволу, перш ніж використовувати його фото й відгук.
Ось чудовий приклад від GoodRx: лист короткий, але бездоганно виконує свою функцію. У ньому є відгук справжнього клієнта разом із фото, і це робить лист дуже переконливим.
Джерело: Really Good Emails
Додайте таймер зворотного відліку
Хочете просувати пропозиції з обмеженим терміном дії? Додайте таймер зворотного відліку просто на банер! Цей невеликий, але дієвий елемент грає на страху щось пропустити, створює відчуття терміновості і спонукає читачів діяти швидко, поки пропозиція ще чинна.
У цьому прикладі від AppSumo таймер поєднано з чіпким і зрозумілим закликом до дії, що підганяє читачів відгукнутися негайно.
Джерело: Really Good Emails
Покажіть товари
Якщо ви запускаєте нові продукти чи послуги, покажіть їх на банері. Поєднайте якісний візуал із сильним заголовком і CTA, щоб:
- показати товари чи послугу в найкращому світлі
- розпалити цікавість клієнтів
- у підсумку підняти конверсію
Ось приклад банера від Loftie, який просуває годинник і лампу як ідеальний дует для будь-якої приліжкової тумбочки (і показує, як обидва товари виглядають разом).
Джерело: Really Good Emails
Сезонні теми
Сезонні кампанії — чудовий спосіб збільшити продажі й залученість клієнтів. Підлаштуйте банер під пору року, свята чи популярні події, щоб розсилки були вчасними й доречними.
А найкраще те, що сезонні кампанії годяться для найрізноманітніших видів бізнесу! Наприклад, ось лист від Moment (маркетплейсу для фотографів і кінематографістів), який анонсує літній розпродаж і має відповідне літнє зображення.
Джерело: Really Good Emails
Використовуйте інфографіку
Остання ідея для банерів — інфографіка, яка спрощує складну інформацію й робить її зрозумілішою. Додайте на банер міні-інфографіку, щоб поділитися важливою статистикою чи новинами про ваш бренд або галузь. Особливо це може стати в пригоді в B2B-розсилках.
Ось один із найкращих прикладів того, як скористатися цією порадою. У листі нижче Glassdoor додає цифри, щоб підсилити своє повідомлення.
Джерело: Really Good Emails
8 кроків, щоб створити приголомшливий банер для розсилки в Blocks
Від шапки листа до банера (і навіть підпису) — Blocks дає всі можливості, щоб ваші шаблони були справді видатними. З нашим конструктором із перетягуванням створювати ідеальні листи — простіше простого!
Готові створити чудові банери? Просто виконайте ці 8 кроків:
- Спершу додайте в лист зображення. Перейдіть до розділу «Елементи», натисніть кнопку «Зображення» й перетягніть її в шаблон.
- Наведіть курсор на центр елемента зображення: з’явиться набір іконок. Натисніть позначену іконку, щоб відкрити Центр зображень.
- Тут можна завантажити власні фото, знайти візуал у нашій бібліотеці стокових зображень із сотнями безкоштовних варіантів або згенерувати зображення для листа за допомогою ШІ.
- Уявімо, що ви створюєте лист про реферальну програму. Готового фото у вас немає, тож треба знайти доречну картинку, яка підтримає вашу ідею.
Для цього виберіть розділ «Стокові зображення», введіть пошуковий запит і оберіть щось із результатів. Різні фільтри допоможуть знайти фото з певною орієнтацією чи кольоровою гамою.
- Знайшли ідеальне фото? Чудово! Тепер просто натисніть на нього, щоб додати в шаблон. Ось і все!
Якщо зображення треба відредагувати, натисніть позначену тут іконку, щоб відкрити редактор зображень.
- Далі можна налаштувати візуал як завгодно: додати текст, змінити розмір і обрізати зображення, заокруглити кути й ще багато всього!
- Тут ми вирішили додати на банер CTA, щоб зробити його привабливішим. У розділі «Текст» можна вибрати потрібний шрифт, змінити колір тексту та його фон, додати тіні й зробити ще багато іншого.
- Нарешті, коли банер вам сподобається, натисніть кнопку «Оновити» — і вуаля: ваш шаблон готовий сяяти!
P.S. Результат не влаштував після того, як ви додали банер у шаблон? Сміливо повертайтеся до Центру зображень і вносьте зміни!
P.P.S. А якщо хочеться особливого шику, можна навіть додати тінь усьому банеру й змінити кути фото через меню праворуч.
Висновок
Банери — важливий елемент вашої email-маркетингової стратегії. Вони роблять розсилку привабливішою й підвищують залученість читачів. Не забувайте: дієвий банер має бути візуально привабливим і відповідати вашому бренду та меті листа.
Завдяки Blocks ви можете по-справжньому розгулятися з креативними й помітними банерами. Наш інструмент — ідеальне місце, щоб експериментувати з розмірами банерів, додавати потрібні елементи й створювати майстерні шаблони, які надовго запам’ятаються вашим читачам.