- PVSM.RU - https://www.pvsm.ru -
Сегодня мы хотели бы рассказать о базовых правилах верстки HTML в email-письмах. Как известно, на свете существует множество почтовых клиентов:
К сожалению, не существует обязательного стандарта верстки писем, который бы универсально поддерживался бы всеми клиентами. Часть поддерживает CSS3, часть нет, какие-то теги и аттрибуты поддерживаются, какие-то нет, не говоря уже о том, что поддержка HTML и CSS меняется даже в пределах одного почтового клиента от версии к версии. Последнее особенно заметно на примере Outlook (от Express и 2003 к Outlook 2011).
Что же необходимо знать тем, кто собирается самостоятельно верстать HTML-код для email-писем?
Верстая олдскульными таблицами и забыв про блочную верстку, вы однозначно убережете себя от проблем со старыми почтовыми клиентами. Также, не стоит забывать, что веб-версии у почтовых провайдерах могут открываться в самых разнообразных браузерах, вполне возможно, даже в IE 6.0. Таблицы помогут вам быть аккуратными и красивыми везде одинаково.
Забудьте про блочные css в начале документа. Только inline-стили. Конечно, это может вызвать геморрой при ручном приведении html-документа в порядок, но устранения подобных проблем Печкин предлагает автоматический CSS-inliner [1], в рамках проекта Печкин.Лаборатория. Этот инструмент также по-умолчанию стоит на 2-м шаге создания рассылок в нашем сервисе.
Задайте максимальную ширину в 600 пикселей и обезопасьте себя от гневных отзывов о горизонтальной прокрутке в почтовых клиентах ваших подписчиков.
Использование этих 5-ти правил позволит вам создать универсально отображаемую HTML-версию своего письма, а, значит, все ваши подписчики будут удовлетворены ее внешним видом без исключений!
В данном материале использованы сервисы Печкин.Лаборатории [2], в которой вы можете найти инструменты для автоматизации верстки, создания текстовых версий письма и других вещей, которые мы используем в сервисе email-маркетинга Печкин-mail.ru [3].
Автор: dsosnin
Источник [4]
Сайт-источник PVSM.RU: https://www.pvsm.ru
Путь до страницы источника: https://www.pvsm.ru/html/36298
Ссылки в тексте:
[1] автоматический CSS-inliner: http://labs.pechkin-mail.ru/inliner/
[2] Печкин.Лаборатории: http://pechkin-mail.ru/?page=labs
[3] сервисе email-маркетинга Печкин-mail.ru: http://pechkin-mail.ru/
[4] Источник: http://habrahabr.ru/post/182964/
Нажмите здесь для печати.