Как говорят digital-мудрецы, верстка – искусство, шаг за шагом следуй к мастерству.
Начни с ключевых моментов – и письма тобой сверстанные в спам не попадут, отображаться будут тоже гуд.
• Оформление правильное макета
Структуру строй из 4 блоков:
- прехедер
- шапка
- тело
- футер
Основная работа будет в теле. Шапка и футер, как правило, шаблонные. Они не меняются от письма к письму. В прехедере описание нужно будет менять.
Ширину оставляй для контентной части не больше 600 px. Это универсальный размер. Он легко адаптируем.
Не используй JavaScript, Flash и Active X. Все это провайдеры почтовые воспримут как вирус и отправят письмо в спам. Теги универсальные бери и атрибуты тоже. Все здесь
Лучше избегай CSS-анимацию. Не везде она сработает и исказит тебе отображение письма.
• Табличная верстка
Классику 90-х придется использовать тут, потому что это лучший способ, чтобы сохранить качественное отображение письма.
Структура с табличной версткой будет выглядеть так: таблицу разделишь на ячейки и эту таблицу поместишь в другие таблицы. В модулях будет весь контент находится: от визуала до ссылок. Могут они быть в одну или несколько колонок. Но чем их меньше, тем лучше. Идеал вообще – это одноколоночный макет. Он проще читается и адаптируется под разные устройства.
• Адаптация писем
Блочную адаптацию используй, тогда все письмо будут корректно отображаться везде, где можно и нельзя. «Плавающие блоки» – твой мастхэв.
• Оформление текста
Безопасный вариант при верстке электронных писем – стандартные шрифты. Например, Times New Roman и Arial поддерживаются абсолютно все почтовики. Шрифт читабельным должен быть. А «классика» с этим справится.
Не используй только лишь баннеры. Картинки воспринимаются как спам.
Указывай в редакторе кода параметры все стилевые для каждого блока текстового: от цвета до гарнитуры шрифта. Это поможет корректно письму отображаться.
• Оформление ссылок
URL не используй в качестве текста поясняющего. Они часто распознаются как вредоносные копии сайтов. Текстом бери и пиши текст поясняющий.
Сокращенные ссылки тоже плохо воспринимаются почтовиками. Шансы письмам в таком случае попасть в спам велики.
И помни: познав траблы, используй их в улучшении работы своей.
Или просто мастерам доверь верстку писем электронных.
Также по теме:
ТОП-5 проблем верстальщика электронных писем. Рассказываем, почему письма в спам попадают и плохо отображаются.
5 сервисов для бесплатного аудита сайта
Подписывайся на наш канал и читай, ставь 👍🏻 и комменты оставляй.