Верстка писем для email рассылки онлайн: Stripo — бесплатный конструктор email-шаблонов: визуальный и HTML редакторы

Лучшие конструкторы html писем в 2021 году

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

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

Что такое конструктор email писем

Html-конструктор писем  —  это инструмент для создания шаблонов электронной почты, которые затем можно использовать в емейл-кампаниях. Практически все рассылки с красочными баннерами, которые ежедневно приходят на почту, созданы с помощью html-шаблонов. Если вы еще не создавали письма в конструкторе, вот несколько причин, чтобы попробовать:

• Экономия времени. Даже если кто-то из сотрудников отлично владеет html, оформление письма вручную займет слишком много времени. Конструктор email рассылок позволяет создавать шаблоны быстрее и без лишних усилий.
• Готовые дизайны. Используя конструктор email писем, не придется изощряться с оформлением, поскольку готовые шаблоны созданы профессиональными дизайнерами. Достаточно изменить дизайн под свои потребности.
• Совместимость с большинством email-клиентов гарантирует, что письмо будет выглядеть одинаково у каждого получателя, и все элементы дизайна отобразятся корректно.
• Простая совместная работа. Многие конструкторы писем онлайн дают возможность совместного редактирования, благодаря чему в создании дизайна может участвовать вся команда.
• Легкий доступ. Еще одно преимущество онлайн-конструктора писем  —  это то, что созданные дизайны хранятся в облаке. Не нужно ждать, пока коллеги отправят файлы  —  доступ к ним возможен в любое время с любого устройства.

Как выбрать конструктор html писем

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

Достаточная библиотека готовых шаблонов

Есть простые бесплатные онлайн-конструкторы html писем, которые содержат не большое количество дизайнов. Есть сервисы с тысячами шаблонов. Если вариантов слишком мало, вероятно, будет сложно найти подходящий дизайн. С другой стороны, оплачивая дорогой конструктор с огромным количеством шаблонов, компании часто используют всего несколько из них. Хорошее решение  —  подобрать сервис, где шаблонов достаточно много, но не слишком. К слову, CRM-система NetHunt позволяет хранить от 10 и более готовых шаблонов и бесплатно рассылать неограниченное количество писем через Gmail.

Встроенный редактор изображений

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

Быстрый предварительный просмотр

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

Совместимость с почтовыми клиентами

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

Интеграция с сервисом рассылки

Интеграция конструктора email-шаблонов с вашим сервисом рассылки  —  важная функция для удобства работы и экономии времени.

Простой и понятный интерфейс

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

Совместное редактирование

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

5 лучших конструкторов HTML-шаблонов емейл писем в 2021 году

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

1. Stripo

Это русифицированный конструктор email-шаблонов, редактор которого напоминает WordPress. Письма создаются из стандартных модулей, управление простое и понятное. Stripo имеет прямую интеграцию с множеством сервисов емейл рассылок, а также базовый бесплатный тариф. Одна из фишек этого конструктора шаблонов  —  возможность геймифицировать изображения.

2. Mailchimp

Много лет Mailchimp остается одним из самых известных онлайн конструкторов html писем: 23% маркетологов по всему миру используют именно этот сервис. В Mailchimp сравнительно немного шаблонов, но простое управление. Кроме того, он позволяет загружать и редактировать сторонние шаблоны писем, которые можно скачать в интернете. Конструктор шаблонов email  —  это одна из функций Mailchimp, поскольку в первую очередь он является сервисом рассылки.

3. Canva

Если вы ищете бесплатный онлайн конструктор html писем, присмотритесь к Canva. Это многофункциональный сервис создания дизайнов для различных целей: баннеров, визиток, флаеров, презентаций и многого другого. Есть и конструктор email-шаблонов. Преимущества Canva  —  это большой выбор бесплатных шаблонов и элементов (понравившиеся платные можно приобретать отдельно), великолепное управление, встроенный редактор изображений, широкий функционал (включая анимацию), совместное редактирование, русскоязычный интерфейс и гибкие тарифы. Базовый тариф  —  бесплатный.

4. BEE Free

Создатели этого сервиса назвали его Best Email Editor и не преувеличили. Это бесплатный онлайн конструктор html писем с возможностью покупки pro-версии. Он содержит более 500 адаптивных шаблонов писем, редактор изображений, возможность управлять отображением элементов дизайна в зависимости от размера экрана получателя. Поддерживает интеграцию с MailChimp и Gmail. Из недостатков: отсутствие русскоязычного интерфейса и возможности хранить созданные шаблоны в облаке.

5. Chamaileon

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

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

Опубликовано февраль 22, 2021, дополнено февраль 24, 2021

Поделиться постом с друзьями и коллегами!

Вёрстка HTML писем — WOW EMAIL

Команда email разработчиков предлагает свои услуги PSD to Email.
* * * * *
Создание email шаблонов любой сложности для сервисов рассылок:
MailChimp, Campaign Monitor, UniSender, Sendsay, SendPulse,
HubSpot, Marketo, SendGrid,
StampReady и др.

* * *
Разработка адаптивных писем с медиа запросами.
Почта [email protected]
Скайп teamwowemail

Успешно выполнили вёрстку более 12 000 HTML писем

• Соблюдаем
  Pixel Perfect

• Успеваем выполнить
  заказ за 1-2 дня

• Гарантируем
  NDA

• Оживляем любой креативный дизайн

• Передаем компактный
  и чистый HTML код

• Тестируем на моб. устройствах

• Консультируем
  еще до разработки

• Работаем с форматами: PSD, PDF, PNG…

Заказать HTML письмо

• Выполним запрос
  шаблон для MailChimp

• Выполним запрос
  шаблон для CM

• Выполним запрос
  шаблон для StampReady

• Выполним запрос
  шаблон для SendGrid

• Выполним запрос
  шаблон для Marketo

• Выполним запрос
  шаблон для HubSpot

Многие маркетологи научились сочетать низкую стоимость рассылки с ее высокой возвратной доходностью

Еще в 2014 году email-маркетинг обогнал SEO по показателям рентабельности.

AdestraMarketingCensus

Адаптивные письма

Адаптивные письма (responsive email) — современная технология вёрстки HTML писем, которая изменяет дизайн на мобильных устройствах, делая их удобными для отображения на небольших экранах.

Узнать больше…

Помните, что открытие писем на мобильных устройствах увеличилось на 30%

Не оставляйте вопросы на завтра, если ответы можно получить сегодня.
Пишите в скайп teamwowemail или на почту [email protected]. Постараемся незамедлительно ответить.
Ознакомьтесь с разделом FAQs.

WOW EMAIL информационный партнер

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

Рекомендуем полезные книги

Заказать HTML письмо

6 лайфхаков от дизайнера — Дизайн на vc.ru

Далеко не все дизайнеры готовы заниматься вёрсткой email-рассылок. Якобы письма загоняют творчество в жёсткие рамки. Мы считаем иначе: веб-дизайн писем помогает истинному творцу раскрыться. Как и в других сферах, в email есть правила. Если чётко им следовать, рассылки будут круто выглядеть на всех устройствах и почтовиках и приносить бизнесу доход.

{«id»:213751,»url»:»https:\/\/vc.ru\/design\/213751-verstka-email-rassylki-6-layfhakov-ot-dizaynera»,»title»:»\u0412\u0451\u0440\u0441\u0442\u043a\u0430 email-\u0440\u0430\u0441\u0441\u044b\u043b\u043a\u0438: 6 \u043b\u0430\u0439\u0444\u0445\u0430\u043a\u043e\u0432 \u043e\u0442 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430″,»services»:{«facebook»:{«url»:»https:\/\/www.

facebook.com\/sharer\/sharer.php?u=https:\/\/vc.ru\/design\/213751-verstka-email-rassylki-6-layfhakov-ot-dizaynera»,»short_name»:»FB»,»title»:»Facebook»,»width»:600,»height»:450},»vkontakte»:{«url»:»https:\/\/vk.com\/share.php?url=https:\/\/vc.ru\/design\/213751-verstka-email-rassylki-6-layfhakov-ot-dizaynera&title=\u0412\u0451\u0440\u0441\u0442\u043a\u0430 email-\u0440\u0430\u0441\u0441\u044b\u043b\u043a\u0438: 6 \u043b\u0430\u0439\u0444\u0445\u0430\u043a\u043e\u0432 \u043e\u0442 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430″,»short_name»:»VK»,»title»:»\u0412\u041a\u043e\u043d\u0442\u0430\u043a\u0442\u0435″,»width»:600,»height»:450},»twitter»:{«url»:»https:\/\/twitter.com\/intent\/tweet?url=https:\/\/vc.ru\/design\/213751-verstka-email-rassylki-6-layfhakov-ot-dizaynera&text=\u0412\u0451\u0440\u0441\u0442\u043a\u0430 email-\u0440\u0430\u0441\u0441\u044b\u043b\u043a\u0438: 6 \u043b\u0430\u0439\u0444\u0445\u0430\u043a\u043e\u0432 \u043e\u0442 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430″,»short_name»:»TW»,»title»:»Twitter»,»width»:600,»height»:450},»telegram»:{«url»:»tg:\/\/msg_url?url=https:\/\/vc. ru\/design\/213751-verstka-email-rassylki-6-layfhakov-ot-dizaynera&text=\u0412\u0451\u0440\u0441\u0442\u043a\u0430 email-\u0440\u0430\u0441\u0441\u044b\u043b\u043a\u0438: 6 \u043b\u0430\u0439\u0444\u0445\u0430\u043a\u043e\u0432 \u043e\u0442 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430″,»short_name»:»TG»,»title»:»Telegram»,»width»:600,»height»:450},»odnoklassniki»:{«url»:»http:\/\/connect.ok.ru\/dk?st.cmd=WidgetSharePreview&service=odnoklassniki&st.shareUrl=https:\/\/vc.ru\/design\/213751-verstka-email-rassylki-6-layfhakov-ot-dizaynera»,»short_name»:»OK»,»title»:»\u041e\u0434\u043d\u043e\u043a\u043b\u0430\u0441\u0441\u043d\u0438\u043a\u0438″,»width»:600,»height»:450},»email»:{«url»:»mailto:?subject=\u0412\u0451\u0440\u0441\u0442\u043a\u0430 email-\u0440\u0430\u0441\u0441\u044b\u043b\u043a\u0438: 6 \u043b\u0430\u0439\u0444\u0445\u0430\u043a\u043e\u0432 \u043e\u0442 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430&body=https:\/\/vc.ru\/design\/213751-verstka-email-rassylki-6-layfhakov-ot-dizaynera»,»short_name»:»Email»,»title»:»\u041e\u0442\u043f\u0440\u0430\u0432\u0438\u0442\u044c \u043d\u0430 \u043f\u043e\u0447\u0442\u0443″,»width»:600,»height»:450}},»isFavorited»:false}

1860 просмотров

Вёрстка email-рассылок Агентство email-маркетинга СХЕМА

Дизайнер агентства СХЕМА Виктория поделилась лайфхаками, как уживаться с требованиями почтовиков и верстать классные письма даже для Outlook.

GIF

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

Что делать?

Сжать гифки. Я задаю настройки в Adobe Media Encoder, чтобы получить GIF нужного мне размера. Как вариант — в программе Gifski создаю гифки из видео, в ней удобно регулировать параметры изображений.

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

Пример сжатого гиф

Шрифты

Есть всего 10 шрифтов, которые можно свободно использовать при вёрстке писем: Times New Roman, Tahoma, Geneva, Arial, Verdana, Courier, Georgia, Palatino, Helvetica и Trebuchet MS. Конечно, вы можете брать и любые другие. Увы, если в компьютере пользователя не установлены дизайнерские шрифты, почтовый клиент автоматически заменит их стандартными. Например, Gmail использует Arial, iCloud Mail — Helvetica, а Outlook 2007/2010/2013 любит Times New Roman.

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

В статье Campaign Monitor можно посмотреть, как почтовики заменяют нестандартные шрифты.

Примеры замены шрифтов

Что делать?

• Смириться и использовать стандартные шрифты.

Например, дизайнеры Bang Bang Education используют только Arial и Helvetica. Смотрится отлично:

Только Arial и Helvetica Bang Bang Education

• Верстать текст картинками. Но это не лучшее решение. Объяснение в следующем пункте.

Вёрстка картинками

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

Что делать?

Сверстать картинками только часть рассылки, например, баннер.

Сжатие картинок

Во входящих часто встречаю письма с откровенно шакальными мутными изображениями. Такое случается, если для рассылки шириной 600 пикселей взять картинку 600 пикселей. Уже давно можно смело использовать фото с бóльшим количеством пикселей.

Мутное изображение книги портит впечатление. А письмо-то классное! Рассылка Альпина

Что делать?

Выкачивать картинки в размере х2 из сервиса, в котором вы работаете.

Адаптив

По статистике, 9 из 10 пользователей выходят в интернет со смартфона. Более 50% проверяют почту не с компьютера. Значит, макет для рассылок нужно составлять так, чтобы из десктопной версии было просто сделать мобильную.

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

• Верстать сразу для мобильных устройств. К примеру, в сервисе Stripo можно посмотреть, как сообщение будет отображаться в обычной и мобильной версиях.
• Помнить про золотое правило email-маркетинга: одна рассылка — одно действие.

Классный адаптив от Airbnb с хорошим подвалом Рассылка Airbnb

Тёмная тема

Вы используете тёмную тему? По данным Android Authority, её ставят 81,9% пользователей Android. 82,7% ценителей Mac тоже предпочитают тёмный режим операционки. Хотя статистика довольно условна (в опросах приняли участие 2514 и 201 человек соответственно), тёмную тему не стоит игнорировать.

Но подружиться с ней сложно. Если вы создаёте рассылки в HTML-вёрстке и они содержат дизайнерские элементы, при переключении на тёмную тему всё может сломаться. Шрифты могут измениться, цвета — инвертироваться. Больше о том, как мы пытались сработаться с dark mode, рассказали в статье на RusBase «Переход на тёмную сторону: делаем ночную тему для email-рассылок».

Что делать?

• Создавать простые письма, в которых будет минимум графики. Они будут нормально отображаться во всех устройствах.
• Использовать изображения без фона в формате .png.
• Для тёмных логотипов добавить светлую размытую обводку.

Что в итоге?

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

Не бойтесь экспериментов. Но прежде чем отправить письмо, ВСЕГДА проверяйте вёрстку. А если закончится вдохновение или решите, что пора улучшить рассылки, напишите нам. Поможем.

Верстка email писем с помощью HTML

Продвижение бизнеса или услуг требует постоянного контакта с клиентами, которое может проходить в различных форматах – холодные и горячие звонки, раздача листовок, баннеры и другие виды рекламы. Но одним из самых эффективных способов рассказать о себе и своей компании – это email-рассылка.

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

Возможно, вы уже знакомы с процессом верстки или умеете создавать письма для email-рассылки самостоятельно, но внезапно столкнулись с некоторыми проблемами. Или же вы только начали изучать этот вопрос и хотите знать некоторые полезные приемы. В любом случае, мы поможем вам разобраться в этом как можно лучше!

---

«Пошло, поехало»

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

К тому же, проблемы могут быть связаны не только с самим устройством, но и с почтовым клиентом, установленном на компьютере или смартфоне. Самые популярные из них – это Outlook, Gmail, Yahoo, iOS, Android, Mozilla Thunderbird и многие др.

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

---

Вот, что нужно запомнить:

1. Предпочтение необходимо отдать верстке с помощью таблицы.
2. Прописывать стили нужно либо в самом коде (инлайн), либо в отдельном файле, либо в «головной» части страницы head вместе с остальными медиа.
3. Сокращение свойств в стилях не особо приветствуется, поэтому прописывайте их в развернутом виде.
4. Откажитесь от фанатичного внедрения CSS3 в коде, иначе в дальнейшем могут появиться серьезные проблемы с отображением.
5. Если хотите, чтобы письмо помещалось на экране по ширине абсолютно на любом устройстве, то не превышайте размер в 600-700px.
6. «Играть» лучше со стандартными шрифтами, ведь далеко не все устройства и клиенты могут похвастаться полной «всеядностью».

---

Табличная верстка

Для того, чтобы контентная часть письма не «поплыла», необходимо заключить её в 2 таблицы таким образом:

В первой части у нас задается 100-процентная ширина экрана с заданным фоном, затем минимальные данные ширины, шрифт в 1px, что предотвращает появление нежелательных отступов.

Во второй таблице мы задали ширину контентной части в 700px, обозначили фон и также, как в первой таблице, поставили минимальные данные ширины. Для cellpadding, cellspacing и border были введены нулевые значения.

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

Адаптивная верстка

Сегодня существует масса способов создания адаптивных email-писем, но мы разберем один из самых действенных. Как же он работает?

В то время, как ширина экрана увеличивается или уменьшается, письмо будет самостоятельно растягиваться или сужаться под новые параметры. Удобно, не правда ли? Если сделать всё правильно, то элементы в письме не будут перетасовываться, как колода карт, а просто начнут смещаться вниз.

Для того, чтобы этот способ работал, нужно использовать тег center со стилями. В том случае, если количество блоков в нашем письме 2 и более, то они должны заключаться в span со стилями, сохраняя таким образом свою структуру. Но здесь существует важное исключение из правил: на версии Microsoft Outlook для настольных ПК необходимо создавать верстку, где вместо center и span будут вставляться другие таблицы.

«Правильные» теги

Как и со шрифтами, некоторые сервисы и устройства дольно капризно относятся к используемым тегам. Так, во всех случает нельзя применять тег button, который при верстке сайтов позволяет создавать кнопки. В email-рассылке такие элементы лучше всего реализовывать при помощи возможностей CSS. Также, стоит отказаться от header и footer, т.к они не воспринимаются на сервисе Mail.ru и Outlook.

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

Внедряем CSS

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

Как добавить CSS в нашу рассылку? Есть 3 варианта.

1. Заключить тег style внутри head или body. Наверно, это один из самых простых и популярных способов, который прекрасно работает как в письмах, так и на страницах сайтов. Но главные его минут – это перегруженность кода, в результате чего становится сложно найти нужный элемент и отредактировать его. В общем, если хотите облегчить себе дальнейшую работу, второй и третий способы специально для вас.

2. «Прячем» стили CSS в отдельном файле и даем на него ссылку в HTML-документе с помощью тега link. Простой способ, стили подгружаются довольно быстро, основной код остается «прозрачным», понятным.

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

Цвет и фон

Цветовое оформление в рассылке задается с помощью 16-теричных числовых значений в формате HEX, например, #FFFFFF (белый цвет). Сокращение до #FFF не рекомендуется, иначе далеко не все устройства и клиенты смогут распознать это значение, поэтому от него лучше отказаться. По той же причине следует избегать внедрение цветов в формате RGB.

Задавать фон в рассылке следует при помощи атрибутов background=»» и bgcolor=»», используемых в теге table. Применив их внутри других тегов, они не будут распознаваться Gmail, если открыть его в браузере Safari. Также, при работе с фоном, нужно исключить использование некоторых свойств CSS, а именно background-image, background-visibility и background-size.

---

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

Если хотите освоить все тонкости верстки email-рассылки, то запишитесь на наши курсы HTML и CSS, где мы совмещаем теоретические и практические занятия, создаем готовые проекты и делимся опытом.

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

Приходите к нам в гости за новыми знаниями!

[HTML Academy] Онлайн-курс «Вёрстка email-рассылок» (2020)

Команда сайта FreeKurses.COM с БОЛЬШИМ УВАЖЕНИЕМ относится к каждому посетителю нашего сайта. Мы стремимся защищать Вашу конфиденциальность и уважать её. Если у Вас есть вопросы о Вашей личной информации, пожалуйста, свяжитесь с нами.

Какую информацию о Вас мы собираем

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

• Ваше реальное имя или никнейм на сайте.
• Ваш адрес электронной почты.
• Ваш IP-адрес.

Дополнительные данные могут быть собраны, если Вы решите поделиться ими, например, если Вы заполните поля в своём профиле.

Мы собираем некоторую или всю эту информацию в следующих случаях:

• Вы регистрируетесь как участник на этом сайте.
• Вы заполняете нашу форму обратной связи.
• Вы просматриваете этот сайт. Смотрите пункт «Политика в отношении файлов cookie» ниже.
• Вы заполняете поля в своём профиле.

Как используется Ваша личная информация

Мы можем использовать Вашу личную информацию в следующих целях:

• Для того, чтобы сделать Вас зарегистрированным участником нашего сайта, чтобы Вы могли добавлять и получить контент.
• Мы можем использовать Ваш адрес электронной почты, чтобы информировать Вас об активности на нашем сайте.
• Ваш IP-адрес записывается при выполнении определённых действий на нашем сайте. Он никогда не отображается публично!

Другие варианты использования Вашей личной информации

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

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

Обеспечение безопасности данных

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

Политика в отношении файлов cookie

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

Более подробную информацию о cookie Вы можете прочитать на этой странице.

Права

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

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

Принятие политики

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

Изменения в политике

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

Дизайн и верстка email-рассылок с помощью Stripo

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

Тренды email-маркетинга  меняются быстро, особенно дизайн и верстка. Для создания письма теперь не нужно задействовать всю команду – достаточно email-маркетолога. Затраты времени на создание действительно красивого и эффективного письма должны сводиться к минимуму. 

Такую возможность предоставляет онлайн-редактор Stripo.

Библиотека готовых шаблонов и блоков

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

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

Создание основных блоков

1. Блок меню

Добавлять меню и менять его впоследствии тоже просто. При работе с блоком в один клик мыши добавляются и редактируются новые пункты меню.

Выглядит этот процесс так:

2. Социальные сети

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

В Stripo одним кликом выбирается размер, цвет, отображение иконок. При этом не нужно заходить в HTML-код.

Оценить скорость добавления и простоту редактирования блока можно ниже.

3. Добавление видео

В Stripo это вопрос нескольких кликов:

Инструменты для творчества

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

1. Встроенный банк картинок и создание баннеров

Можно выбрать картинку непосредственно в редакторе через банк картинок. Для этого удобно использовать поиск по ключевому слову: девушка, парень, Новый год, Рождество и т. п.

После чего из этой картинки непосредственно в Stripo создается готовый баннер.  

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

 Так выглядит готовый баннер:

2. Встроенный фоторедактор, или мини-фотошоп

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

Адаптивность

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

Письма в мобильных  выглядят классно — это ценное преимущество.

 Создание и редактирование карточек товара

И совершенно новый функционал. В Stripo можно настроить динамический контент, или smart-containers. Т.е. можно сгенерировать абсолютно любую карточку товара, всего лишь вставив ссылку на него в нужную строку.

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

Чего ждать от Stripo в будущем?

• Скоро в редакторе появятся новые функции:
• настройка сложного динамического контента;
• автоматическая обработка больших массивов данных для преобразования их в письмо;
• тестирование отображения писем на Litmus;
• создание интерактивных таймеров непосредственно в Stripo.

 

Основы верстки E-mail писем, с помощью html+css

Изучите особенности верстки писем и создавайте красивые рассылки, которые будут отлично выглядеть на любых устройствах!

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

На курсе верстки электронных писем вы пройдете путь от базовых знаний в веб-разработке до продвинутых навыков.

Освойте основы html и css и откройте для себя мир веб-разработки!

Что будет на курсе верстки email рассылок?

• вы познакомитесь с основами верстки электронных писем при помощи html разметки

• поймете, какие ошибки допускают новички и как их избежать

• изучите основные приемы в работе с разметкой страницы html

• познакомитесь с базовой структурой письма и его основными элементами

• узнаете основные теги, которые используются при верстке email рассылок

• научитесь стилизовать письмо в html

• освоите создание таблиц и списков в html

• поймете, как быстро сверстать письмо

• попрактикуетесь работать в редакторе Sublime Text

• разберетесь, как сделать так, чтобы письмо не разъехалось в почтовом клиенте или мобильном приложении

• сверстаете свое первое письмо

Пройдите все этапы создания и стилизации письма вместе с нами!

Почему стоит изучить особенности верстки писем на нашем курсе?

1. Курс максимально емкий – вам не придется тратить месяцы на освоение полезных навыков.

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

3. На курсе много внимания уделяется основам html и css – это даст вам отличную базу для дальнейшего изучения веб-разработки.

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

5. Преподаватель подключает вас к поиску информации. Такой метод увеличивает вашу вовлеченность и помогает лучше усваивать знания.

6. Вы ничем не рискуете: если курс вам не подойдет, мы вернем вам его полную стоимость.

7. В конце обучения мы выдадим сертификат о прохождении курса, чтобы вам было проще найти работу.

Запишитесь на курс верстки email рассылок и повысьте свой профессиональный уровень!

Студенты, которые уже прошли этот курс, поставили ему высокую оценку.

Дильшад Маткулов: «Коротко и понятно! Спасибо!».

Для кого этот курс:

• для новичков, у которых нет навыков верстки

• для начинающих верстальщиков

• для всех желающих познакомиться с веб-разработкой

• для маркетологов, которые хотят повысить экспертность и увеличить заработок

• для агентств – сможете добавить еще одну услугу в прайс

Как написать информационный бюллетень по электронной почте за 13 простых шагов

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

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

Анатомия электронного информационного бюллетеня

Эта великолепная инфографика от Hoot Design показывает основные элементы типичного макета информационного бюллетеня.

• Разместите свой логотип в верхней части информационного бюллетеня, чтобы получатели могли связать его с вами.
• Используйте заголовки для разделения разных частей, как если бы вы делали это в своих статьях.
• Используйте разделители, они помогают читателю разбивать и усваивать контент.
• Используйте изображения, чтобы по-новому взглянуть на электронную почту, но убедитесь, что они соответствуют вашему бренду. В этом примере писатель также использовал смайлики, которые отлично подходят для добавления эмоций в написанное вами произведение.Смайлы могут не подходить для каждой кампании, хотя, например, они могут не работать для компании B2B.
• Ваш информационный бюллетень должен быть брендированным. Цвет, шрифт, тип и вес шрифта, тон голоса должны соответствовать вашему бренду.
• Позвольте вашим читателям реагировать на ваш контент и делиться им в социальных сетях. Вставьте значки социальных сетей в нижней части бюллетеня.
• Визуальные эффекты также важны, потому что большинство людей нажимают на них. Убедитесь, что вы связываете изображения с URL-адресами, на которые хотите отправлять своих читателей.Кроме того, сохраняйте профессиональный дизайн вашего информационного бюллетеня. Прочтите эту замечательную статью о дизайне рассылки, чтобы узнать больше о передовых методах создания рассылки.
• Какие бы призывы к действию вы ни использовали, они должны быть понятными и понятными. Имейте один главный призыв к действию, который поможет вам достичь вашей цели, и имейте еще несколько вспомогательных призывов к действию, таких как значки социальных сетей или пересылки электронной почты.
• Не забудьте указать необходимую информацию в нижнем колонтитуле информационного бюллетеня. Поскольку большинство законов о спаме требует двойного согласия при подписке, вы также должны разместить ссылку для отказа от подписки в своем электронном письме на случай худшего сценария.
• В конце концов, проверьте грамматику и удобочитаемость. Вы можете использовать Grammarly для проверки орфографии и грамматики и приложение Hamingway для оценки уровня удобочитаемости. Стремитесь достичь хотя бы 8-го класса, но чем ниже, тем лучше в большинстве случаев, за исключением случаев, когда у вас есть особая аудитория, такая как юристы, врачи или аналогичные хорошо подготовленные люди.

Как создать информационный бюллетень по электронной почте за 13 шагов

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

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

Вот несколько простых шагов, которые вы можете предпринять, чтобы написать хороший информационный бюллетень по электронной почте:

Шаг 1: Определите цель ваших информационных бюллетеней.

Чего вы хотите достичь с помощью информационных бюллетеней? Какова цель ваших маркетинговых усилий? Ответить на эти вопросы очень важно.

• Хотите, чтобы получатели что-то купили?
• Хотите установить с ними доверительные отношения?
• Ваша цель — обучить читателей?

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

Шаг 2: Используйте календарь информационных бюллетеней редакции

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

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

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

Загрузите наш шаблон календаря планирования электронного маркетинга на 2021 год бесплатно!

Шаг 3. Посвятите каждое электронное письмо одной теме.

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

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

Создавайте столбцы для наиболее важной информации.

• Дата
• Тема
• Правопреемник
• Статус
• Строка темы
• Ссылка на письмо
• Цель
• Персона
• Список
• Ссылка на изображение
• Целевая страница
• Варианты A / B тестирования
• Результат A / B-тестирования

Шаг 4: Создайте броские строки темы

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

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

Используйте метод 4U при написании копии заголовка.

• срочно
• уникально
• сверхспецифично
• полезно

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

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

Не превышайте 50 символов в строке темы

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

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

Воспользуйтесь старым добрым A / B-тестированием, чтобы увидеть, какие темы вызывают более высокий процент открытий и какой контент достаточно привлекателен для привлечения трафика на вашу домашнюю страницу.

Шаг 5: Создайте красивый шаблон информационного бюллетеня

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

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

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

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

Шаг 6: Начните писать информационный бюллетень

Прежде всего, вам нужно решить, хотите ли вы отправлять электронные письма в обычном текстовом или HTML-формате.

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

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

Начните с приветствия ваших читателей по имени, если это возможно.

В зависимости от содержания информационного бюллетеня электронной почты вы можете использовать разные начальные строки:

• Мы надеемся, что вы хорошо себя чувствуете
• Я надеюсь, что вы хорошо
• Вот наш еженедельный информационный бюллетень, чтобы держать вас в курсе

Шаг 7: Делитесь ценным контентом

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

Есть несколько вопросов, которые помогают определить, действительно ли контент, которым вы хотите поделиться, полезен.

• Время: это случилось недавно?
• Релевантность: это то, что ваша аудитория интересует и находит полезным?
• Прогресс: связано ли это с разработкой вашего продукта?

Не продавайте агрессивно.

Сохраните старое-доброе соотношение 90/10%. В наши дни люди не хотят, чтобы их продавали. Как только они почувствуют, что вы слишком сильно продвигаете свой продукт, они откажутся от подписки.

10% продвижения более чем достаточно в рассылках.

Используйте простой язык и короткие предложения

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

В предложениях используйте 10–12 слов и избегайте пассивного озвучивания. Это также затрудняет чтение вашего текста. И вы тоже не пишете академическую статью. Вы друг своих читателей, говорите с ними соответственно.

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

Шаг 8: поместите от трех до шести пунктов в один информационный бюллетень.

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

Когда дело доходит до форматов контента, вы можете использовать свое творчество:

• Фото
• Сообщения в блоге
• Отзывы
• Конкурсы
• Новости компании
• Вебинары
• Инфографика
• Предложение

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

Шаги 9: Проверьте свою грамматику.

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

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

Шаги 10.

Отправьте информационный бюллетень, но не останавливайтесь на достигнутом.

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

Шаг 11. Отслеживайте показатели, которые помогут вам достичь ваших целей.

Вот тогда и появляются ваши маркетинговые цели. Когда вы знаете, каковы ваши KPI, очень легко увидеть, удалось ли вам достичь того, чего вы хотели.

Запишите следующие показатели в электронную таблицу, чтобы увидеть, как ваши кампании будут работать с течением времени.

• Всего отправленных писем
• Доставленных писем
• Всего открытий / процент открытий
• Всего кликов / рейтинг кликов
• Конверсия

Какова была цель? Повышение конверсии? Тогда давайте посмотрим, сколько людей совершили конверсию по электронной почте.

Если целью кампании было привлечение посетителей на сайт, проверьте аналитику своего сайта. Увеличилось ли количество посетителей? А как насчет показателя отказов? Это около 50%? Тогда это здорово!

Шаг 12: Проверьте лучшее время для отправки электронных писем

Согласно CoSchedule, лучшим днем ​​для отправки электронных писем являются вторник, среда и четверг.

Они также предположили, что лучшее время — 10:00, 20:00, 14:00 и 6:00.

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

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

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

Шаг 13: Не отправляйте информационные бюллетени по электронной почте слишком часто или слишком редко.

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

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

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

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

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

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

Примеры информационных бюллетеней по электронной почте

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

Информационный бюллетень по электронной почте с обновлением продукта

Прибыл новый Nest Hub

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

В этом письме Google представляет свои новейшие инновации в красивом, увлекательном информационном бюллетене. Это отличное воспитание здесь. Не настойчивый, но дружелюбный.

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

Магазин плавает перед распродажей

Информационный бюллетень выбора продуктов

Готовы ли вы к волне тепла?

Подготовка ко всем элементам

Информационный бюллетень событий

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

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

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

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

Информационный бюллетень блога

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

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

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

Информационный бюллетень с объявлениями

Сидите, читайте, внимайте Том 6: Последние новости о собаках

У вас есть какие-либо объявления или обновления продукта, которыми вы хотите поделиться со всем миром? Будьте откровенны и расскажите получателям, о чем идет речь.Нет необходимости в сахарном покрытии.

Информационный бюллетень для электронной коммерции

Весна, это ты?

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

Таймеры обратного отсчета

ПОСЛЕДНИЙ ШАНС: РАСПРОДАЖА ЗАКОНЧИВАЕТСЯ сегодня вечером!

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

Подробнее | Узнайте, как добавить таймер обратного отсчета к своему электронному письму.

Информационный бюллетень счастливых клиентов

Постельное белье наших клиентов одержимо

Сезонные информационные бюллетени по электронной почте

ЗАКАНЧИВАЕТСЯ СЕГОДНЯ: Пост-рождественская распродажа

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

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

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

Как увеличить количество подписчиков на электронную почту?

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

• Создавайте обновления контента с учетом ваших страниц. Мы обнаружили, что это наиболее эффективный способ расширить список рассылки высокого качества.
• Создайте обновление для всего сайта — чтобы увеличить свой список адресов электронной почты, вам нужно собирать электронные письма практически с каждой страницы вашего сайта несколькими способами.Мы обнаружили, что просто сообщение « подпишитесь на нашу рассылку новостей » на самом деле не работает. Вместо вы должны дать своему читателю что-то ценное в обмен на его электронную почту:
• электронная книга
• инфографика
• курс
• и т. Д.
• Добавить всплывающее окно с раздачей подарков . Согласно недавнему исследованию Sumo, всплывающее окно выхода привлекло более 40 000 подписчиков всего за 10 месяцев.
• В этом посте вы можете найти другие полезные советы по расширению списка рассылки.

Что делать, если кто-то никогда не открывает вашу рассылку?

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

Но у вас есть еще один последний шанс действовать. Отправьте своему лиду электронное письмо и попросите его снова подтвердить свою подписку.

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

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

Что вы можете получить от своей маркетинговой рассылки?

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

• Увеличьте конверсию и ROI (возврат инвестиций)
• Завоюйте доверие у своей аудитории
• Привлекайте внимание к своему предложению
• Будьте в жизни своей аудитории, будьте другом людей
• Привлекайте трафик на свой веб-сайт
• Заведите еще одно канал, который вы можете контролировать

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

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

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

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

Подробное руководство по созданию информационного бюллетеня электронной почты с более чем 40 передовыми практиками

Я уверен, что вы читали пару статей о дизайне информационного бюллетеня, прежде чем нашли этот фрагмент содержания.

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

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

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

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

Как разработать информационный бюллетень

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

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

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

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

Сначала дизайн электронной почты или контент электронной почты?

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

Что не так с Lorem ipsum?

Ничего, если вы знаете, что заменит Lorem ipsum в вашем дизайне. Никогда не начинайте работу над дизайном, пока не будете уверены, каким будет контент.

Почему?

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

Сядьте и напишите копию своего электронного письма как можно скорее. Это даст вам четкое представление о внешнем виде, даже если вы не дизайнер.

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

Что должно включать в себя бриф на дизайн электронного письма?

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

• Цели и задачи : Какова ваша цель с дизайном? Хотите что-то продать или доставить полезную информацию? В случае дизайн-проекта информационного бюллетеня информация должна быть в центре внимания, а продажи должны быть второстепенными.
• Бюджет и график : Важно уточнить сроки и ограничения затрат как можно раньше. Если вы создаете дизайн для себя, стоимость не так важна, как время.
• Целевая аудитория : Для кого ваша электронная почта? Основные принципы дизайна могут сильно различаться, если он предназначен для миллениалов или для людей старше 50.
• Тема сообщения : Может показаться странным включать тему письма в краткое описание дизайна электронного письма, но позвольте мне рассказать вам, зачем это нужно.Ваши подписчики решают открыть ваше письмо в основном на основе темы, поэтому это единственное, что они читают перед тем, как открыть само письмо. Тема письма уже заставит их задуматься о некоторых ожиданиях, и, если она сосредоточена, например, на одном продукте, этот продукт должен быть в центре вашего дизайна.
• Копия электронной почты : Какое сообщение вы хотите доставить? Напишите фактическую копию электронной почты. Не имеет значения, если он еще не доработан на 100%, но постарайтесь максимально приблизиться к окончательной версии.Убедитесь, что текст соответствует вашему стилю письма и языку вашей аудитории. Ваш стиль письма также сильно повлияет на настроение дизайна.
• Изображения или любые визуальные материалы , которые вы хотите включить. Включите свой логотип, фотографию вашей команды, продукта и все, что вы хотите представить в информационном бюллетене. Например, если вы хотите, чтобы фотография была включена в нижний колонтитул / подпись, включите эту фотографию в краткое описание.
• Целевые почтовые клиенты : это вопрос, относящийся к электронной почте, который необходимо решить из-за различных ограничений почтовых клиентов.Например, если 90% вашей аудитории использует устройства Apple, вы можете использовать необычные шрифты и интерактивные элементы в своем дизайне. Если они используют старые школьные Outlook, вы должны сделать дизайн более минималистичным.
• Руководство по стилю : Если у вас есть определенные фирменные цвета, шрифты или требования к интервалу, укажите их.
• Не надо : если есть определенные вещи, которые вы по какой-то причине не хотите включать в информационный бюллетень, перечислите их. Возможно, вам не нужен макет с тремя столбцами, поскольку на основе предыдущих тестов A / B вы уже знаете, что макет с одним столбцом лучше подходит для вашей аудитории.

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

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

Как создать отличный дизайн информационного бюллетеня электронной почты

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

Создать убедительный дизайн информационного бюллетеня — непростая задача для любого дизайнера. Но это не невыполнимая задача.

Прочитав эту статью, вы узнаете, как сделать свою одну из самых красивых.

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

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

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

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

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

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

Давайте взглянем на еще один красивый информационный бюллетень от Really Good Emails.

Этот более красочный и игривый, чем дизайн информационного бюллетеня Designernews, просто потому, что «веселье» — важная часть бренда Reallygoodemails.

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

Мне любопытно узнать, какой у них показатель открытия для этих информационных бюллетеней, но я почти уверен, что он намного превышает 25%. (Я спрошу их и обновлю статью, если они поделятся со мной этой информацией).

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

Сохраняйте ширину электронного письма 600 пикселей, как это рекомендуется в большинстве случаев.

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

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

При желании можно без проблем переместиться на 640-650 пикселей. Такая ширина будет хорошо работать в большинстве почтовых клиентов, но все, что указано выше, может вызвать проблемы, например, в Yahoo Mail.

У нас есть очень подробная статья объемом более 2 000 слов об ограничениях ширины и размера дизайна электронной почты для вас, если вы хотите узнать больше по этой теме.

В течение многих лет заголовок информационного бюллетеня имел следующие элементы:

• Предзаголовок : короткая строка, обозначающая текст предварительного просмотра в большинстве почтовых клиентов, и ссылка «просмотреть в Интернете» / «просмотреть в браузере», где пользователи могут щелкнуть, если дизайн в некоторых почтовых клиентах испорчен.
• Логотип : Помогает подписчикам определить, от кого пришло электронное письмо.
• Меню навигации : меню, подобное веб-сайту, в котором выделяются наиболее посещаемые части веб-сайта.

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

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

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

Ознакомьтесь с дизайном заголовка информационного бюллетеня от Starbucks:

Источник: Beansnrice.com

В электронном письме нет предварительного заголовка, но присутствует логотип и простое меню навигации, как в рассылке Designernews выше.

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

Источник: Chanel.com

Источник: Uber.com

Чем больше у вас бренд, тем меньше информации вы должны включить в заголовок.

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

Источник: Apple.com

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

источник: Litmus.com

Или IFMA Central Ohio, которая исключила логотип из информационных бюллетеней и сразу сосредоточилась на приглашении.

источник: Pinterest.com

Использование передового опыта создания панели навигации для информационных бюллетеней

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

Но емейл ≠ сайт!

В чем вообще проблема с панелями навигации в дизайне электронной почты?

Они просто прерывают поток электронной почты. Представьте, что:

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

Это хороший пользовательский опыт? Не совсем.

К дизайну электронной почты применяется то же правило, что и к дизайну целевой страницы:

• Чем меньше у вас CTA (призывов к действию), тем выше будет ваш CTR (рейтинг кликов).
• По возможности не используйте меню навигации, поскольку это всего лишь способ отвлечь подписчиков от основной цели электронной почты, а наличие слишком большого количества ссылок может даже повысить вероятность того, что они будут сочтены спамом.

Почему панели навигации по-прежнему могут быть полезны в классическом информационном бюллетене?

В большинстве случаев в вашем информационном бюллетене вы не находитесь в режиме «продажи».Вы скорее стремитесь доставлять ценную информацию своим подписчикам, чем настаивать на своем продукте.

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

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

Источник: Rei.com

Они в значительной степени скопировали большую часть меню веб-сайта прямо в своем информационном бюллетене.

Это меню может работать на настольных компьютерах и клиентах веб-почты при просмотре на ноутбуке или планшете, но такое длинное меню не работает на смартфонах. Вот почему они сократили количество элементов меню на мобильных устройствах.

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

Вот еще один пример от GAP, модного бренда, который также продает одежду через Интернет.

Источник: Gap.com

Они используют очень минималистичный дизайн, что по некоторым причинам хорошо:

• Его легко воспринимать, даже если ВСЕ ЗАГЛАВНЫЕ буквы затрудняют чтение.
• Он занимает немного места на экране (на ноутбуке и планшете), но его количество на мобильных устройствах должно быть уменьшено.
• Для использования требуется менее сложный HTML-код, что помогает с фильтрами спама.

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

Источник: Freshinbox.com

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

Те, кто хочет увидеть ваше меню навигации, могут нажать на гамбургер и увидеть все ваши ссылки, перечисленные друг под другом.

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

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

Узнайте, что сделала GoPro, в следующем информационном бюллетене.

Источник: GoPro.com, Stylecampaign.com

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

Если вы решите использовать панель навигации в дизайне следующего информационного бюллетеня, я бы посоветовал вам:

• Сохраняйте минимальное количество навигационных ссылок . Максимум 5, но в идеале не более 3. Если вы достаточно хорошо знаете предпочтения своих подписчиков, вы можете использовать расширенную персонализацию электронной почты, чтобы предлагать только те варианты, которые уместны.
• Будьте последовательны . Используйте те же ссылки в своих информационных бюллетенях, чтобы ваши подписчики могли привыкнуть к ним и знали, что, если они не могут найти реальную ценность в вашем письме, есть опция навигации, которую они могут использовать, например, для перехода к вашим «последним предложениям». .
• A / B test , действительно ли вам нужна панель навигации или нет. Если вы сделаете это правильно, панель навигации может пригодиться, но если вы переборщите, она негативно повлияет на ваши общие конверсии. Только ваши собственные тесты могут сказать, является ли панель навигации для вас выигрышной или проигрышной.

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

Используйте дизайн раздела / подразделения героя

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

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

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

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

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

Посмотрите на приведенный ниже пример от Hawaiian Airlines, который отлично справляется с разделением фонового изображения и содержимого.

Источник: Hawaiian Airlines, Reallygoodemails.com

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

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

Вот еще один отличный пример от компании, занимающейся розничной торговлей одеждой Frank and Oak.

Источник: Frankandoak.com, Reallygoodemails.com

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

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

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

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

Источник: Pinterest.com

Будьте осторожны с отзывчивыми информационными бюллетенями по электронной почте, которые вы можете приобрести в Интернете. Многие из них содержат фоновые изображения, которые не работают в Outlook и Outlook.com.

Источник: Pinterest.com

Избегайте дизайна, подобного приведенному выше, или убедитесь, что где-то на странице шаблона упоминается, что они заставили фоновые изображения работать и в Outlooks.

Используйте анимированные GIF-файлы в разделе / ​​модуле главного героя.

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

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

Я поискал A / B-тесты, которые действительно могут доказать, как анимированные GIF-файлы могут повысить доход от электронной почты, и нашел на сайте Fueltravel.com приведенный ниже пример.

Источник: Fueltravel.com

Они A / B протестировали статическое изображение по сравнению с анимированной версией GIF, которую вы можете увидеть в информационном бюллетене выше. Больше ничего, конечно, не изменилось в дизайне.

Как вы думаете, насколько улучшился CTR?

На 21% было наибольшее улучшение CTR. для незанятых пользователей, которые не взаимодействовали ни с одним из писем в последние месяцы, и увеличение на 13% для вовлеченных пользователей, которые регулярно взаимодействуют со своими письмами.

Оба улучшения значимы, особенно если они приводят к увеличению конверсии и рентабельности инвестиций в электронную почту, что, к сожалению, не измерялось в этом A / B-тесте.

Другой тест, проведенный Dell (2014 г.), оказался чрезвычайно успешным, поскольку он увеличил доход от электронной почты на 109%!

Источник: Marketingsherpa.com

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

С 2014 года анимация стала более распространенной в индустрии электронной почты, так что, возможно, анимированный GIF не сразу удвоит ваши доходы, но я уверен, что в большинстве случаев он увеличит вовлеченность и конверсию по электронной почте как минимум на 10%.

Теперь давайте посмотрим на другие вдохновляющие примеры анимированных GIF-файлов в информационных бюллетенях из различных отраслей.

Источник: Oshkosh.com

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

Вот еще один простой пример с Blacktux.com, играющий с черным и белым.

Источник: Theblacktux.com, Reallygoodemails.com

И более сложный, с индивидуальной анимацией от Гарри.

Источник: Harrys.com, Reallygoodemails.com

Вот очень интересное сообщение от Complex.com. Выглядит круто, не правда ли?

Источник: Complex.com, Reallygoodemails.com

Да, но проблема в том, что размер этого письма был 6,4 МБ! Довольно большой размер для электронного письма, верно? Я уверен, что загрузка такого письма через мобильное соединение может занять более 10 секунд.

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

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

Как бы вы отреагировали, если откроете это письмо на своем мобильном телефоне, находясь в пути, имея только соединение 3G?

Сильно разочарован, так как большинство изображений сначала не было видно.

Задачи с анимированными GIF-изображениями в электронной почте

К счастью, анимированные GIF-файлы поддерживаются большинством почтовых клиентов, за исключением Outlook 2007-2013 и Windows Phone .В этих почтовых клиентах анимация не воспроизводится, и отображается только первый кадр GIF.

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

Помимо совместимости, есть еще пара проблем с анимированными GIF-файлами, которые вы должны решить:

• Оптимизировать размер GIF — К сожалению, размер анимированных GIF-файлов может легко превысить 2 МБ, если вы хотите создать впечатление, подобное видео.Размер электронного письма действительно имеет значение, когда речь идет о доставляемости и удобстве подписчиков. Всегда убедитесь, что вы оптимизируете свои GIF-файлы с помощью решения для оптимизации изображений. Стремитесь уменьшить общий размер вашего электронного письма до 1 МБ. Чем меньше, тем лучше!
• Используйте простые, удобные в использовании GIF-файлы , которые понятны с первого взгляда и не запутают подписчиков длинными сообщениями. Менее сложная анимация обычно означает меньший размер GIF, что обычно хорошо для вас по причинам, упомянутым в предыдущем пункте.
• Убедитесь, что GIF заметили все, кто открыл вашу электронную почту. Самый простой способ убедиться, что они увидят ваш GIF, — это добавить его в качестве главного изображения в информационный бюллетень. Если вы хотите выделить свой GIF-файл, вам также следует избавиться от меню навигации в электронной рассылке новостей или, по крайней мере, сделать его менее заметным.
• Включите отдельный призыв к действию текст и кнопку. В большинстве случаев вам нужно усилить визуальное послание вашего анимированного GIF с помощью строки электронного письма, ориентированного на конверсию, и доминирующей кнопки призыва к действию.
• Не злоупотребляйте анимированными GIF-файлами в письме . Конечно, анимированные GIF-файлы — это весело, и на Giphy их огромное количество, которые вы могли бы использовать. Но если вы будете использовать их во всех своих электронных письмах, вашей аудитории может наскучить вы и ваш контент.

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

Узнайте, как 30 брендов используют GIF-изображения в своих сообщениях электронной почты для повышения заинтересованности.

Используйте лучшие рекомендуемые шрифты для информационного бюллетеня электронной почты

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

Только веб-шрифты правильно работают во всех почтовых клиентах!

• Arial
• Courier
• Georgia
• Lucinda Sans
• Lucinda Console
• Tahoma
• Times New Roman
• Trebuchet
• Verdana

Веб-безопасные шрифты скучны, верно?

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

Вы можете использовать в электронной почте не только безопасные для Интернета шрифты, но и причудливые шрифты Google или даже другие, создавая стеки шрифтов в CSS. Мы добавляем поддержку шрифтов Google в Chamaileon.io, поэтому вы сможете выбирать из множества вариантов при создании информационных бюллетеней.

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

Веб-шрифты поддерживаются только :

• AOL Mail
• Собственное почтовое приложение Android (не Gmail)
• Apple Mail
• iOS Mail
• Outlook 2000
• Outlook.com app

Интересный факт: шрифты Google не работают даже в Gmail. Вы спросите: «Что ???». Да, вы правильно это слышали. Есть странные вещи, которые вы должны принять в дизайне электронной почты.

Мы бы посоветовали вам использовать веб-шрифты только в том случае, если большая часть вашей аудитории использует устройства Apple . Если большинство из них работает на Android или использует Outlook, вам лучше использовать безопасные для Интернета шрифты.

Но какие веб-шрифты выбрать?

Источник: Mashable.com

Согласно отчету Bloomberg, как Arial, так и Helvetica плохо подходят для электронной почты, даже если в течение многих лет Arial казался стандартным веб-шрифтом в Интернете.

Дизайнеры утверждают, что оба шрифта имеют «неоднозначную» форму букв — их b, d, p и q являются зеркальными формами друг друга, что затрудняет их чтение в длинных текстах.

Хорошо, так что никаких Helvetica или Arial… что тогда?

Georgia и Verdana кажутся самыми популярными шрифтами в электронной почте из-за их удобочитаемости и широкой поддержки в почтовых клиентах.

Для длинного текста мы советуем вам выбрать один из этих двух, а для заголовков вы можете либо использовать другие веб-шрифты, либо поэкспериментировать с Google Fonts или аналогичными — зная, что в Outlook и Gmail будет отображаться резервный вариант. вместо.

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

• логотип
• драгоценный заголовок
• промо-текст
• скидка

Последний вариант — добавить свой текст как изображение вместо .

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

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

Видите? Вот почему пуленепробиваемый вариант — использовать только веб-шрифты. Но все меньше и меньше модных информационных бюллетеней, которые выбрали бы безопасный путь.

Рекомендуемый размер шрифта и высота строки в электронном письме

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

В соответствии с передовой отраслевой практикой:

• Размер шрифта заголовка должен быть около 22–28 пикселей.
• Размер основного шрифта должен быть в диапазоне 14 — 18 пикселей.
• Высота строки должна быть примерно в 1,4–1,5 раза больше, чем размер шрифта, для лучшей читаемости.

Это приблизительные цифры; вы можете обнаружить, что предпочтения вашей аудитории другие.

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

Позвольте мне показать вам пример из Clicklaboratory.

Просто изменив размер шрифта с 10 на 13 пикселей и добавив немного высоты строки, им удалось улучшить показатель отказов веб-сайта Numara на 10%, показатель выхода на 19%, страниц за посещение на 24% и конверсии на потрясающие 133% .

Вы все еще используете мелкий шрифт и одинарную высоту строки в своих электронных письмах?

Пришло время перемен.

Если вы это сделаете, пожалуйста, A / B протестируйте эффект ваших изменений и поделитесь результатами с нами в комментарии.Мы хотели бы опубликовать на нашем сайте тематическое исследование о том, как разные размеры шрифтов могут влиять на конверсию электронной почты.

Теперь давайте перейдем к паре примеров творческого использования шрифтов в электронных информационных бюллетенях.

Источник: Kuratedemail.co

На этом снимке от Airbnb есть фоновое изображение с наложенным огромным текстом BEACH LIFE (в виде изображения) и некоторым дополнительным (давайте будем честными …) текстом на изображении.

В чем проблема?

Фоновое изображение, которое не работает в большинстве Outlook.Я тестировал этот информационный бюллетень, и он развалился в Outlook 2007, 2010, 2013, 2016 и даже в Gmail.

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

Позвольте мне показать вам, что я имею в виду.

Эта часть должна быть добавлена ​​как изображение содержимого. Не как фоновое изображение с наложенным изображением.

Эта часть может быть добавлена ​​как отдельный блок текста с фоновым изображением и резервным цветом, выбранным из фонового изображения.

Не так уж сложно, правда? Но, тем не менее, вы можете видеть, что даже такая огромная компания, как Airbnb, на самом деле не заботится о проблемах с прогнозами… Это действительно удивительно.

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

Вот простой дизайн, который удачно сочетается со шрифтами.

Источник: Trunkclub.com, Reallygoodemails.com

Простой дизайн, но привлекательный для глаз.

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

Самое простое решение; Я должен признать.

Это может сработать, если вы правильно стилизуете свое изображение и убедитесь, что его можно будет читать как на компьютере, так и на мобильном устройстве, сохраняя при этом нормальное соотношение текста к изображению (50:50).

Вот красивый, адаптивный информационный бюллетень с индивидуальным кодом от Litmus с максимальной шириной 1390 пикселей.

источник: Litmus.com, Reallygoodemails.com

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

Вот пример из Evernote, включающего Caecilia LT Std Light, с откатом на Helvetica и Arial.

Источник: Evernote.com, Reallygoodemails.com

Другой шрифт от Lyft — это шрифт Gotham с запасными вариантами шрифтов Montserrat (шрифт Google), Proxima Nova, Helvetica Neue, Helvetica, Arial и без засечек.

Источник: Lyft.com, Reallygoodemails.com

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

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

Мы рассмотрели заголовки, раздел героев, шрифты, теперь давайте перейдем к дизайну призыва к действию (CTA), и мы закончим с дизайном нижнего колонтитула.

Bonus PDF: получите доступ к бесплатной версии этого руководства в формате PDF.

Используйте лучшие практики призыва к действию (CTA) в своем информационном бюллетене для бизнеса

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

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

Что делает хороший призыв к действию по электронной почте?

• Активный язык — Пожалуйста, не нажимайте «Щелкните здесь» или «Подробнее». Вместо этого используйте активную формулировку, которая имеет ощущение срочности и ясно показывает, что происходит после того, как кто-то нажимает кнопку.
• Получите бесплатный образец продукта сейчас
• Начните 14-дневную бесплатную пробную версию
• Купите спальные мешки сейчас
• Испытайте один месяц бесплатно
• Заказать онлайн сейчас
• Зарегистрируйтесь для раннего доступа
• Сделайте CTA заметным — Ваш призыв к действию должен выделяться из окружения, поэтому всегда убедитесь, что он имеет:
• Легко различимый цвет
• Значительное белое пространство вокруг
• Тип шрифта и интервал, которые делают его читаемым с первого взгляда
• Марка он отзывчивый — увеличьте его на мобильных экранах, растяните на всю ширину и сделайте его легко кликабельным на смартфонах.
• Персонализируйте призыв к действию — Настройте его не только в соответствии с содержанием электронного письма, но и с предпочтениями подписчика, который его читает. Углубленная персонализация — сложная проблема, но чем глубже вы углубитесь в таргетинг и персонализацию, тем выше будет конверсия вашей электронной почты.
• Сведите к минимуму количество CTA — Вообще говоря, чем меньше призывов к действию у вас будет в информационном бюллетене по электронной почте, тем выше будет ваш рейтинг кликов.Обилие вариантов может легко ошеломить людей.

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

Есть ли идеальный размер, цвет или форма CTA?

Apple рекомендует, чтобы любая точка касания была высотой не менее 44 пикселей. Вот почему мы советуем вам иметь призыв к действию выше 44 пикселей.Средняя высота CTA составляет 47,9 пикселей, а . Самая популярная высота CTA — 50 пикселей. — по крайней мере, круглое число.

Общепринятая передовая практика — согласовывать цвет CTA с цветом бренда .

Источник: Reallygoodemails.com

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

В недавнем глобальном исследовании марсианский зеленый был выбран в качестве любимого цвета в мире.Хотя он называется «Марс-зеленый», никто не может решить, зеленый он или синий.

Источник: Telegraph.co.uk

Как вы думаете, он синий или зеленый? 🙂

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

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

Кнопки с закругленными краями кажутся наиболее предпочтительными (54%) , квадратные кнопки находятся на втором месте (28%), а таблетки в форме последней (18% и имеют тенденцию к увеличению).

Если ваша кнопка имеет правильный размер, язык действий, привлекательный цвет, все в порядке, но не забывайте, что A / B-тестирование вашего электронного письма с призывом к действию легко, поэтому часто проверяйте варианты.

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

Источник: Reallygoodemails.com

В этом письме от KLM цвет бренда совпадает с изображением героя и призывом к действию.

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

В этом письме от Alit используется очень сбалансированная светло-розовая цветовая гамма, чтобы продемонстрировать свое розовое вино.

источник: Reallygoodemails.com

Обратите внимание на текст призыва к действию. Нет «заказать сейчас»; вместо этого они решили использовать что-то более удивительное, но легкое для понимания.

Вот забавный пример из рекламного письма Семальта.

Источник: Reallygoodemails.com

В них есть не только креативный анимированный GIF, но и необычный призыв к действию, который обязательно привлечет ваше внимание, если вы откроете письмо.

Они использовали необычный текст CTA, который на первый взгляд не имеет особого смысла, но в сочетании с анимированным GIF-файлом он работает.

Ознакомьтесь со следующим информационным бюллетенем от Litmus.

Источник: Litmus.com, Reallygoodemails.com

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

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

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

Источник: Nordvpn.com, Reallygoodemails.com

Шрифты, кнопки, цвета и интервалы — все это играет важную роль в общем оформлении вашего информационного бюллетеня.

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

Не забывайте о передовых методах проектирования блоков электронного письма

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

Сохраняйте правильное соотношение изображения к тексту

Согласно Email on Acid and Return Path, вы должны стремиться к соотношению текста к изображению 60/40 в ваших информационных бюллетенях по электронной почте.

Стоит отметить, что ваше электронное письмо должно содержать не менее 500 символов текста, поскольку, если у вас меньше, вы, скорее всего, попадете в ловушку спам-фильтров Outlooks.

Другой передовой совет от Mailchimp гласит, что вам следует стремиться к соотношению текста и изображения 80/20 , что означает, что только часть вашего электронного письма должна включать изображения.

Независимо от того, придерживаетесь ли вы 60% или 80%, убедитесь:

• В ваших изображениях есть альтернативные тексты (теги alt).
• Избегайте отправки электронных писем, содержащих только одно изображение.
• Проверяйте рейтинг своих писем на спам и корректируйте содержание, если это необходимо.

Оптимизация для сканирования и удобства чтения

Согласно старому, но золотому исследованию UX, большинство людей читают в сети буквой F.

Источник: Nngroup.com

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

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

Используйте пустое пространство

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

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

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

Используйте только качественные изображения и иконки

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

Источник: Shutterstock.com

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

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

Держите его чистым и простым

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

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

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

Следите за трендами электронной почты и веб-дизайна

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

Есть только пара сайтов, таких как Reddit или Craigslist, которым удалось выжить с превосходным старым дизайном.

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

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

Примечание: все примеры в оставшейся части статьи взяты с замечательного сайта Reallygoodemails.com.

Дизайн блоков информационного бюллетеня в одну колонку

Что делает этот бюллетень замечательным?

• Уникальное и стильное изображение героя
• Легко читаемый заголовок и текст
• Выдающийся дизайн CTA

Ничего особенного, верно? Но он по-прежнему работает:

• Значимое пользовательское изображение героя
• Легко использовать заголовок и текст
• Просто, по делу CTA

Еще одно простое изображение от Zapier:

• Пользовательское изображение героя
• Заголовок включен в виде текста HTML , не написано на изображении
• Большая контрастная кнопка с четким призывом к действию

Пользовательский значок и красивое фоновое изображение могут означать волшебство:

• Огромный заголовок
• Красивое фоновое изображение (не работает в Outlook но имеет тот же цвет фона, что и резервный вариант)
• Простой значок с анимированными эффектами бликов (см. анимированную версию электронного письма здесь)

Дизайн блока информационных бюллетеней с двумя столбцами

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

• Закругленные углы изображения
• Цветные тексты
• Изображения высокого стандарта

Простой значок и контрастная кнопка призыва к действию с активным текстом.

Целевое предложение тоже может помочь:

• Персонализированное предложение
• Легко узнаваемое изображение продукта
• Кнопка и скидка представлены в ярких цветах

Вы можете мыслить нестандартно и играть с различными адаптивными макетами и цветами как Helix Sleep.

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

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

В этом простом примере с двумя столбцами Campaign Monitor придерживается цветов бренда в столбцах.

Трехстолбцовый дизайн блоков информационных бюллетеней по электронной почте

Трех- или четырехколоночные макеты гораздо менее популярны, чем двухстолбцовые, потому что обычно трудно уместить значительный объем письменной информации в контейнеры шириной 200 пикселей.

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

Penguin.co.uk оживляет игру творческим использованием цвета в своем информационном бюллетене.

Простой и очень минималистичный дизайн также может работать с высококачественными фотографиями продуктов с Huckberry.com.

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

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

Я надеюсь, что приведенное выше вдохновение поможет вам создавать действительно хорошие информационные бюллетени даже самостоятельно, используя конструктор электронной почты, такой как Chamaileon.io.

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

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

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

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

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

Это блок в конце вашего информационного бюллетеня, где вам нужно включить определенную информацию.

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

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

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

Чтобы ваша рассылка не попала в папку для спама, вам необходимо соблюдать Закон о CAN-SPAM от 2003 года. Информация, которая требуется в нижнем колонтитуле электронного письма CAN-SPAM, — это название компании, адрес компании, город, штат и ссылка для отказа от подписки.

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

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

Но что это?

Компания и / или контактная информация

Здесь должны быть указаны все возможные способы связи с вами, если им есть что сказать.

• Ссылка на ваш веб-сайт — Вы должны включить видимую ссылку на ваш веб-сайт. Ссылка может быть простой текстовой ссылкой или вы можете включить свой логотип и добавить к нему ссылку.
• Ваш адрес электронной почты — Где с вами легко связаться. Это не связано с нижним колонтитулом, но убедитесь, что, если они нажимают «Ответить на ваш информационный бюллетень», они получают не адрес электронной почты «no-reply @», а адрес, который отслеживается вашей командой.
• Ваш физический адрес — Требуется в основном из-за определенных правил спама, но может быть полезен, если у вас есть физический магазин, в котором вы продаете свои товары или услуги.

Варианты публикации и подписки в социальных сетях

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

Согласно Salesforce, требуется от 6 до 8 касаний для создания жизнеспособного потенциального покупателя , поэтому чем больше каналов вы используете для общения со своими клиентами, тем выше вероятность, что вы заставите их покупать у вас (опять же).

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

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

Другие элементы

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

Хорошее напоминание о разрешении должно четко указывать, кто отправил электронное письмо и когда они подписались на этот список. Если вы недостаточно понимаете, и они не могут вас запомнить, ваше письмо можно легко пометить как СПАМ.

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

Те, кому это больше не интересно, могут легко отказаться от вашего списка.Если им не удастся его найти, они, скорее всего, отметят ваше письмо как СПАМ.

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

Упростите и упростите использование — Не забрасывайте подписчиков электронной почты слишком большим количеством информации в нижнем колонтитуле.

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

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

Фокус и иерархия — Представьте самое важное действие, которое вы хотите, чтобы ваши подписчики совершили на самом верху, а остальные включите прямо под ним.

Посмотрите этот пример из «Манчестер Юнайтед», который ясно показывает, что они сосредоточены только на увеличении количества подписчиков на других каналах.

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

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

Используйте нижний колонтитул, чтобы показать им, что они вам небезразличны и что вы готовы ответить на любые их вопросы.Покажите, что вы заботитесь о них, как в приведенном ниже примере из The New York Times.

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

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

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

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

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

Самое важное сообщение для вас:

Будьте смелыми и креативными с дизайном информационных бюллетеней!

Дизайн вашей электронной рассылки не должен быть скучным!

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

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

• Имейте в виду, что дизайн электронной почты имеет свои ограничения .
• Используйте профессиональный редактор электронной почты
• Заголовок электронного письма должен представлять ваш бренд и включать ваш логотип и минимальное меню навигации.
• Старайтесь избегать использования фоновых изображений в разделе / ​​блоке вашего информационного бюллетеня, так как они не будут отображаться в Outlook, или, если вы это сделаете, убедитесь, что вы добавили соответствующий резервный цвет.
• Используйте анимированных GIF-файлов , чтобы оживить ваши информационные бюллетени, но не переусердствуйте!
• Georgia и Verdana — лучшие веб-шрифты , которые вы можете безопасно использовать в своих электронных письмах.
• Придерживайтесь рекомендованных размеров шрифта :
• Заголовки: 22–28 пикселей
• Размер шрифта основного текста: 14–18 пикселей
• Высота строки: 1,4–1,5 раза размер шрифта
• CTA должен выделяться из ваш дизайн и включить действенную копию!
• Разумное использование разных цветов, качественных изображений и макетов может сделать содержание вашего информационного бюллетеня и дизайн нижнего колонтитула вызывающим чувство WOW.Если вы мне не верите, просто прокрутите вверх и просмотрите более 40 примеров, которые я привел в этой статье.

Бонусные материалы: Бесплатные шаблоны информационных бюллетеней

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

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

Удачной кампании!

Руководство по шаблону электронной почты о том, как создать шаблон электронной почты

Электронная почта была и остается королем! И для этого есть две основные причины: одна — это разрешение, а вторая — канал связи один-на-один. Именно поэтому, даже после своего появления четыре десятилетия назад, электронный маркетинг по-прежнему остается самым популярным средством коммуникации для маркетологов, позволяющих построить конструктивные отношения со своими клиентами. Но что делает успешную рассылку по электронной почте? Если вы разделите слои, ядро ​​успешной кампании по электронной почте — это привлекательный дизайн шаблона электронного письма.Знаете ли вы, что ежемесячный объем поиска шаблонов электронной почты составил колоссальные 12100 в июне 2020 года. Это показатель того, что многие маркетологи электронной почты хотят отказаться от стандартных шаблонов электронной почты, которые ESP предлагают в своей библиотеке шаблонов.

Мы в Email Uplers понимаем вашу боль, и эта статья представляет собой честную попытку ответить на все вопросы и устранить проблемы, связанные с созданием шаблона электронной почты в 2020 году. Если вам интересно, как создать шаблон электронной почты, мы вы прикрыли.

Что такое шаблон электронного письма? — Понимание основ

Электронное письмо представляет собой комбинацию темы, необычной копии электронного письма, призыва к действию (CTA) и нижнего колонтитула, совместимого с CAN-SPAM. Все, что вы добавляете поверх этих минимальных элементов электронного письма, похоже на приправы, которые вы добавляете в свой шаблон электронного письма.

• Придерживайтесь костей, и у вас будет простое текстовое электронное письмо.
• Включите привлекательные изображения и красочный текст, и у вас будет шаблон электронной почты в формате HTML.
• Включите некоторые CSS-анимации, и вы получите интерактивное электронное письмо.

Разве это не увлекательно?

Давайте начнем с обычного текстового сообщения электронной почты и поймем его важность в последнее время.

Что такое текстовое электронное письмо?

До интеграции кодирования HTML в начале 1990-х электронные письма представляли собой обычные текстовые электронные письма, доступные только в форматировании Unicode (т. Е. Шрифт Unicode и текст с выравниванием по левому краю). Даже после того, как HTML получил широкое распространение, простые текстовые сообщения электронной почты по-прежнему имели самостоятельное значение, и до настоящего времени ESP отправляли текстовую версию вместе со своим HTML-аналогом.Кроме того, многие маркетологи электронной почты делают ставку на создание текстовой версии, поскольку электронные письма рискуют попасть в папки со спамом.

Преимущества использования обычных текстовых сообщений электронной почты:

• Для замены спам-фильтров некоторых почтовых клиентов, таких как Outlook и Gmail, поскольку им требуются текстовые версии электронных писем в формате HTML.
• Некоторые почтовые клиенты не поддерживают версии HTML, а это означает, что ваши HTML-письма рискуют попасть в папки для спама.
• Есть люди, которые предпочитают электронные письма в формате обычного текста HTML.

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

Теперь давайте посмотрим, что предлагают электронные письма в формате HTML и как создать шаблон электронного письма.

ЧТО ТАКОЕ ЭЛЕКТРОННАЯ ПОЧТА HTML И КАК ЕСТЬ РАЗЛИЧИЯ Электронная почта

HTML — это многофункциональная версия обычного текстового сообщения электронной почты. Независимо от использования

или электронные письма HTML имеют структуру, которой можно управлять для создания привлекательного электронного письма, подобного этому, с помощью Uniqlo :

Или нестандартный дизайн шаблона электронного письма, подобный этому от Random Penguin House :

Преимущество использования электронной почты в формате HTML:

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

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

ИНДИВИДУАЛЬНЫЙ ШАБЛОН ПРОТИВ ГОТОВОГО ШАБЛОНА — КАК СДЕЛАТЬ ВЫБОР?

ESP предоставляют библиотеку шаблонов электронной почты, которые вы можете использовать в своих кампаниях по электронной почте. Это очень полезно для начинающих email-маркетологов. Более того, готовые шаблоны — отличная возможность для рассылки электронных писем в последний момент. Эти шаблоны электронной почты в основном бесплатны или доступны за небольшую плату — отличный способ снизить общие затраты на создание шаблонов электронной почты. Как мы уже упоминали, ежемесячный объем поиска для шаблона электронной почты выше, наше руководство может помочь им создать свой собственный шаблон электронной почты с такими опциями, как бесплатные или настраиваемые шаблоны для первого заказа, доступные с помощью Email Uplers.

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

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

Более того, если вы хотите создать интерактивный дизайн электронного письма, вам необходимо создать собственный шаблон электронного письма.

Вот подробное сравнение готового и персонализированного шаблона электронной почты, посмотрите >>

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

Начало работы с шаблоном электронной почты

Пришло время действовать; пришло время создать шаблоны писем. Шаблоны писем похожи на одежду, каждый наряд создан для определенного случая и имеет определенное предназначение. В то время как приветственных писем короткие по размеру и более привлекательны, поскольку они являются вашим первым взаимодействием с подписчиком, электронных писем о воспитании потенциальных клиентов , как правило, описательны с отдельными кнопками CTA. Опять же, транзакционных электронных писем содержат квитанцию ​​о покупке вместе с некоторыми перекрестными продажами.Итак, при создании вашего первого шаблона электронного письма вам нужно начать с…

КАКОЙ ТИП ЭЛЕКТРОННОЙ ПОЧТЫ БУДЕТ? КАКОВА ЦЕЛЬ И КАКИЕ ЦЕЛИ ВЫ ХОТИТЕ ДОСТИГНУТЬ?

На пути к покупателю у подписчика электронной почты существует минимум 5 (или 6, если вы являетесь брендом электронной коммерции) типов электронной почты, которые вы должны им отправить.

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

2. Информационный бюллетень по электронной почте : это периодическое электронное письмо информирует подписчиков о вашем бренде и его продуктах / услугах. Такие письма должны заинтересовать ваших подписчиков совершить покупку у вашего бренда.

3. Электронное письмо с рекламным предложением / объявлением : электронное письмо, которое превращает подписчика электронной почты в клиента. Это письмо будет чисто маркетинговым и должно заставить подписчика поверить в то, что эта покупка решит проблему «выполнить работу», которая в первую очередь привела его к вашему бренду.

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

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

6. (Для электронной торговли) Сообщение об отказе от корзины : По многим причинам хорошо подготовленный подписчик может отказаться от покупки на полпути. Это токсично для вашего бизнеса, и это письмо будет пытаться привлечь таких бросивших вызов и воссоединить их с их тележками. Обязательный адрес электронной почты для электронной коммерции.

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

ГДЕ НАЙТИ ПРИМЕРЫ ШАБЛОНА ЭЛЕКТРОННОЙ ПОЧТЫ И ПОЛУЧИТЬ ВДОХНОВЕНИЕ

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

Что будет содержать копию электронной почты?

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

Копия электронной почты по существу содержит следующие элементы:

• Строка предварительного заголовка и темы : это первое, что увидят ваши подписчики. 80% электронных писем открывается в зависимости от вашей темы. Ваша тема должна намекать, о чем ваша электронная почта, то есть цель должна быть сообщена здесь. Убедитесь, что это не вводит в заблуждение.

• Основная копия : Основная часть вашего электронного письма находится в основной копии. Разговор, начатый темой, нужно продолжить здесь. Ваша электронная почта должна содержать важную информацию и направлять подписчика на целевую страницу для получения дополнительной информации. Итак, ваш основной текст должен быть коротким и четким.
• CTA copy : Точка, где проверяется эффективность вашего основного текста, кнопка CTA также должна иметь эффективную копию (конечно, вместе с дизайном).Копия с призывом к действию должна быть интерактивной, например «Начать бесплатную пробную версию» или «Загрузить мою копию», чтобы читателю предлагалось перейти по ссылке.
• Перед тем, как подписаться: Нижний колонтитул или подпись электронной почты — это то место, где вы подписываете подпись, но большинство маркетологов электронной почты не используют ее должным образом. Подпись электронной почты — это недвижимость, где небольшой маркетинг может быть эффективным.

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

ПЕРСОНАЛИЗАЦИЯ В ЭЛЕКТРОННОЙ ПОЧТЕ

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

КАК СОЗДАТЬ ШАБЛОН ЭЛЕКТРОННОЙ ПОЧТЫ? КАКОВЫ НЕОБХОДИМЫЕ УСЛОВИЯ?

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

• Рекомендации по вашему бренду
• Изображения ваших продуктов
• Целевая аудитория / личность покупателя
• Собираетесь на A / B-тест?
• Будет ли мобильный макет раздельным?
• Копия содержимого электронной почты (обсуждается позже)
• Гиперссылка на целевую страницу
• Есть ли интерактивность? Если да, то какая интерактивность?

Uplers перечисляет 13 уникальных интерактивных элементов дизайна, которые вы можете использовать в своих электронных письмах.Почувствуйте это в своем почтовом ящике >>

Как создать шаблон электронного письма? Изучение сурового песка

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

ЧТО СОСТАВЛЯЕТ ДИЗАЙН ЭЛЕКТРОННОЙ ПОЧТЫ?

Любой дизайн электронного письма основан на пяти принципах.

• Макет электронной почты : Макет электронной почты определяет размещение и иерархию различных элементов электронной почты. Хороший макет электронного письма поможет подписчику просмотреть содержимое и при этом уточнить суть вашего электронного письма. Существует два основных стиля макета электронной почты:

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

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

• Шрифты / Типографика : Хотя копия электронной почты передает сообщение вашего электронного письма, то, как вы представляете сообщение, также играет жизненно важную роль.Здесь на первый план выходит типографика, а также форматирование. Разные шрифты вызывают разные эмоции в нашем сознании, поэтому важно выбрать правильный шрифт.
  Хотя электронные письма не имеют широкой поддержки пользовательских веб-шрифтов, есть разные способы их реализации. Ознакомьтесь с обширной инфографикой о Типографика в электронных письмах >>
  
• Цвета : Как и в типографике, разные цвета также передают разные эмоции.Цвета фона, цвет кнопки CTA, цвета гиперссылок, а также изображения являются частью руководства по бренду и определяют индивидуальность электронной почты.
• Изображения и визуальные средства массовой информации : Изображение говорит тысячу слов. Уравновешивая текст и визуальные эффекты в своем электронном письме, вы поощряете большее взаимодействие со своими подписчиками, поскольку электронное сообщение не теряется за стеной слов. Это особенно важно для индустрии онлайн-торговли и электронной коммерции, где изображение продукта дополняет описание.
• Кнопка CTA : точка, которая измеряет, насколько эффективной была ваша копия электронного письма, то есть кнопка CTA — это то, что завершает дизайн вашего шаблона электронного письма. Хотя копия электронной почты не может полностью передать ваше сообщение, кнопка CTA перенаправляет подписчика на соответствующую целевую страницу, и ее нельзя упускать при создании электронного письма.

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

ПОЧЕМУ СЛЕДУЕТ СЛЕДОВАТЬ РЕКОМЕНДАЦИЯМ БРЕНДА?

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

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

Почему реализация визуальной иерархии может помочь в конверсиях?

У каждой создаваемой кампании есть цель, и вы должны убедиться, что ваш подписчик ее не пропустил. Таким образом, есть определенные элементы, которые ДОЛЖНЫ привлекать внимание подписчиков, когда они открывают письмо.Вот почему важно с самого начала создавать визуальную иерархию в электронной почте. Большинство дизайнеров электронной почты визуализируют перевернутый треугольник при разработке электронного письма (как показано ниже) и размещают наиболее важную информацию, такую ​​как объявление о продаже, изображения героев, кнопки CTA, кнопки навигации и т. Д. Таким образом, чтобы руководствоваться взглядом подписчиков. от широкого пути в начале, заканчивая точкой, которая является центром или фокусом — кнопка CTA.

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

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

1. Изображение героя — стоковое фото или иллюстрация

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

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

Прочтите этот блог, чтобы получить более подробную информацию о добавлении визуальной иерархии (главных изображений) в электронную почту.

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

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

2. Размещение кнопки CTA

Это очень важно. Как было сказано ранее, кнопка CTA является свидетельством того, насколько хорошо электронная почта смогла превратить ваших подписчиков в клиентов. Из-за этого размещение кнопки CTA является аргументом, который обсуждается уже давно.Большинство маркетологов верят в то, что ни один подписчик не захочет щелкнуть кнопку CTA, не узнав больше из электронного письма. Однако в этом есть недостаток — есть вероятность того, что меньше людей будут склонны прокручивать назад, чтобы щелкнуть призыв к действию, и снизить рейтинг кликов, если в нижней части электронного письма нет вторичной кнопки призыв к действию. Итак, убедитесь, что ваш CTA размещен правильно. Вы также можете провести A / B-тест.

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

Мы советуем, если ваше письмо длиннее двух полос прокрутки, рекомендуется добавить еще одну кнопку CTA внизу письма.

КАКОВЫ КЛЮЧЕВЫЕ АСПЕКТЫ, КОТОРЫЕ СЛЕДУЕТ УЧИТАТЬ ПРИ СОЗДАНИИ ЭЛЕКТРОННОЙ ПОЧТЫ?

ДИЗАЙН ОТВЕТСТВЕННОЙ ПОЧТЫ

Примерно 34% электронных писем открываются на мобильных устройствах и на различных доступных на рынке устройствах с разным размером экрана. Таким образом, очень важно, чтобы ваши электронные письма безупречно отображались на всех устройствах ваших подписчиков.Из-за этого большинство маркетологов электронной почты предпочитают подход «сначала мобильные» при разработке электронной почты.

Подход, ориентированный на мобильные устройства, означает создание макета с одним столбцом шириной 600 пикселей и настройку элементов в макете с двумя столбцами для представления на рабочем столе (только при необходимости). Кроме того, адаптивный дизайн электронной почты влияет на следующие факторы:

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

Современные тенденции в дизайне электронной почты

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

• Цветовой кроссовер (градиентные фоны): Один из самых популярных веб-дизайнов, градиентный фон, был омрачен введением плоского / материального дизайна в начале 2013 года. Как и феникс, градиентные фоны широко возвращаются дизайнерами и такие бренды, как Harry’s и American Eagle Outfitters , используют в своих электронных письмах градиенты двух контрастирующих цветов.

---

---

• Иллюстраций: Еще один фаворит среди большинства дизайнеров электронной почты, когда количество писем с иллюстрациями резко упало. Иллюстрация в электронном письме дает ощущение бренда, имеющего веселый тон, но при этом не умаляет бизнес-целей. Такие бренды, как Email Uplers и Anthropologie , рассылали электронные письма с иллюстрацией.

---

---

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

СОЗДАНИЕ БЕЗУПРЕЧНОГО ДИЗАЙНА МЕЖДУ ЭЛЕКТРОННОЙ ПОЧТОЙ И ЦЕЛЕВОЙ СТРАНИЦЕЙ

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

Как видите, J. Hilburn имеет бесшовное оформление между электронной почтой и целевой страницей.

---

Связанная целевая страница

Как закодировать шаблон электронной почты?

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

Наиболее часто используемые теги

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

HTML-тег	Описание
	Любое руководство по стилю или медиа-запрос помещается в заголовок. Этот раздел не виден конечному пользователю.
	Это плоть вашего электронного письма, и все, что здесь размещено, видно подписчику.
<таблица>	Используется для создания таблицы
Создает строку в таблице
		Создает ячейку в строке
	Используется для гиперссылки на все, что находится между
	Указывает, какое изображение должно быть встроено из источника
, , ,…	Заголовочные теги для указания форматирования
	Все, что здесь размещено, будет отображаться как обычный текст
	Создает упорядоченный / нумерованный список
	Создает неупорядоченный / маркированный список
	Добавляет элемент списка
	Реализует стиль текста в соответствии с указанной таблицей стилей

Обходные пути для различных почтовых клиентов

Простое электронное письмо без особых наворотов без особых проблем будет отображаться во всех почтовых клиентах.Тем не менее, важно позаботиться о рендеринге и обходных путях для 3 основных почтовых клиентов:

• Apple Mail
• Gmail
  • Адаптивный дизайн
  • Несовместимость у пользователей с идентификатором не Gmail
  • Материальный дизайн — это ошибка дизайна электронной почты
• Outlook
  • Фоновое изображение поддерживает
  • Маркированный список
  • Масштабирование DPI
  • Ненужный интервал

КАКОВЫ РАСПРОСТРАНЕННЫЕ ПРОБЛЕМЫ?

VS

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

.

В то время как почтовые клиенты, такие как Apple Mail, iOS mail, Gmail и Yahoo, поддерживают тег

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

. Каждый раздел

может быть вложен в отдельный

, но это увеличит вес кода. При превышении лимита в 120 КБ Gmail будет обрезать вашу электронную почту >> КОДИРОВКА ДЛЯ МАКСИМАЛЬНОЙ СОВМЕСТИМОСТИ ИЛИ ВЫБОРОЧНЫХ КЛИЕНТОВ ЭЛЕКТРОННОЙ ПОЧТЫ? Различные почтовые клиенты используют разные механизмы визуализации для отображения электронной почты. Таким образом, есть вероятность, что некоторые из ваших подписчиков электронной почты не смогут увидеть электронное письмо так, как вы его визуализировали. «Просмотр в Интернете» поможет подписчикам увидеть исходное электронное письмо, но при этом требуется больше кликов, и это может быть бесполезно с точки зрения конверсии. В такой момент вам нужно взвесить все за и против и закодировать электронную почту для максимальной совместимости. Если вы включаете интерактивный элемент в свое электронное письмо, рекомендуется добавить резервную поддержку , но это ограничит ваше творчество. В качестве альтернативы вы также можете сегментировать свой список рассылки на основе почтовых клиентов и, в частности, отправлять электронное письмо только тем подписчикам, у которых есть поддерживающие почтовые клиенты. Что-то о CSS INLINING Разработчики веб-страниц указывают таблицы стилей либо в разделе, либо связывая его с внешней таблицей стилей.Разработчики электронной почты не имеют такой свободы и вынуждены встраивать их. Это увеличивает общий объем кода, но снижает общую скорость загрузки электронного письма. Какие инструменты использовать для тестирования шаблона электронной почты Шаблон электронного письма, не прошедший строгого контроля качества или тестирования, является рецептом для быстрого сокращения количества подписчиков, а также признаком неопытного почтового маркетолога. Uplers предоставляет шаблоны электронной почты с ручным кодированием, которые протестированы на более чем 40 почтовых клиентах.Тем не менее, если вы вносите какие-либо изменения, рекомендуется протестировать шаблоны электронной почты после того, как разработчик электронной почты отправит их. Отображение шаблона электронной почты проверка HTML CSS встраивание Litmus Builder CSS-инлайнер от Campaign Monitor CSS-инлайнер от HTMLemail.io Доступность (обсуждается позже) IA Toolkit Инструменты разработчика специальных возможностей Google Инструмент волны Создание доступной электронной почты Доступность в электронной почте была популярной темой, и все подчеркивали ее важность.Создание доступности означает соблюдение определенных правил и определенных ограничений при разработке и кодировании электронной почты. Ознакомьтесь с этой проницательной инфографикой о доступности электронной почты , созданной Uplers в сотрудничестве с энтузиастом специальных возможностей Полом Эйри. Следование этим рекомендациям упрощает доступ к электронной почте для более чем миллиарда человек по всему миру, так или иначе борющихся с инвалидностью, а также упрощает понимание электронной почты для остальных ваших подписчиков.Более того, это значительно улучшит конверсионный потенциал вашего существующего списка рассылки. 4 вещи, которые следует учитывать при кодировании Используйте семантический код : люди полагаются на программу чтения с экрана для «чтения» электронных писем. Используя соответствующий семантический код для заголовка и абзацев , программы чтения с экрана могут различать их и сделать чтение электронной почты приятным занятием. Добавьте соответствующий заголовок : Добавление заголовка в ваши электронные письма может дублировать текст предзаголовка, а также помочь вашему подписчику по электронной почте получить некоторый контекст, когда он полагается на программы чтения с экрана. Использовать таблицы в качестве представления : добавив role = ”Presentation” к каждой таблице, программа чтения с экрана будет читать содержимое тела вашего сообщения электронной почты вместо каждой ячейки. Разместите достаточно белого пространства : Whitespace — лучший друг любого, кто собирается читать вашу электронную почту на устройстве, которое держится на расстоянии вытянутой руки, в то время как его окружают люди в переполненном метро. Пробел обеспечивает передышку между различными элементами вашего электронного письма и помогает подписчику просмотреть всю копию электронного письма. Каких распространенных ошибок следует избегать в шаблоне электронной почты? Баланс между продвижением и решением проблем : Согласно входящему маркетингу, ваши клиенты должны обращаться к вашему бренду, а не наоборот. Поэтому, когда они подписываются на ваш бренд, они верят, что ваши продукты / услуги решат их проблемы. Некоторые маркетологи склонны опускать черту и начинать продвигать свои предложения, в то время как аспект решения проблем остается на втором плане. Решение : Шаблоны транзакционных писем всегда должны быть на 80% транзакционными и на 20% рекламными. Точно так же при создании шаблона электронной почты для автоматизации привлечения потенциальных клиентов основное внимание необходимо уделять обучению подписчика. Одно изображение email: Эту ошибку совершает большинство маркетологов электронной почты. Почтовые клиенты по умолчанию отключают изображения, и если ваша копия электронной почты представляет собой текст, включенный в изображение, есть большая вероятность, что он может быть скрыт.Еще хуже, когда маркетологи не добавляют замещающий текст к изображению. Решение : Не размещайте свое сообщение электронной почты на одном изображении и всегда добавляйте соответствующий замещающий текст к изображениям электронной почты. Неразборчивая копия электронного письма: Пользовательские шрифты выглядят круто, но теряют очарование, если они не могут передать сообщение в вашем электронном письме. Некоторые шрифты выглядят хорошо при использовании в заголовке и становятся неразборчивыми при использовании в абзаце текста.Кроме того, важно предоставить пробелы, добавив правильный межстрочный интервал между словами в абзаце и соответствующую длину строки. Нижний колонтитул, не совместимый с CAN-SPAM: Согласно закону CAN-SPAM 2009, любой бренд, рассылающий маркетинговые или коммерческие электронные письма, должен включать определенную информацию в нижний колонтитул, чтобы соответствовать закону CAN-SPAM. С точки зрения шаблона электронного письма, электронное письмо должно включать действительный физический адрес бренда, ссылку для отказа от подписки в конце i.е. нижний колонтитул электронного письма, чтобы избежать серьезных штрафов. Вводящая в заблуждение копия электронного письма: Точно так же маркетологи должны держаться подальше от вводящей в заблуждение копии электронного письма, поскольку это только поможет вам набрать несколько кликов, но это будет дорого стоить вам, поскольку ваши подписчики могут почувствовать себя обманутыми, и это приведет к отказу от подписки. Интернет-провайдеры отслеживают эти отказы от подписки и могут пометить ваш адрес электронной почты как спам и всегда снижать доставляемость электронной почты — отправляя ее в СПАМ. Кроме того, некоторые методы оформления электронного письма могут привести к тому, что ваше письмо будет помечено как СПАМ.Держитесь подальше, узнав о , как дизайн электронной почты может запускать ловушки для спама и как этого избежать. Не A / B-тестирование: Самая большая ошибка новичков, которую совершают большинство маркетологов электронной почты, — это уверенность в том, что они точно знают, что нужно / что ищут их подписчики. К несчастью для них, времена меняются, вкусы меняются со временем. Итак, рекомендуется выполнить A / B-тестирование ваших шаблонов электронной почты, чтобы проверить, что работает, а что можно улучшить. Шаблоны электронной почты — неотъемлемая часть вашей маркетинговой стратегии электронной почты. Понимание того, что скрывается за созданием шаблонов электронной почты, может помочь вам создать лучшие шаблоны электронной почты. Мы задавали экспертам разные вопросы относительно того, что они думают о шаблонах электронной почты, и вот что они должны были ответить. Хотите поделиться своим опытом работы с шаблонами электронной почты? Помогите нам , ответив на несколько вопросов здесь и получите шанс стать участником. Создайте лучший дизайн на 2021 год Каролина Петрашкене Менеджер по контент-маркетингу Время чтения: 12 минут. Каждый день мы получаем множество писем: длинных, коротких, красивых и некрасивых.К какой категории относятся ваши электронные письма? Когда электронное письмо попадает в ваш профессиональный почтовый ящик и касается вопросов, связанных с работой, обычно вы не ожидаете, что оно будет эстетичным. Это простые текстовые электронные письма с важными вещами. Для них быть красивым не является критерием. Однако, если вы открываете рекламный бюллетень, он должен быть хорошо оформлен, иначе это будет раздражать глаза. И давайте будем честными, с некоторыми электронными письмами такое бывает. И давайте не будем забывать о главной роли рекламных писем, которая «способствует достижению результатов.«Ни один бренд не хочет, чтобы электронные письма были только красивыми. Им нужны электронные письма, которые будут привлекать их клиентов, привлекать трафик и привлекать аудиторию. И это, вероятно, основная причина, по которой вам следует уделять пристальное внимание при разработке и планировании информационного бюллетеня. Итак, что вы должны делать, чтобы создавать убедительные сообщения, не теряя эстетической привлекательности дизайна электронной рассылки? Продолжайте читать, чтобы узнать, как разработать информационный бюллетень, каковы его основные элементы, основные принципы разработки информационного бюллетеня и тенденции на 2021 год. 1. Что такое дизайн электронной рассылки? Дизайн информационного бюллетеня электронной почты — это совокупность текстовых и визуальных компонентов вашего сообщения электронной почты. Начиная с лучшей темы и макета информационного бюллетеня, заканчивая логотипом вашего бренда, шрифтами и подходящим интервалом. Все эти элементы имеют значение, когда мы говорим о красивом и эффективном дизайне электронной почты. Основные компоненты, которые имеют значение В идеале дизайн вашего электронного письма должен служить основной цели вашего письма.Вот некоторые из самых популярных вещей, которые компании ищут в своих сообщениях электронной почты: Сообщите о распродаже и выделите предложение (все взгляды на центральную фигуру — яркое рекламное предложение) Представьте новые коллекции со списком новоприбывших Повысьте заинтересованность клиентов, рассказав историю бренда, выразив признательность, представив лояльность программы и социальные мероприятия. Предоставьте необходимую информацию (в основном транзакционные электронные письма) Определение цели поможет вам определить направление дизайна электронного письма.Это основные конструктивные переменные, которые вы можете соответствующим образом изменить: Просмотр в ленте входящих сообщений: имя отправителя, строка темы и предзаголовок сообщения электронной почты Макет электронной почты Логотип вашего бренда Кнопки с призывом к действию Изображения и цвета Копия и шрифты Интервал Справочная информация по электронной почте Электронная почта и целостность дизайна вашего бренда Итак, как вы можете заставить их работать вместе? 2.12 советов по созданию красивого, но эффективного дизайна электронной рассылки Принимая во внимание огромную конкурентную борьбу в почтовом ящике вашего клиента, дизайн электронного бюллетеня должен с первого взгляда привлекать внимание клиента, чтобы его не удалили и никогда больше не видели. Более того, то, как вы разрабатываете свои почтовые кампании, будет влиять на ваш рейтинг кликов, а также на продажи. Следуйте этим рекомендациям при создании информационных бюллетеней и наслаждайтесь красивыми, но эффективными маркетинговыми кампаниями по электронной почте! 1.Будьте в соответствии со своим брендом Солидный стиль бренда означает, что ваши каналы в социальных сетях, веб-сайт, электронная почта и другие средства коммуникации содержат одинаковые или согласованные шрифты, элементы дизайна, цвета, тон голоса и т. Д. Профессиональные маркетинговые агентства называют это «брендбуком». Если вы будете соответствовать своему стилю бренда, вашим клиентам будет легче идентифицировать вас и укрепить лояльность. В частности, при общении по электронной почте клиенты хотят точно знать, кто к ним обращается, и доверяют только тем письмам, которые кажутся знакомыми. Согласованность также применима к имени отправителя и строкам темы. Вы можете проверить, что работает лучше, но не изменяйте голосу своего бренда. Например, вы можете подумать об использовании забавных или игривых смайликов в теме письма, если они подходят вашему бренду. Посмотрите, как AWAY сохраняет солидный фирменный стиль. Целостность бренда «на выезде» Однако, если вы считаете, что инвестировать в профессиональную версию брендбука слишком сложно для вашего бизнеса, создайте простое руководство по стилю бренда и следуйте ему при создании электронных писем, сообщений для социальных сетей, листовок и других материалов.Составьте список шрифтов, которые уже использовались на вашем веб-сайте, вплоть до цветового кода вашего бренда, и включите любые варианты логотипа, которые могут быть использованы в материалах вашей компании. Поверьте, это поможет вам сохранить постоянство цифрового внешнего вида вашего бренда. 2. Сохраняйте простоту макета: лучше меньше — лучше Тип контента, который вы хотите включить в свой информационный бюллетень, будет определять общий макет. Макет с одним столбцом лучше всего подходит для более сфокусированных сообщений; например, последнее напоминание о распродаже в Черную пятницу. Но многоколоночный макет лучше для отображения разнообразного контента; например, предметы из новой коллекции. Так или иначе, макет вашего электронного письма должен быть удобен для мобильных устройств. Говоря это, я имею в виду и то, и другое: скорость отклика электронной почты, а также размер / длину рассылки для чтения на мобильном телефоне. При создании своей почтовой кампании представьте, что это таблица со столбцами и строками, и подумайте, как они будут двигаться, реагируя на экран разных размеров. Помните, что: Только простые макеты, содержащие до трех столбцов, будут хорошо смотреться на мобильных устройствах. Не используйте слишком много контента, потому что в мобильной версии все изображения и другие блоки контента будут сжиматься в один узкий столбец, и ваш информационный бюллетень будет бесконечным. Это никому не нравится. Если в вашем информационном бюллетене выделяются различные типы контента, четко определите разделы, используя правильный интервал и линии. Учитывайте выравнивание четко определенных секций и симметрию, чтобы избежать визуального шума. Одна из наиболее частых ошибок — это добавление описаний продуктов разной длины. Убедитесь, что они занимают одинаковое количество линий, чтобы избежать беспорядка в дизайне. 3. Используйте высококачественную визуализацию Качество логотипа вашей компании, а также изображений, которые вы используете в электронной переписке, имеет решающее значение. Они имеют огромное влияние на визуальную привлекательность дизайна вашего информационного бюллетеня и имеют прямое влияние на коэффициент конверсии. Подумайте об этом: при совершении покупок в Интернете только изображение и описание убеждают клиента нажать кнопку «КУПИТЬ». Так что не забудьте изучить основы: Ваш логотип хорошего качества с прозрачным фоном. Если вы хотите выглядеть профессионально, у вас должен быть логотип компании хорошего качества. Если вы используете список товаров, используйте изображения того же размера и стиля. Они не могут быть размытыми, слишком темными или разных размеров. Кроме того, вы можете использовать фильтры для выравнивания всех изображений и получения связного результата. В Omnisend вы можете найти встроенный редактор изображений, который поможет вам корректировать изображения при создании дизайна электронной почты. Быстрые советы, чтобы ваша электронная почта выглядела хорошо: СОВЕТ № 1: Мы видим, что электронные письма с изображением «героя» с ключевым сообщением всегда выглядят наиболее привлекательно. Убедитесь, что основное сообщение находится в верхней части страницы. СОВЕТ № 2: Подумайте о том, чтобы сделать несколько фотосессий с людьми, которые носят / используют вашу продукцию. Согласно семиотическим исследованиям, для маркетинговых целей изображения, содержащие людей, работают лучше, чем изображения с объектами, пейзажами и т. Д. СОВЕТ № 3: При использовании фотографий попробуйте уменьшить цвет в окружающем дизайне, чтобы сделать изображения в центре внимания. СОВЕТ № 4: Рассмотрите возможность использования типографики для «главной» части электронного письма. Он может очень хорошо заменить образ или дополнить его. Кстати, 3D-типографика — один из самых трендовых элементов в этом году. СОВЕТ № 5: Всегда ищите вдохновение в разных галереях писем. В этом нет ничего плохого. Вы найдете замечательные идеи и цветовые схемы, которые сможете воплотить в жизнь и получить отличные результаты. 4. Выделите кнопку с призывом к действию Если вы отправляете своим клиентам рекламное письмо, вы хотите, чтобы они что-то сделали. Это призыв к действию (CTA). Покажите это ясно. Попросите их сделать что-нибудь: посетить ваш магазин, прочитать больше, подписаться на вас в социальных сетях и т. Д. Для этого вы можете связывать изображения, кнопки или текстовые строки. Используйте то, что соответствует вашей цели. Но имейте в виду следующее: Люди чаще нажимают кнопки или изображения, а не текстовые ссылки. CTA должен быть лаконичным. Используйте активный язык, например купите сейчас, получите свое и т. д. В вашем письме не должно быть слишком много кнопок с призывом к действию. В идеале, самый крупный призыв к действию должен быть для ключевого сообщения, а еще несколько — для блоков сопутствующего контента. Первая кнопка CTA должна быть над сгибом, чтобы читатели могли видеть ее, когда открывают письмо. Сделайте кнопки заметными, используя другой цвет, и не забудьте оставить немного места вокруг кнопки, чтобы она точно выделялась. Если ваше электронное письмо более обширное, повторите свой призыв к действию в конце письма. Не заставляйте читателя возвращаться к началу информационного бюллетеня. 5. Сделайте электронное письмо, которое будет легко сканировать Многие исследования показали, что люди не читают каждое слово электронного письма от начала до конца. Они сканируют контент, начиная с верхнего левого угла, и останавливаются на строках темы и изображениях. Только тогда, если жирный текст или изображения привлекут их внимание, они прочтут остальное.Это так называемая модель чтения «F», описанная Якобом Нильсеном. Исследование Nielsen показало, что пользователи Интернета пропускают текст, написанный строчными буквами, что приводит к F-образному рисунку чтения. Соответствующие слова и изображения в левой части экрана, как правило, привлекают больше внимания, чем вещи в правой части, поэтому подумайте о размещении ключевых слов в левой части электронного письма. Также, если вы используете текст с изображениями, поместите изображения слева, чтобы привлечь больше внимания. Добавление заголовков и интервалов вокруг них также помогает выстроить визуальную иерархию и привлечь внимание покупателей к продуктам, которые вам нужны больше всего. См. Пример Pelican Coolers: дизайн письма ведет читателя к основному тексту и призыву к действию. 6. Начните прямо с заголовка сообщения электронной почты Самый распространенный и лучший метод при создании дизайна информационного бюллетеня электронной почты — это размещение логотипа вашего бренда в верхней части электронного письма. Это место замечают сразу после того, как подписчик открывает ваше сообщение. Существует множество инструментов дизайна, которые могут сделать дизайн заголовка информационного бюллетеня более доступным и сэкономить ваше время, и одним из хороших примеров является Bannersnack. Эта часть электронного письма и нижний колонтитул (который мы обсудим позже) должны быть наиболее стабильными и последовательными частями ваших электронных сообщений. Они похожи на вашу подпись, необходимое условие вашей надежности как бренда. Следующие компоненты в заголовке могут отличаться. У некоторых брендов есть строка меню, у других — небольшие, не слишком навязчивые строки с информацией о доставке или бесплатном возврате (зависит от того, что вы можете предложить). Также есть место для социальных иконок. Вы можете попробовать включить их все или перемешать. В настоящее время популярные бренды DTC кажутся минималистичными и используют очень мало элементов рядом с логотипом. Это выделяет логотип. 1. Brooklinen 2. Сойлент 7. Завершить справа с нижним колонтитулом электронной почты Обычно нижние колонтитулы в электронных письмах больше функциональны, чем красивы. Рекламные информационные бюллетени должны содержать юридическую информацию и кнопку «Отписаться». Кроме того, бренды включают ссылки на Условия использования, Политику конфиденциальности и возврата, Часто задаваемые вопросы и т. Д. Обычно эта информация сжато упакована в нижний колонтитул электронной почты и не беспокоит подписчиков, если они ее не ищут. Но это не значит, что вы не можете думать об эстетике этой части. Посмотрите несколько отличных примеров, которые могут вдохновить вас на создание красивого, но функционального нижнего колонтитула для ваших писем. Минималистичные нижние колонтитулы, такие как Harry’s и Ritology, или расширенные, как Bellroy и Stitch Fix, имеют. 1. Гарри 2.Ритология 3. Беллрой 4. Исправление стежка 8. Оптимизируйте свой информационный бюллетень для блокировки изображений (применимо для электронных писем B2B) Почти в каждом крупном почтовом клиенте по умолчанию включены изображения, особенно сейчас, когда большинство писем открывается на мобильных устройствах. Поэтому, если ваша аудитория использует Gmail, Yahoo и другие ведущие почтовые клиенты, вам не нужно сильно беспокоиться об изображениях в своих письмах. Однако в некоторых бизнес-клиентах электронной почты (в основном применимых для делового общения B2B) изображения по умолчанию отключены, и их внутренняя фильтрация спама может не подходить для всех электронных писем с изображениями. Чтобы избежать этого, вы должны использовать такие методы проектирования, как текст ALT, который можно увидеть, вместо заблокированных изображений, пуленепробиваемые кнопки (об этом позаботится Omnisend) и правильный баланс изображений и текста для устранения блокировки изображений. В Omnisend мы предлагаем такое соотношение: 40% визуальных элементов и 60% текста. 9. Используйте правильные шрифты Под правильным я подразумеваю размер и безопасный для электронной почты тип шрифта. Оптимальный размер текста для тела письма — 14-16 пикселей.Текст размером 14 пикселей лучше подходит для более длинных абзацев и 16 пикселей для одного или двух предложений. Заголовки должны быть больше — в пределах 22-42 пикселей. В электронном письме содержится список шрифтов, которые считаются безопасными для использования. Это означает, что, используя их, все ваши подписчики из разных почтовых клиентов будут видеть ваш текст одинаково. Самыми популярными шрифтами, безопасными для электронной почты, являются Arial, Verdana, Helvetica, Georgia, Tahoma, Lucida, Trebuchet и Times. Вы можете узнать больше о шрифтах в моей предыдущей статье Email Safe Fonts vs.Пользовательские шрифты: что о них нужно знать. Ниже вы можете найти полную таблицу шрифтов, поддерживаемых Omnisend, с исчерпывающим списком резервных шрифтов, чтобы вы знали, чего ожидать. 10. Осторожно используйте фоновые изображения В поисках вдохновения для дизайна электронной почты вы найдете множество красивых писем с тематическим фоном. Действительно, они выглядят модно и шикарно. Но имейте в виду, что не все пользователи смогут видеть фон информационного бюллетеня так, как вы хотите. Начиная с версии 2007 года Outlook не поддерживает фоновые изображения. То же самое и с некоторыми другими крупными почтовыми клиентами. Чтобы избежать неудобных метаморфоз в дизайне, всегда используйте сплошной цвет фона в качестве запасного варианта и убедитесь, что важная информация или изображения отсутствуют только в фоновом изображении. 11. Протестируйте перед отправкой Не забудьте отправить тестовое письмо на свой почтовый ящик. Откройте его на десктопе и мобильном телефоне. Более 50% всех клиентов открывают электронные письма на своих мобильных устройствах, поэтому крайне важно, чтобы электронные письма хорошо смотрелись на маленьком экране.Пользователи Omnisend могут использовать предварительный просмотр электронной почты на настольных и мобильных устройствах в редакторе кампании. Не забудьте проверить! 3. Самые яркие тенденции дизайна электронной почты на 2021 год Как и все остальное, тенденции дизайна электронной почты с годами входят и выходят из моды. Ваше сообщение может выглядеть классическим, но в то же время в нем слишком много традиционного, что может привести к потере заинтересованности. Иногда небольшие изменения могут исправить это, и ваша электронная почта снова будет выглядеть великолепно.Итак, какие последние тенденции в электронной почте вы должны учитывать при разработке своих писем? 1. Интерактивные элементы и геймификация Интерактивные элементы в электронной почте повышают вовлеченность клиентов. Это факт. Видео, движущиеся изображения .gif, новые технологии, такие как изображения APNG и динамический контент AMP, — все это чрезвычайно модно в 2021 году. В начале 2019 года Gmail представила функциональность AMP (динамическое содержимое) для повышения интерактивности электронных писем.Некоторые поставщики услуг электронной почты уже приняли его и позволяют своим клиентам включать карусели, галереи изображений и функции добавления в корзину в свои электронные письма. К сожалению, Apple Mail / iPhone / iPad OS пока не поддерживает эту функцию. Таким образом, значительная часть аудитории электронной коммерции по-прежнему не может получить такой пользовательский интерфейс. Однако шаг за шагом мы приближаемся к этому, и 2021 год может стать годом интерактивности. В Omnisend вы можете найти несколько интерактивных элементов (скретч-карту и подарочную коробку), которые отличаются по своей природе.У них есть два больших преимущества: Полная поддержка почтовыми клиентами. Мощность, чтобы удвоить, а иногда даже утроить частоту кликов. 2. Яркие цвета по сравнению с минималистичным «чистым» дизайном Этот год по-прежнему благоприятен для минималистичного дизайна. Вы не ошибетесь, выбрав простые линии, большое количество интервалов и шрифты без засечек. Однако смелые дизайнерские решения и яркие цвета только начали действовать. Темный фон, контрастные цвета все чаще используются для привлечения внимания к основному призыву к действию. 3. 3D и футуристические иллюстрации В прошлом году многие модные бренды использовали мотивы 90-х. В 2021 году мы увидим угасание этой тенденции и появление новых. Все больше и больше брендов используют футуристические мотивы и 3D-эффекты. Вы можете определенно опробовать их для некоторых случайных кампаний по электронной почте и посмотреть, как ваша аудитория принимает эту новую тенденцию. Перейдите по ссылке, чтобы узнать больше о грядущих тенденциях в области дизайна электронной почты. 4. Полный перечень эффективных элементов дизайна информационного бюллетеня Существует множество различных дизайнов информационных бюллетеней по электронной почте, которые вы можете протестировать в своем магазине, и вы можете использовать рекомендации как ориентир для включения лучших элементов.Следуя приведенным выше правилам и советам для рассылки, вы улучшите дизайн электронной почты, а также улучшите конверсию. Вот удобный контрольный список, который можно использовать при следующем информационном бюллетене: Логотип выглядит на высшем уровне. 👌 Главное сообщение броское и энергичное. 💪 Призыв к действию является действующим. 🎬 Все изображения выглядят резкими, не размытыми и не растянутыми. ✨ Все заголовки одинакового размера и одинаковые. 🧐 Интервалы и форматирование электронной почты согласованы.🧐 Все изображения, заголовки продуктов и кнопки имеют гиперссылки и ведут на ваш сайт. 🎯 Социальные иконки на месте. 😎 Юридический приговор, физический адрес компании, а также кнопка отказа от подписки находятся в нижнем колонтитуле. ⚖️ На ваш почтовый ящик отправлено тестовое письмо ✅ Запустите 14-дневную пробную версию Omnisend и откройте для себя готовые шаблоны информационных бюллетеней Omnisend для ваших почтовых кампаний. Начать бесплатную пробную версию 12 советов по дизайну информационных бюллетеней, которые повысят результаты электронного маркетинга Появление и продолжающийся рост маркетинга в социальных сетях заставило многие организации вложить всю свою энергию в эти развивающиеся платформы, а для некоторых маркетинг электронной почты стал второстепенным. Но знаете ли вы, что 72% людей предпочитают получать рекламную информацию по электронной почте, по сравнению с 17%, которые предпочитают социальные сети, по данным MarketingSherpa. Если вы перешли от электронного маркетинга к строгому использованию социальных сетей, возможно, вы захотите пересмотреть эту стратегию. Не все зарегистрированы в Facebook, Twitter и Instagram, но у КАЖДОГО есть адрес электронной почты. Поскольку так много предприятий и организаций ориентированы на каналы маркетинга в социальных сетях, вы также можете обнаружить, что конкуренция за ваше сообщение в почтовом ящике вашей аудитории меньше, чем в их новостной ленте Facebook. Это не означает, что вы можете просто отправить его по почте и ожидать хороших результатов. Сет Годин ввел термин «разрешительный маркетинг» в 1999 году в своей книге с тем же названием. Он определил это так: Чтобы максимально использовать эту уникальную привилегию, вот 12 советов по дизайну информационного бюллетеня, которые вы можете иметь в виду, чтобы создавать визуально привлекательные сообщения, которые ваша аудитория будет с нетерпением ждать прочтения и убережет вас от черного списка электронной почты. СВЯЗАННЫЙ: 3 шага к поиску уникального голоса бренда Если вы предпочитаете просмотр чтению, обязательно ознакомьтесь с видеоверсией этого сообщения в блоге: 1 Дизайн для мобильных устройств Исследовательский центр Pew Research Center сообщает, что впервые у большего числа людей есть смартфоны, чем настольные компьютеры или ноутбуки, и что люди проводят значительно больше времени за своими мобильными устройствами. Большинство платформ для дизайна электронной почты теперь поставляются с широким набором оптимизированных для мобильных устройств шаблонов информационных бюллетеней. Имеет смысл подумать о том, как макет будет отображаться на самом маленьком экране, который может использовать ваш подписчик, и начать с подхода, ориентированного на мобильные устройства. Дизайн с одной колонкой и немного более крупный шрифт — это безопасная ставка, чтобы люди могли легко просмотреть всю ширину вашего сообщения на любом смартфоне. Совет. Убедитесь, что ваш шаблон отправляет электронное письмо как в формате HTML, так и в виде обычного текста, на случай, если на устройстве пользователя разрешен только текст. 2 Используйте чистый и организованный макет Источник: Hatch Inc Держите вещи чистыми и простыми, чтобы не отвлекать внимание и удерживать внимание читателей от начала до конца. Может быть полезно начать с создания простого наброска общего макета информационного бюллетеня, используя шаблон информационного бюллетеня, а затем начать вставлять необходимые элементы содержимого по мере того, как вы улучшаете свой дизайн. Вот прекрасный пример того, как дизайн с одним столбцом может облегчить прокрутку на мобильных устройствах.Попробуйте также использовать шаблоны электронной почты HTML, чтобы по-настоящему усовершенствовать дизайн вашего информационного бюллетеня. Совет. Оцените и сравните несколько различных платформ электронного маркетинга. Существует множество вариантов, которые позволяют пользователям, не имеющим технических навыков, легко заполнять и настраивать визуально привлекательные шаблоны. 3 Делайте текст коротким и понятным Через Pinterest В связи с уменьшением объема внимания важно, чтобы вы тщательно продумали не только правильный контент, но и то, сколько различных тем вы хотите представить. Многие люди теперь получают различные информационные бюллетени по электронной почте почти каждый день недели. Подумайте о своем почтовом ящике и информационных бюллетенях, которые вы больше не читаете или на которые отписались. В чем была причина? Скорее всего, это произошло из-за того, что вы не считали информацию ценной на постоянной основе, электронное письмо было слишком сложно быстро сканировать и читать или его слишком часто отправляли. СВЯЗАННЫЙ: Как создать лучший корпоративный блог в 2017 году [Отчет об исследовании] Это рекламное письмо от Дж.Crew использует простой, но креативный макет, чтобы создать интригу и побудить пользователя нажать кнопку с призывом к действию для продвигаемой продажи. Совет: используйте тему для объединения контента и добавьте кнопку «Подробнее» при продвижении контента блога. 4 Создание визуальной иерархии Через действительно хорошие электронные письма Этот принцип дизайна требует создания ощущения того, что важно для читателя, за счет использования положения, размера, цвета, контраста и форм. С первого взгляда должно быть очень очевидно, какие элементы являются наиболее важными и на чем вы хотите, чтобы читатель сосредоточил внимание. Эффективное использование размера и цвета шрифта — самый простой и наиболее распространенный способ, которым дизайнеры могут создать ощущение важности в теле электронного письма. Источник: MailChimp Совет: используйте тест на прищур, чтобы получить высокоуровневое представление визуальной иерархии вашего дизайна. 5 Embrace White Space Через Pinterest Эффективное использование белого пространства позволяет мозгу сканировать, интерпретировать и разбивать элементы на легко усваиваемые части. Apple установила стандарт, которого пытались достичь многие бренды, когда дело доходит до эффективного использования белого пространства и четкой компоновки. Лучше меньше, да лучше. Дайте вашему контенту возможность дышать и повлиять на читателя. Любой красивый дизайн стратегически использует негативное пространство, чтобы выделить определенные части вашего контента. 6-кадровое содержимое с верхними и нижними колонтитулами Через действительно хорошие электронные письма Первые 2–3 дюйма в электронном письме — это наиболее важный объект, который нужно привлечь внимание читателя.В частности, заголовок — это ваша первая возможность произвести хорошее впечатление. Нижние колонтитулы могут быть не первым, что видит читатель, но они должны обеспечивать надежную визуальную окантовку заголовка информационного бюллетеня и помогать формировать внешний вид всего электронного письма. Вы можете использовать конструктор шаблонов электронной почты, чтобы получить правильный фрейм. Не забудьте включить значки социальных сетей, а также кнопку отказа от подписки и другие элементы, которые сделают ваше сообщение совместимым с CAN-SPAM. Stat: Согласно исследованию Nielsen Group, читатели могут быстро сканировать и обрабатывать информационные бюллетени в среднем за 51 секунду. 7 Настройте настроение с помощью цвета Было проведено множество исследований того, как разные цвета вызывают определенные чувства и эмоции. Будьте предельно внимательны при выборе цветовых схем, чтобы создать сообщение, которое находит отклик у ваших читателей. Итак, что означают разные цвета в маркетинге? А какие цвета привлекают покупателей к покупке? На западе существуют определенные культурные традиции, которые диктуют, какие цвета следует использовать для определенных сообщений.Например, черный цвет традиционно ассоциируется с роскошью и изысканностью, а синий часто ассоциируется с понятиями целостности и спокойствия. Очевидно, вы хотите использовать цветовую схему, которая дополняет и усиливает индивидуальность вашего бренда. Совет: создайте руководство по стилю, чтобы обеспечить непрерывность вашего сообщения на всех носителях. 8 Упростите выбор шрифтов Так много шрифтов, так мало времени. При поиске идеального шрифта среди тысяч доступных в Интернете легко стать парализованным из-за нерешительности. Дизайнер, ставший писателем Дэвид Кадави, проделал фантастическую работу по упрощению этой темы в кратком справочнике выше. Совет: используйте 22 пикселя для заголовков и 14 пикселей для основного текста, чтобы создать достаточный контраст. 9 Используйте потрясающие изображения Источник: Campaign Monitor Когда у вас ограниченное пространство для передачи сообщения, тщательно подобранное изображение может стать большим заявлением. В приведенном выше примере продукт находится в центре внимания, сопровождаемый фоновым изображением, которое создает ощущение приключений на открытом воздухе, которое, вероятно, найдет отклик у целевой аудитории. Только будьте осторожны, не злоупотребляйте изображениями и не выбирайте слишком большие изображения, так как они могут повысить вероятность того, что ваша электронная почта будет помечена как спам. Отдайте изображениям не более 30% доступной недвижимости. В некоторых случаях простое текстовое электронное письмо может быть самым прямым способом донести важное сообщение. Совет. Не забудьте добавить к изображениям текст ALT, если поставщик услуг электронной почты не отображает изображения по умолчанию. Или предоставьте также текстовую версию. 10 Встроить видео / гифки Источник: ModCloth GIF и видео в электронной почте используются все чаще и могут оказать значительное влияние, если все сделано правильно. В этом примере от ModCloth они творчески демонстрируют различные предметы одежды, которые являются частью целостного наряда. Но будьте осторожны, не переусердствуйте: используйте GIF-изображения, которые имеют отношение к вашему продукту или услуге, и убедитесь, что они не выглядят слишком «на вашем лице». 11 Информ с инфографикой Через действительно хорошие электронные письма Этот информационный бюллетень от PlateJoy является прекрасным примером сообщения электронной почты, которое хорошо составлено на всех уровнях, а также использует инфографику временной шкалы. Эта инфографика с одним ключевым моментом для каждого месяца в году дает читателю довольно много информации в очень понятной и приятной форме, в конечном итоге приводя к кнопке призыва к действию в конце. Совет: используйте бесплатные онлайн-инструменты для создания инфографики, такие как Visme, для создания собственной графики электронной почты. 12 Создайте убедительный призыв к действию Электронный маркетинг может создавать и укреплять узнаваемость бренда, но, в конце концов, вы хотите, чтобы читатель предпринял какое-то действие. Если вы реализовали принципиально надежный дизайн с использованием уже рассмотренных нами приемов, то, скорее всего, ваш читатель легко определит ваш призыв к действию. Этот пример демонстрирует, как с помощью модели перевернутой пирамиды можно создать воронкообразное путешествие, за которым легко следить, ведущее прямо к заметной кнопке с призывом к действию. Кроме того, вы можете использовать профессиональную подпись электронной почты в своих информационных бюллетенях, чтобы повысить вовлеченность клиентов. Подпись по электронной почте — это очень логичный способ завершить информационный бюллетень, указав вашу компанию и личные данные.Это делает вашу электронную почту более личной и дает вам возможность добавить больше CTA, таких как баннеры и кнопки социальных сетей. Вы также можете использовать такой инструмент, как Rebrandly URL Shortener, чтобы отслеживать, как работают ваши CTA. Совет: 70% электронных писем, посвященных бизнес-маркетингу, не имеют кнопки с призывом к действию. Убедитесь, что ваш CTA выделяется. Твоя очередь Что самое лучшее в электронном маркетинге для вашей организации? Вы и ваша команда на 100% контролируете каждый элемент сообщений, которые вы создаете для членов своей аудитории. Помните: они разрешили вам присылать им полезный и вдохновляющий контент. Не подведи их! Как сделать информационный бюллетень Создавайте собственные информационные бюллетени с помощью Adobe Spark. Для некоммерческих организаций и предприятий, больших и малых, хорошо продуманный информационный бюллетень является ключевым инструментом для укрепления авторитета, увеличения узнаваемости и поддержания связи с клиентами и сторонниками. Но вам не нужно разбивать бюджет, чтобы нанять дизайнера, который сделает информационный бюллетень для вашего бренда или бизнеса.С Adobe Spark вы можете создать информационный бюллетень за считанные минуты, даже если вы никогда раньше ничего не создавали. Создайте свой собственный информационный бюллетень Как сделать информационный бюллетень. Начни с вдохновения. Мы предлагаем вам тысячи профессионально разработанных шаблонов, чтобы вы никогда не начинали с чистого листа. Ищите по платформе, задаче, эстетике, настроению или цвету, чтобы вдохновение всегда было у вас под рукой. Когда вы найдете графику, с которой можно начать, просто коснитесь или щелкните, чтобы открыть документ в редакторе. Сделайте ремикс, чтобы сделать его своим. Существует множество способов персонализировать шаблоны информационных бюллетеней. Измените копию и шрифт. Добавляйте изображения к своим фотографиям или просматривайте тысячи бесплатных изображений прямо в Adobe Spark. Уделите столько времени, сколько захотите, чтобы сделать графику своим. В премиум-плане вы даже можете автоматически применять логотип, цвета и шрифты вашего бренда, так что вы всегда будете #onbrand. Поднимите чутье. С помощью эксклюзивных дизайнерских ресурсов Adobe Spark легко придать вашим проектам изюминку и индивидуальность.Добавляйте анимированные стикеры от GIPHY или применяйте текстовую анимацию для коротких графических видеороликов одним касанием. Мы позаботились обо всех скучных технических вещах, чтобы вы могли сосредоточиться на своем сообщении и стиле. Вы также можете добавить соавторов в свой проект, чтобы у вас было больше практических навыков, чтобы воплотить свой дизайн в жизнь. Измените размер, чтобы контент стал еще шире. Прошли те времена, когда приходилось запоминать размеры изображений для каждой отдельной платформы. Выбрав понравившийся дизайн, вы можете легко изменить его для любых печатных нужд или социальных сетей с помощью удобной функции автоматического магического изменения размера в Adobe Spark.Просто продублируйте проект, измените размер и выберите платформу, для которой вы хотите его адаптировать, а наш ИИ позаботится обо всем остальном. Бум. Контент для всех ваших каналов в кратчайшие сроки. Сохраните и поделитесь своим индивидуальным информационным бюллетенем. Когда ваш дизайн будет завершен, нажмите эту кнопку публикации. Мгновенно загрузите информационный бюллетень, чтобы отправить его на принтер или распечатать прямо дома. Поделитесь своим творением, загрузив его на свой веб-сайт, разместив в социальных сетях или отправив по электронной почте.Adobe Spark сохраняет ваши дизайны, поэтому вы всегда можете вернуться к своему проекту, если вам понадобится обновить его в будущем. Еще больше персонализируйте информационный бюллетень. Adobe Spark предоставляет вам ряд параметров настройки, чтобы вы могли создать что-то, что действительно отражает ваше сообщение. Adobe Spark дает вам все возможности творчества. Вы можете изменять размер текста, перемещать его по странице, добавлять фильтры со специальными эффектами, делать элементы прозрачными и изменять конфигурацию границ.Функция волшебного макета перемещает ваш текст, когда вы экспериментируете с разными макетами, поэтому вы всегда видите, как будет выглядеть ваш дизайн. Лучше всего то, что Adobe Spark можно использовать совершенно бесплатно. Позвольте Adobe Spark стать вашим экспертом в области дизайна информационных бюллетеней. Оттачивайте свои творческие способности с помощью Adobe Spark Post. Изучите профессионально разработанные шаблоны, которые заставят вас крутиться, или создайте информационный бюллетень с нуля. Создайте тему для своего дизайна, используя фотографии, значки, логотипы, персонализированные шрифты и другие настраиваемые элементы, чтобы они выглядели полностью аутентичными.Дублируйте дизайны и измените их размер, чтобы обеспечить единообразие для нескольких типов ресурсов. С Adobe Spark Post можно бесплатно и легко создавать, сохранять и делиться своими дизайнами за считанные минуты. Дополнительные примеры информационных бюллетеней Adobe Spark. 60+ бесплатных шаблонов информационных бюллетеней для привлечения подписчиков Откройте для себя более 60 бесплатных шаблонов информационных бюллетеней, которые помогут вам наладить отношения с подписчиками и увеличить продажи! Невозможно вести бизнес без клиентов.Но привлечь клиентов, особенно лояльных, может оказаться непростой задачей. Информационные бюллетени по электронной почте — один из лучших способов завоевать лояльность клиентов. Посылая постоянные электронные письма, которые представляют ценность, вы можете завоевать доверие и заставить своих подписчиков покупать. Теперь вы можете подумать: «Если это так просто, почему бы всем просто не начать рассылать информационные бюллетени по электронной почте и сразу же не достичь успеха?» Ответ — потому что это не так просто. Создание заинтересованной аудитории требует времени и усилий.Но вы можете получить преимущество, используя один из наших профессионально разработанных шаблонов в качестве основы для своих информационных бюллетеней. Ниже вы найдете некоторые из наших популярных шаблонов информационных бюллетеней для различных отраслей, которые готовы опробовать в вашем списке! Готовы начать отправку? С тарифным планом Sendinblue Free вы будете получать до 300 писем в день, неограниченное количество контактов и такие функции, как наш редактор перетаскивания, параметры персонализации и настраиваемые формы регистрации. Откройте мою бесплатную учетную запись Sendinblue сейчас >> Бесплатные шаблоны информационных бюллетеней для оживления вашего электронного маркетинга Конечно, не будет универсального шаблона информационного бюллетеня, подходящего для всех компаний. У разных организаций разные цели информационных бюллетеней. Итак, контент, призывы к действию (CTA) и даже дизайн тоже должны отличаться. Sendinblue имеет более 60 привлекательных HTML-шаблонов информационных бюллетеней для различных типов кампаний и предприятий.Вы можете получить доступ ко всем шаблонам на нашем бесплатном плане. Кроме того, вы получите другие удобные инструменты электронного маркетинга, чтобы добиться максимального успеха. Эти полностью отзывчивые шаблоны электронной почты помогут вам создавать информационные бюллетени, которые отлично смотрятся на всех устройствах — без навыков графического дизайна или программирования. Они идеально подходят для малых предприятий, которые хотят проводить профессиональные рассылки по электронной почте, экономя время и деньги. Вы можете легко настроить шаблоны под свой бренд с помощью нашего интуитивно понятного редактора перетаскивания .Затем, когда дизайн вашего информационного бюллетеня будет готов, посмотрите, как он будет выглядеть в различных почтовых клиентах, таких как Gmail и Outlook. Как использовать шаблоны Чтобы использовать наши бесплатные шаблоны информационных бюллетеней в своей учетной записи Sendinblue, выполните следующие простые шаги: Перейдите на вкладку « Кампании » и нажмите « Создать кампанию по электронной почте ». Заполните информацию «Настройка», включая название кампании и тему. Нажмите «Следующий шаг», чтобы перейти к этапу проектирования, затем выберите « Галерея шаблонов ». Выберите нужный шаблон, чтобы перейти к редактору перетаскивания. Настройте свой шаблон, например измените цветовую схему, добавьте текст и замените изображения. Дополнительная литература: Как создать информационный бюллетень от начала до конца Шаблоны информационных бюллетеней электронной коммерции Информационные бюллетени — жизненно важный элемент электронного маркетинга электронной коммерции. Вы можете использовать их, чтобы информировать свою аудиторию о новых предложениях и скидках или делиться другим полезным контентом. Цель состоит в том, чтобы держать клиентов в курсе и возвращать их, чтобы купить снова. Приведенные ниже бесплатные шаблоны информационных бюллетеней демонстрируют различные способы достижения этой цели и увеличения продаж в Интернете. Магазин бетонных коньков Этот первый шаблон информационного бюллетеня предназначен для вымышленного онлайн-магазина скейтбордов. Дизайн включает несколько классических элементов информационного бюллетеня электронной коммерции: Выделение сезонной распродажи: Одним из наиболее распространенных призывов к действию для предприятий электронной коммерции является сезонная распродажа.Вы можете адаптировать этот раздел к любой категориальной распродаже, которая побуждает покупателей просматривать ваш интернет-магазин. Реферальные программы: Реферальные программы для клиентов — отличный способ развития вашего бизнеса. Воспользуйтесь возможностью продвигать их в своем информационном бюллетене. Социальные сети CTA: Помимо продажи продукта, многие сайты электронной коммерции также продают образ жизни, связанный с их продуктами. Социальные сети могут сыграть большую роль в продвижении этого аспекта образа жизни вашего бренда.Так что разместите свои социальные ссылки в центре внимания, чтобы побудить клиентов подписаться на вас. Sekai Coffee Company Этот шаблон информационного бюллетеня электронной коммерции предназначен для поддельного интернет-магазина кофе. Он предлагает другой подход к привлечению клиентов: Рекомендуемые товары: Этот тип продвижения работает для магазинов с меньшим количеством товаров на складе или более сезонными товарами. Полезные статьи: Показ покупателям, как получить максимальную отдачу от ваших продуктов, поможет укрепить ваши отношения с ними между регулярными или краткосрочными покупками. Реферальная программа с бонусом за подписку: Этот шаблон также включает реферальную программу, но добавляет стимул, чтобы сделать ее более привлекательной. Это еще один хороший вариант для предприятий, которые хотят увеличить среднюю стоимость корзины или заказов в месяц. 👉 Чтобы открыть для себя другие шаблоны информационных бюллетеней для компаний электронной коммерции, создайте бесплатную учетную запись Sendinblue сегодня Шаблоны электронных рассылок для розничных магазинов Информационные бюллетени для обычных магазинов имеют много общего с информационными бюллетенями для предприятий электронной коммерции.Ключевое отличие — они нацелены на то, чтобы привлечь покупателей в магазин, а не на свой сайт. Магазины могут использовать электронный маркетинг, чтобы строить отношения с клиентами между посещениями и предлагать им стимулы к возвращению. В приведенном ниже шаблоне информационного бюллетеня представлена ​​формула для достижения этой цели. Ищете шаблоны на праздничную тему для продвижения сезонных предложений? Ознакомьтесь с бесплатными шаблонами праздничных писем Sendinblue. Они включают дизайн информационных бюллетеней для распродаж в Черную пятницу и Киберпонедельник, а также сезонные поздравления на Рождество и Новый год. Столы и стулья Этот шаблон включает несколько разделов для привлечения подписчиков на рассылку новостей в магазине, в том числе: Витрина новых товаров: Главный призыв к действию побуждает подписчиков изучить новую коллекцию. Добавьте свою собственную информацию о продукте и изображения, чтобы выделить отдельные элементы. Предложения в магазине: Раздел со специальными предложениями в магазине и заключительное эксклюзивное предложение подталкивают подписчиков к тому, чтобы они вернулись и захотели еще. Информация о магазине: Упростите жизнь покупателям, добавив полезные данные, такие как время работы, местоположение и номер телефона. 👉 Чтобы получить этот шаблон информационного бюллетеня и многое другое, зарегистрируйтесь и получите бесплатную учетную запись Sendinblue. Шаблоны информационных бюллетеней для блогов и СМИ Когда дело доходит до информационных бюллетеней для блогов и медиа-компаний, стратегия иная. Люди не подписываются на информационный бюллетень блога, чтобы получать купоны на скидку или уведомления о распродажах.Вместо увеличения продаж эти информационные бюллетени нацелены на создание заинтересованного сообщества читателей с помощью ценного контента. Ваш информационный бюллетень должен продвигать ваш лучший контент и давать читателям простой способ его найти. И этот шаблон поможет вам в этом. Персональный тренер по плаванию Наш шаблон основан на примере фитнес-сайта и содержит следующие разделы: Оригинальное вступление: Медиа-сайты часто создают контент на определенные темы в течение года.Ваши информационные бюллетени могут следовать аналогичным темам Рекомендуется добавить во вступление оригинальные редакционные материалы в качестве контекста для темы или тем, которые вы продвигаете. Рекомендуемая загрузка: Многие блоги создают подробные ресурсы, такие как электронные книги или инфографику, чтобы дать своей аудитории дополнительную ценность. Продвигайте этот контент с помощью призывного к действию загрузки в ежемесячном информационном бюллетене. Полезные статьи или видео: Это несложно — информационные бюллетени — идеальное место для продвижения ваших лучших статей месяца, которые читатели могли пропустить.Если вы фокусируетесь на видеоконтенте, вместо этого включите ссылки на свои популярные видео. Отзыв: Если у вас есть успешные тематические исследования или отзывы, включите их в свой информационный бюллетень, чтобы подчеркнуть ценность, которую вы предоставляете, и вызвать доверие среди ваших подписчиков. 👉 Чтобы получить этот шаблон, а также другие дизайны информационных бюллетеней, создайте бесплатную учетную запись Sendinblue. Шаблоны информационных бюллетеней SaaS Для SaaS-компаний информационные бюллетени предназначены для привлечения потенциальных клиентов и построения отношений с клиентами.Таким образом, они должны быть образовательными, профессиональными и, прежде всего, полноценными для читателя. Это означает включение полезных статей, обновлений продуктов и другого контента, который делает вашу компанию лидером отрасли. И этот шаблон информационного бюллетеня SaaS включает в себя все это и многое другое. PayHouse Наш шаблон основан на платформе личных финансов SaaS под названием PayHouse. Он включает в себя несколько элементов, которые каждый SaaS-маркетолог должен учитывать при составлении информационного бюллетеня: Обновления продукта: Поскольку инструменты SaaS постоянно развиваются, а отрасль очень конкурентоспособна, важно сообщать обо всех обновлениях или новых функциях.Информационные бюллетени созданы для такого типа объявлений. Дайте читателям обзор обновлений продукта, а затем добавьте призыв к действию, чтобы побудить пользователей протестировать их. Избранные статьи: SaaS-компании должны быть авторитетом в сфере своей продукции. Это означает, что вы делитесь контентом, который демонстрирует ваш опыт как компании и предлагает преимущества вашего инструмента. Регистрация на веб-семинар: Многие SaaS-компании используют веб-семинары, чтобы дать подробные инструкции по расширенным функциям или поделиться своими знаниями в своей области.Бюллетени являются одним из лучших способов продвижения этого типа контента для пользователей и широкой аудитории. Вы также можете использовать этот раздел для загрузки электронной книги или инфографики. Контактная информация службы поддержки клиентов: Меньше всего вам нужно, чтобы клиенты разочаровывались из-за того, что не могут решить проблему с вашим инструментом. Сделайте так, чтобы им было проще связаться с вашей службой поддержки или найти полезные ресурсы, даже в электронных письмах, не ориентированных на поддержку клиентов. 👉 Чтобы использовать этот шаблон для собственной бизнес-рассылки SaaS, зарегистрируйтесь и получите бесплатную учетную запись Sendinblue. Шаблоны информационных бюллетеней для некоммерческих организаций Информационные бюллетени для некоммерческих организаций отличаются от других компаний своей миссией, а не продажами. Это означает, что они должны рассказать историю и деятельность вашей организации, чтобы заручиться поддержкой подписчиков. Для этого ваш информационный бюллетень должен быть образовательным, но в то же время практическим. Люди не встают автоматически и не поддерживают дело — обычно им нужна поддержка. И здесь на помощь приходит информационный бюллетень. Наш шаблон информационного бюллетеня для некоммерческих организаций показывает вам, как именно это делается. Ассоциация Голубой волны В этом шаблоне информационного бюллетеня для некоммерческих организаций используется пример организации, борющейся с загрязнением океана. Обратите внимание на эти ключевые элементы: Событие CTA: Большинство некоммерческих организаций полагаются на события, чтобы продолжить сбор средств. Выделение предстоящих событий в вашем информационном бюллетене — отличный способ увеличить количество подписчиков и рассказать о новых сторонниках. Рекомендуемая история: Чтобы обеспечить пожертвования, некоммерческие организации должны доказать свою значимость.Включение избранной истории, которая демонстрирует это влияние, расскажет читателям, что они сделали правильный выбор, поддержав вас. Множественные призывы к действию «Пожертвовать»: Как вы видели, информационные бюллетени некоммерческих организаций должны быть действенными. Напомните читателям, что вам нужны их пожертвования, чтобы продолжать оказывать влияние на сообщество. Вспомогательные статьи: Включение статей, относящихся к вашей области, — мощная тактика, демонстрирующая важность вашей работы. 👉 Чтобы опробовать этот шаблон информационного бюллетеня, создайте бесплатную учетную запись Sendinblue. Найдите идеальный шаблон информационного бюллетеня для вашего бизнеса Информационные бюллетени — один из лучших способов начать налаживать отношения с вашими клиентами — так что не ждите, чтобы начать рассылку! Ознакомьтесь с нашим полным спектром шаблонов электронной почты в формате HTML, зарегистрировав бесплатную учетную запись Sendinblue. Благодаря этому вы сможете отправлять до 300 электронных писем в день бесплатно с неограниченным хранилищем контактов . И если вам нужно больше вдохновения, чтобы сделать эти шаблоны своими, ознакомьтесь с этим списком лучших примеров информационных бюллетеней по электронной почте.Или еще лучше подпишитесь на нашу новостную рассылку, чтобы получать маркетинговые советы и ресурсы прямо на свой почтовый ящик. Добавить комментарий Отменить ответ Ваш адрес email не будет опубликован. Обязательные поля помечены * Комментарий * Имя * Email * Сайт Поиск: Рубрики Seo Wordpress Дизайн Заработок Плагин Разное Рекомендац Сайт Совет Советы Тем Темы Урок Уроки