Email Design Best Practices

Существует два типа электронных писем: обычные и HTML-письма. Каждый, кто использует электронную почту, видел текстовое электронное письмо без форматирования. Вы, безусловно, все еще можете отправлять текстовые электронные письма своим подписчикам, но в этой статье мы поговорим об электронных письмах с разновидностью HTML.

HTML-письма должны отправляться в многочастном / альтернативном формате MIME; это включает HTML-версию и простой текстовый резерв для почтовых клиентов с отключенным HTML или с отсутствием возможностей HTML. Это означает, что при написании и оформлении электронного письма в формате HTML вам по-прежнему нужна также текстовая версия. К счастью, большинство популярных поставщиков услуг электронной почты создадут текстовую альтернативу из вашего HTML-контента.

Ограничения дизайна

Во многих отношениях разработка электронных писем HMTL очень похожа на разработку веб-страницы. Они написаны с использованием HTML и CSS, и отображаются с помощью браузера.

Если вы разрабатывали сайты достаточно долго, чтобы помнить войны браузеров, это только в десять раз хуже. Различные почтовые клиенты будут обрабатывать электронные письма по-разному, и существует множество почтовых клиентов. Есть настольные почтовые клиенты, такие как Microsoft Outlook, Windows Mail и Apple Mail, веб-службы, такие как Gmail, Yahoo Mail и Microsoft Hotmail, а также клиенты мобильной электронной почты.

Таблицы стилей

Некоторые из крупнейших почтовых клиентов ( кашель , Outlook, кашель ) все еще используют древние механизмы рендеринга с ужасной поддержкой CSS. Поскольку они занимают значительную долю рынка, вы должны рассчитывать на наименьший общий знаменатель. Некоторые веб-клиенты, такие как Gmail, также очень ограничены в том, какие функции CSS они поддерживают.

По сути, вы должны создать свой электронный бюллетень так, как если бы вы разработали веб-сайт для Internet Explorer 5.5 в прежние времена. Вам нужно использовать встроенные стили и избегать CSS3.

Чтобы получить полный список популярных почтовых клиентов и поддерживаемых CSS для каждого, ознакомьтесь с Руководством CampaignMonitor по поддержке CSS в почтовых клиентах.

Размер

Окна электронной почты различаются по размеру, но обычно они меньше, чем окна браузера, из-за боковых панелей и навигации. Лучше всего, чтобы ваши электронные письма имели ширину от 500 до 600 пикселей или использовали гибкий макет.

Будь проще

Избегайте встраивания видео, JavaScript или Flash в почтовые рассылки. Если вы хотите показать видео, создайте изображение для видеопроигрывателя (даже снимок экрана) и просто свяжите его с видео, встроенным на страницу вашего веб-сайта, или с веб-версией электронной почты.

Призыв к действию

Что вы хотите, чтобы ваши подписчики делали ? Вы хотите, чтобы они посетили ваш сайт или блог, чтобы прочитать статью? Вы хотите, чтобы они купили продукт? Обязательно четко определите цели своей электронной почты и включите в свое сообщение несколько четких призывов к действию. Не просто предполагайте, что ваши посетители будут знать, что делать; Думайте о каждом письме как об отдельной целевой странице.

тестирование

Litmus — это веб-сервис для тестирования электронной почты, который покажет вам, как ваше сообщение отображается во всех популярных почтовых клиентах, как на рабочем столе, так и в Интернете. CampaignMonitor предлагает интеграцию Litmus, так что вы можете проверить свою электронную почту, даже не выходя из программного обеспечения. MailChimp имеет аналогичный встроенный сервис, который будет выполнять ту же функцию.

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

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

Бесплатные шаблоны

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

Вы можете использовать шаблоны, как они есть, и просто добавить свой логотип, или использовать их в качестве основы и изменить то, что вы считаете нужным. Независимо от вашей ситуации, бесплатные загружаемые шаблоны могут дать вам преимущество в вашей новостной рассылке, так что вы можете не начинать с нуля.