Демо-редактор Увійти →
Дизайн Маркетинг
~ 13 хв читати
37688 перегляди
оцінити
13 вересня

15 найкращих практик email-дизайну

Stripo / Blog / 15 найкращих практик email-дизайну

Бажаєте створити професійну конкурентоспроможну розсилку, та не знаєте, з чого почати? Топові практики email-дизайну для 2021 року, наведені нижче, допоможуть. 

Шаблони Stripo створені професійними дизайнерами із застосуванням усіх найкращих практик
Ознайомитися

1. Напишіть переконливу тему

Тема — це найперший елемент листа, який бачить одержувач. За даними досліджень, більше ніж 47% отримувачів вирішують, чи варто відкривати вхідного листа, виходячи з його теми. Тому переконайтеся, що вона достатньо приваблива.

Рекомендації по дизайну пошти_Робота з рядками теми

(Десктопний пристрій)

Звертаємо вашу увагу, що поштові клієнти показують до 65 символів теми на десктопних пристроях і до 30-35 символів на мобільних. Тому слушним рішенням буде зробити тему якомога коротшою.

Рекомендації по дизайну пошти_Subject Lines на мобільних пристроях

(Мобільний пристрій)

2. Прехедер має зачіпати

Прехедер доволі часто називають продовженням теми. Він знаходиться поруч із нею на десктопі та під нею у мобільній версії.

Рекомендації по дизайну пошти_Preheader

Зверніть увагу:

  • у вас є лише 100 символів на мобільних пристроях і 30 на десктопі, щоб переконати читача відкрити вашого листа;

  • обов'язково заповнюйте прехедер. Якщо ви нічого не напишете, клієнт побачить фрагмент тексту, який знаходиться на початку вашого листа (зазвичай це пропозиція відкрити веб-версію повідомлення). Виглядає це, чесно кажучи, не дуже;

  • використовуйте прехедер для підсилення свого меседжу. Знижки, акції, конкурси... — усе, що збільшує шанси листа на відкривання, буде доречним у прехедері;

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

Прогалини в попередніх заголовках_Рекомендації по дизайну пошти

Ви можете заповнити прехедер пробілами після короткого тексту, як це зробили Gap Flash Sale.

Рекомендації по дизайну пошти_Налаштування рядка теми в Stripo

Або залишити його зовсім порожнім, як у листі від Banana Republic.

Додавання прогалин в попередні заголовки_Stripo_Найкращі практики дизайну пошти

Додавайте теми та прехедери листів у Stripo
Приєднатися

3. Дотримуйтеся корпоративного стилю

Це виключно важлива умова. Робіть це потрібно скрізь: на сайті, в email-розсилках, соцмережах та ін. Бренд має використовувати однакові фірмові шрифти, тон спілкування і кольорову схему.

Коли клієнти відкривають вашого листа, вони мають візуально впізнавати стиль та кольори, які бачили на вашому сайті. І тому вам треба послідовно дотримуватися ідентичності бренду від однієї email-кампанії до іншої, зокрема у тригерних листах.

У Stripo ви можете створити файл «Brand Guidelines». Він містить набір стилів дизайну та брендової айдентики (лого, контактна інформація тощо), узятих із будь-якого листа вашої компанії на ваш вибір.

Створіть «Brand Guidelines» для свого бренду
Розпочати

4. Створіть власний хедер

Про хедери листів уже написано сотні тисяч слів.

Тому обмежимося кількома найважливішими рекомендаціями за темою:

  • назва та логотип вашої компанії — дві невід'ємні частини хедера. Вже просто факт присутності цих двох елементів покращує впізнаваність вашого бренду серед тисяч інших листів;

  • наявність меню навігації в хедері допомагає одержувачеві оперативно перейти на сайт, не читаючи весь масив інформації;

Заголовок-Ручна робота-Заголовок-Stripo

(Джерело: шаблон Stripo)

  • прикріплюйте до логотипу компанії відповідні посилання.

5. Додавайте до листів анотації для вкладок промо у Gmail

Всесвітньо відома корпорація Google кілька років тому розробила анотації для листів. Але використовувати їх чомусь прагнуть далеко не всі. І це дивно, адже за допомогою цієї фішки можна додавати до листів зображення, описи цінних пропозицій, терміни дії знижок... — і в такий спосіб підвищити показники відкривання розсилок.

Анотації надають клієнтові можливість побачити ваш продукт або послугу, не відкриваючи листа.

Промо-Вкладка-Gmail_Анотація

(Джерело: розсилка від Rozetka)

У Stripo ви можете використовувати цей інструмент, а також багато інших — усе зручно зібрано в одному місці. Бажаєте спробувати?

Виділяйтеся у вхідних ваших користувачів за допомогою анотацій для листів
Розпочати

6. Використовуйте читабельні шрифти

Що стосується дизайну електронних листів, тут треба відзначити важливу обставину: шрифти, що погано читаються, можуть негативно вплинути на сприйняття тексту листа і відповідно на CTR навіть попри правильну подачу інформації. Тому:

  • уникайте курсиву, оскільки він суперечить правилам доступності листів;

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

  • переконайтеся, що вибраний шрифт добре читається.

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

7. Створюйте смислові банери

Говорячи про найкращі практики адаптивного email-дизайну, варто виділити кілька найважливіших моментів стосовно банерів.

Банер завжди знаходиться на першому екрані вашого листа і містить у собі центральний меседж усієї кампанії.

Перевірте, чи достатньо змістовний ваш банер і чи зроблено в ньому акцент на основній меті розсилки. Обов'язково прикріплюйте до банерів посилання, які ведуть клієнта безпосередньо на потрібну сторінку вашого сайту.

Існує 9 основних типів банерів. Усі вони описані нами в блоговій статті «Типи банерів: як створити банер у Stripo Email Builder за лічені хвилини». У ній ви також знайдете мануали зі створення банерів.

8. Додавайте відповідні GIF-анімації

Навіщо використовувати гіфки в електронних листах? Для того, щоб:

  • заволодіти увагою читача;

  • розмістити кілька банерів на одному скролі екрану;

  • привернути увагу користувача до конкретного елементу листа;

  • продемонструвати широкий асортимент вашої продукції або різні кольорові варіанти певного товару.

(Джерело: розсилка від Victoria’s Secret)

Але будьте обережні з гіфками.

Правила, яких необхідно дотримуватися, додаючи до листів GIF-анімації:

  • додавайте лише один GIF-файл на один скрол екрану, аби уникнути нападів фотосенситивної епілепсії в читачів;

  • з цієї ж причини не використовуйте анімації з частотою понад 2 кадри на секунду;

  • додавайте до GIF-файлів альтернативні тексти з коротким описом того, що на них зображено. У такий спосіб ви надаєте клієнтам інформацію на випадок, якщо GIF-файли не завантажаться;

  • використовуйте для першого кадру найбільш інформативне зображення, оскільки деякі поштові клієнти відображають не всю GIF-анімацію, а показують тільки перший кадр.

9. Робіть кнопки заклику до дії помітними

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

Рекомендації по дизайну пошти_Заклик до дії

(Джерело: розсилка від Brighton)

Переконайтеся, що ваші кнопки достатньо помітні, мають яскравий дизайн у корпоративній кольоровій схемі та коректні посилання.

На екранах смартфонів кнопки мають бути достатньо великими, щоб користувачам було зручно їх натискати.

На жаль, деякі кнопки в Outlook втрачають свої стилі оформлення. Але ми знаємо, як вирішити цю проблему!

Просто активуйте опцію «Підтримка Outlook» — і ваша кнопка відображатиметься саме так, як ви бажаєте. Причому в усіх версіях Outlook.

Підтримка-для-Outlook_Control

Створюйте Outlook-сумісні кнопки одним кліком, використовуючи Stripo
Приєднатися

10. Дотримуйтеся адаптивного email-дизайну для мобільних

Не є таємницею, що половина користувачів переглядає вхідну пошту на смартфонах. А це означає, що нам слід адаптувати наші листи для мобільних пристроїв.

Листи мають бути адаптивними і без горизонтального скролу — сьогодні це елементарна істина, яка навіть не обговорюється.

Тобто оптимізація email-дизайну для мобільних девайсів передбачає абсолютно новий рівень адаптивності, зокрема:

  • кнопки із закликом до дії, розтягнуті на повну ширину екрану, щоб користувач не пропустив кнопку;

  • відключення певних елементів листів на смартфонах. Ви можете навіть приховати деякі зображення в мобільному режимі;

Пошта-Тема-Рекомендації_Відключення-певних-вкладок-меню-на-мобільних-пристроях

  • інверсію елементів за потреби;

  • шрифти більшого розміру, зокрема для кнопок та заголовків, щоб зробити текст ідеально читабельним.

Рекомендації по дизайну пошти_Мобільний дизайн

(Футер листа, розмір шрифту 12 пікселів, десктоп)

Рекомендації по дизайну пошти_Мобільний дизайн_Шрифти

(Футер листа, розмір шрифту 16 пікселів, мобільний девайс)

Додаткову інформацію про налаштування стилів дизайну для мобільної версії листа ви знайдете у нашому блозі, стаття «Як зробити лист адаптивним».

11. Будьте лаконічними

До речі, про верстку... Мало хто полюбляє лонгріди. Тому будьте лаконічними. Однак це не означає, що лист неодмінно має бути коротким. Просто одразу переходьте до суті без довгих вступів.

12. Рішуче використовуйте інтерактивність та AMP

Просто кілька фактів та цифр:

  • інтерактивні розсилки, в яких клієнти мали можливість оцінити компанію безпосередньо в листі, приносили у 8,33 рази більше оцінок, ніж звичайні HTML-розсилки;

  • інтерактивна відкрита форма Stripo, яка дозволяє залишати коментарі безпосередньо в листі, генерує у 5,2 разів більше відгуків, аніж форма на зовнішньому ресурсі;

  • запропонувавши покупцям опцію перегляду детальних описів товарів, залишених у кошику, Ecwid збільшили продажі на 82% — усе це завдяки технології AMP.

(Джерело: Mailmodo)

Ще більше вражаючої статистики ви знайдете тут.

13. Застосовуйте гейміфікацію листів

Гейміфікація дозволяє створювати для листів щось на кшталт вбудованих ігор. Давайте розглянемо деякі переваги цієї методики:

  • гейміфікація листів збільшує конверсію;

  • ви розважаєте клієнтів своїми листами — ви надаєте людям можливість трохи відпочити;

  • гейміфікація підвищує відсоток відкривання — користувачі чекають на ваші нові листи;

  • ROI (рентабельність інвестицій) зростає втричі;

  • ігрові розсилки позитивно впливають на впізнаваність вашого бренду.

У нашому блозі є стаття «Гейміфікація в email-маркетингу», в якій ми ділимося рекомендаціями щодо швидкого створення ігор і пропонуємо кілька готових механік.

Час робити розсилки фановими!

14. Приділіть увагу доступності листів

Цей пункт є одночасно і рекомендацією, і правилом.

Ваші розсилки мають бути доступними! Важливо пам'ятати, що частина людей має проблеми із зором. Тому можливість прочитати ваш контент слід надати всім одержувачам — і тим, хто читає самостійно, і тим, хто використовує програми для читання екрану.

Ось ключові рекомендації із дизайну доступних листів:

  • використовуйте контрастні кольори різних відтінків;

  • завжди! Чуєте, ЗАВЖДИ! додавайте альтернативний текст до всіх зображень та GIF-анімацій;

  • якщо GIF-файл виконує навчальну місію, обов'язково додайте до нього детальний текстовий опис;

  • уникайте двох або більше GIF-анімацій на одному екрані;

  • проставляйте знаки пунктуації в кінці кожного речення або пункту маркованого списку;

  • вкажіть тип контенту <charset=”utf-8″> у заголовку коду листа, щоб усі символи, які використовуються в повідомленні, були легко читаними;

  • встановіть мову в заголовку коду;

  • вирівнюйте тексти за лівим краєм, але в жодному разі не за центром.

15. Додавайте підпис, або футер

Користувачам потрібно знати, як підписатися на вас у соцмережах, як зв'язатися з вами у разі потреби та ін.

Якщо ви відправляєте проморозсилки від імені всієї команди, не забудьте про це згадати.

Якщо ж від свого імені — обов'язково додайте своє фото, контактну інформацію та щось на кшталт «Незабаром зустрінемося».

Підпис-Дизайн-для-Пошта-Дайджести

(Джерело: шаблон Stripo)

І загальні правила створення ефективних листів

Є кілька універсальних моментів, які варто згадати, говорячи про найкращі практики дизайну email-шаблонів:

  • не забувайте про стискання картинок, щоб зменшити час завантаження;

  • робіть контент актуальним для клієнтів. Інакше кажучи, персоналізуйте пропозиції та контент розсилок;

  • додавайте посилання для відписки!

Рекомендації по дизайну пошти_Кнопка відмови від підписки

(Джерело: розсилка від Gap Flash Sale)

На завершення

Кожен розділ цієї статті написаний для того, щоб допомогти вам покращити ваші розсилки. Пам'ятайте, що для удосконалення навичок email-дизайну не існує жодних обмежень. Тому не бійтеся експериментувати, шукайте найефективніші методики для свого бренду і створюйте розсилки разом із Stripo — ми допоможемо вам на всіх етапах!

Створюйте ефективні листи — зі Stripo навички програмування не знадобляться

Mathieu Gagnon 3 тижні тому

Excellent!

Ганна Кузнєцова прокоментував Mathieu Gagnon 3 тижні тому

Mathieu Gagnon, We're happy you liked it. Thank you for your supportive feedback.

Вас також може зацікавити

Попередні статті Наступні статті
10 днів тому · 14 хв читати
Email-запрошення на вебінар

Вебінар — це не лише файний спосіб навчитися чомусь новому і швидко отримати порцію свіжої інформації, але й чудова можливість подивитися на проблему з точки зору інших людей та дізнатися про їхній персональний досвід її вирішення. Але ми всі щодня отримуємо безліч листів із запрошеннями на вебінари. І навіть якби ми хотіли, то жодним чином не змогли б відвідати їх усі. Окрім того, ми занадто цінуємо свій час, щоб дивитися/читати/слухати те, що може нам не знадобитися. Тож ми зазвичай обираємо...

Дизайн Маркетинг Структура Шаблон
24 вересня · 18 хв читати
Найкращі шрифти для розсилок: поради та хитрощі

Одна з найсерйозніших проблем під час створення електронних листів — правильно вибрати шрифт. Вага, висота, ширина, колір, форма, інтервал... Чи справді тут все має значення? Так, важливим є все, але найголовніша умова — вибрати читабельний шрифт. У цій статті ми розповімо, як вибрати найкращий професійний шрифт для розсилки. Із Stripo працювати зі шрифтами листів дуже легко Почати Шрифти HTML-листів: основні правила, яких треба дотримуватися Вибираючи оптимальний шрифт, слід враховувати три базових правила: 1. Не використовуйте більше двох шрифтів Якщо ви...

Дизайн Шаблон
Будьте завжди в курсі останніх новин у сфері email-маркетингу