Как сделать макет письма для email-рассылки

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

1.​ Выбор подходящего шаблона⁚
   В начале работы над макетом письма выберите подходящий шаблон.​ Можно воспользоваться готовыми шаблонами, которые предоставляются различными сервисами для email-маркетинга.​ Шаблоны обычно представлены в виде HTML-кода или почтовых клиентов, которые позволяют создавать письма с помощью редактора "drag-and-drop".​
   
2.​ Определение структуры письма⁚
   Определите, какие блоки должны присутствовать в вашем письме.​ Обычно макет письма включает заголовок, основное содержимое, изображения, кнопки, контактную информацию и ссылки на социальные сети.​ Размещение блоков может быть вертикальным или горизонтальным, в зависимости от вашей цели и визуальных предпочтений.​

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

4.​ Дизайн и стилизация⁚
   Создайте привлекательный дизайн для вашего письма.​ Учитывайте, что он должен быть согласован с вашим брендом или продуктом.​ Используйте сочетание цветов, шрифтов, изображений и других элементов дизайна, чтобы создать привлекательный и сбалансированный макет.​
5.​ Тестирование на разных устройствах и почтовых клиентах⁚
   После создания макета не забудьте протестировать его на различных устройствах и почтовых клиентах.​ Убедитесь, что ваше письмо корректно отображается и правильно работает в различных условиях.​ Это поможет избежать проблем с визуализацией и позволит доставить ваше сообщение максимальному числу получателей.

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

Из чего состоит письмо

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

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

• Кто получает письмо? Например, клиенты банка.
• Почему мы отправляем письма? Например, чтобы открыть счет в банке.

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

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

Как правильно сделать прехедер

Pre -Semitic — Это текстовое пояснение темы письма, которое появляется в предварительном просмотре.

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

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

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

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

• Самая быстрая скидка 25%
• Устойчивость к воде и влажности
• Активное подавление шума
• Красный, черный или белый

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

• Если вы рисуете электронное письмо на процессоре, нарисуйте текст заголовка на фоне.
• Если вы планируете письмо в HTML, используйте команду CSS "display:none". Действительно, вы можете добавить команду. Определите размер колонки в пикселях и используйте цвет фона шрифта

Как правильно сделать шапку письма

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

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

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

У Premier в заголовке логотип сервиса и ссылка ведет на сайт, а следующий баннер предназначен для самого заказа

Заголовки помогают наглядно представить основное предложение.

В Domklic Letters заголовок представляет собой один общий баннер с иллюстрацией, заголовком и названием бренда.

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

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

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

Как правильно наполнить письмо

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

Баннеры: как их выбрать и разместить

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

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

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

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

В информационном бюллетене Burger King баннер кратко анонсирует предложение, а текст раскрывает его суть

Текст может содержать множество баннеров. Правила следующие. Баннер — Предложение — Действие.

Рассылки Lamoda состоят из одинаковых баннеров разных цветов, размеров и предложений.

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

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

В информационном бюллетене SMMPLANNER на фотографии баннера изображен образец выставки, а текст заголовка передает преимущества

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

Текст: как он работает в электронном письме и на что следует обратить внимание

Текст — это основная информация, за которой следует баннер.

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

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

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

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

Также избегайте воды и марок. Вместо:.

• 'лидер рынка' — 'лидер рынка в 2021 году по данным Forbes'
• 'Лучшие продукты' — "согласно исследованиям компании n, наши продукты часто выбирают больше, чем продукты конкурентов".
• 'Высококачественные материалы' — "мы используем итальянскую кожу, а наши мастера имеют подтвержденные профессиональные сертификаты"

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

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

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

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

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

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

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

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

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

В качестве примера ниже приведены некоторые подходы к проектированию.

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

• Для создания атмосферы письма можно использовать фоны и цвета. Они выглядят круто и стильно.

• Графика может заменить или дополнить текст, в котором нет необходимости.

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

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

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

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

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

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

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

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

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

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

Ссылки: как добавлять ссылки в текст и баннеры

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

Зачем нужны ссылки: чтобы генерировать запросы и клики на ваш сайт. Ссылки позволяют проанализировать, какие элементы выбираются чаще всего, и улучшить ваши сообщения в будущем. Рекомендуется добавить UTM-сигналы для отслеживания количества кликов. Это можно сделать с помощью бесплатного сервиса Tilda.

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

Примеры использования ссылок :

• Повышение кликабельности и кликов по сайту — все элементы в электронном письме ссылаются на продукт

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

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

Кнопки: как их размещать и что писать

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

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

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

Например, в рассылке сбербанка кнопка подписана словом "обучение". Чтобы понять, куда ведет ссылка, нужно прочитать текст на кнопке.

Это можно изменить, если кнопка имеет смысл сама по себе.

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

Используйте кнопки, чтобы избежать "баннерной слепоты". Хорошим примером является информационный бюллетень T-J.

Что поместить в нижний колонтитул

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

Причина: соблюдение законодательства о рекламе и справочной информации.

Как использовать в рассылках:.

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

Добавьте все ссылки на Premier Newsletter, включая полные версии приложения, социальных сетей, офисов и онлайн-бюллетеней.

• Разместите меню со ссылкой на сайт так, чтобы заголовок не был виден

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

• Размещать юридическую информацию — часто для банков, здравоохранения, табака, алкоголя и финансирования бизнеса

Тинькофф Банк Для подачи предложений по картам есть большой блок информации об условиях обслуживания

Вебинар дизайн-директора Mailfit Ирины Хафизовой: «Дизайн имейл-рассылок»