Полезные статьи и руководства по созданию HTML-писем, подписей и шаблонов для Gmail, Yahoo, Mail.ru и Яндекс.Почты.
Зачем нужен превью-текст письма, как он повышает открытия и как добавить скрытый превью в HTML. Плюс проверка в html2email.
Красивая HTML-подпись в Gmail и Yahoo за пару минут. Готовые шаблоны, без программирования.
Узнайте, как скопировать HTML шаблон письма из любого письма в Gmail, Яндекс.Почте или Mail.ru за 2 минуты. Бесплатное расширение, работает оффлайн.
Правильный doctype держит Gmail и Outlook в режиме стандартов и убирает «поломки» ширины и шрифтов.
Как избавиться от кракозябр и нежелательного зума на мобильных: UTF-8 и viewport в начале письма.
Почему ломается вёрстка из-за незакрытых тегов таблиц и как проверить шаблон до отправки.
border, cellpadding, cellspacing и role для стабильной табличной вёрстки и доступности.
Как выбрать ширину контейнера, центрировать письмо и избежать горизонтальной прокрутки на телефоне.
Flex и grid в письмах: заменить на таблицы, чтобы Outlook и мобильные отображали всё стабильно.
Зачем нужен альт и как писать короткий текст, когда картинки отключены или для скринридеров.
Как избежать «прыгающей» вёрстки: задавать размеры и border="0" у каждой картинки.
Почему под картинкой появляется пустое место и как убрать его через display: block.
Использовать https, не оставлять пустой href и аккуратно с трекингом, чтобы ссылки работали.
Почему важны инлайн-стили для Gmail и Outlook и почему внешние таблицы стилей не подходят.
Какие свойства ломаются в Outlook и чем их заменить при табличной вёрстке.
px и % для предсказуемых размеров; почему rem, em и vw лучше не использовать в вёрстке для Outlook.
Как не попасть под обрезку Gmail: меньше разметки, аккуратная минификация и без дублирования стилей.
Обёртка с условными phantom-таблицами, чтобы Outlook корректно отображал max-width и вёрстку.