Temp

Дизайн и верстка писем

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

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

С чего начать

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

Как создать красивое письмо. Дизайн и верстка

Какие письма бывают

Глобально все письма можно разделить на 3 типа: HTML, AMP и Plain text.

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

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

Plain text — письма, которые состоят из обычного текста. Они похожи на личную переписку и поэтому нравятся многим пользователям.

40 лучших примеров HTML-писем

Гид по AMP: нужны ли вам интерактивные письма

Зачем отправлять письма в формате Plain text

Из каких элементов состоит письмо

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

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

Как сделать стильное письмо при помощи GIF

Как вставить видео в письмо и поднять открываемость и CTR

Как собрать письмо

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

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

Как создать макет письма без дизайнера

Как сверстать письмо: инструкция для чайников

18 классных сервисов для создания email

Как отправить готовый макет

Письмо готово — осталось его отправить. Хорошо, если вы собирали макет в сервисе рассылки — тогда разослать сообщение можно сразу же. Но если создавать письмо в стороннем конструкторе, могут возникнуть проблемы.

Ладно-ладно, никаких проблем нет:

Как отправить HTML-письмо. Четыре простых способа