Верстка письма

Автор статьи
Юлия Чуракова

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

конструктор Unisender

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

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

Основные правила верстки

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

  • Письмо должно содержать элементы фирменного стиля компании (логотип, фирменные цвета). Проследите, чтобы рассылка не пестрила. Использовать 2–3 разных цвета можно, если не выкручивать насыщенность на максимум.
  • Используйте только стандартные системные шрифты. Лишь они корректно отображаются во всех почтовых клиентах. 
  • Не злоупотребляйте заглавными буквами и восклицательными знаками. Привлечь внимание подписчиков можно другими средствами дизайна: плашкой, картинкой, отступом или кнопкой.
  • Не используйте тяжелые изображения. Жестких ограничений по весу изображений и гиф нет, но чем они тяжелее, тем дольше будет открываться письмо. Поэтому рекомендуем использовать картинки до 100-200 Кб и гиф до 1 Мб. 
  • Письмо должно быть понятным, если картинки не загрузятся. Некоторые почтовые клиенты (например, Outlook) блокируют изображения изначально. Поэтому ваше письмо должно быть понятным и в ситуации, когда изображения скрыты (весь важный контент размещайте текстом, ко всем изображениям добавляйте alt-текст).
  • Не отправляйте письма в формате изображения. Письма, сверстанные одной картинкой, часто используют спамеры, поэтому спам-фильтры блокируют такие сообщения. Напишите в письме текст, хотя бы 1–2 абзаца. Это снизит риск того, что рассылка попадет в спам.
  • Не добавляйте в рассылки JavaScript, Flash-анимацию, cокращённые ссылки параллаксы. Некоторые из этих элементов не будут отображаться в рассылке (например, Flash-анимации, JavaScript). Другие могут отображаться, но при этом значительно повышают шанс рассылки попасть в спам (сокращенные ссылки).
  • Не прикрепляйте к письму тяжелые файлы. Спамеры используют вложения, чтобы добавлять к письму вредоносные файлы. Спам-фильтры с подозрением относятся к таким рассылкам и часто блокируют их. Поэтому если вам нужно, чтобы пользователь скачал файл, залейте его на файлообменник, а в письмо прикрепите только ссылку.

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

Узнать про особенности и основные правила HTML-верстки можно в статье «Как сверстать письмо: инструкция для чайников».

Вы нашли ответ?

2
1