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

В блоге компании Litmus опубликован материал, в котором рассказывается, как можно создать «скрытую» версию электронного письма почтовой рассылки, которая будет отображаться только на Apple Watch.

Как правило, Watch отображает только plain text-часть почтового сообщения — когда устройство «замечает», что в письме используется изображение, хранящееся на удаленном сервере, оно решает, что все это слишком сложно, и показывает только текст. Речь все-таки идет о часах.

Дизайнеры, работающие над созданием привлекательных шаблонов писем для email-рассылок, много времени тратят на то, чтобы добиться адекватного отображения на разных устройствах. В наши дни почти половина всех писем просматривается со смартфонов и планшетов, а значит, необходимо позаботиться о том, чтобы письмо хорошо выглядело на разных форм-факторах. Именно для этого в вёрстке и начали использовать media queries.

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

При верстке email-рассылок важно сделать разметку пригодной для парсинга и добиться того, чтобы «рюшечки» не мешали чтению контента. А главным контентом в письме почти всегда является текст.

Сегодня мы поговорим о том, как использовать технику прогрессивного улучшения при разработке HTML-шаблонов писем.

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

Сегодня речь пойдет о применении media queries для разных устройств, оптимизации изображений для «мобайла» и повышении эффективности форм подписки.

Любой, кто периодически читает почту на телефоне, знает, что этот опыт может быть как вполне приятным, так и просто ужасным. Тот факт, что письмо из рассылки отлично выглядит на десктопе, еще не означает, что все будет хорошо в мобильном почтовом клиенте — на небольшом экране часто возникают проблемы со шрифтами, отображением столбцов, а вёрстка шаблонов просто разъезжается.

Зачем нужно адаптировать письма для мобильных устройств

Значительная часть аудитории различных компаний, занимающихся email-маркетингом, просматривают письма на мобильных устройствах. Во время исследования Campaign Monitor от 2011 года выяснилось, что почти 20% открытий писем происходили на смартфонах и планшетах — в 2009 году эта цифра находилась на уровне всего в 4%. Почти 90% от этих открытий осуществлялись на устройствах под iOS. Сейчас цифры еще выше.

В этом руководстве мы рассмотрим несколько способов улучшения отображения почтовых рассылок на мобильных устройствах (от использования media queries при вёрстке адаптивных шаблонов до более продвинутых техник). Кроме того, мы рассмотрим различные вопросы дизайна, которые возникают еще на этапе планирования рассылки, а также поговорим о том, каким образом стоит размещать формы подписки для получения писем на смартфонах и планшетов.

Примечание переводчика: Ранее в нашем блоге мы публиковали материал с советами по дизайну email-рассылок, созданными на основе анализа 22 млн писем, а также рассказывали о том, как те или иные параметры письма влияют на его эффективность согласно статистике (в том числе по Рунету). Сегодня мы представляем вашему вниманию обширную инструкцию по email-маркетингу, которую создали аналитики маркетинговой компании Vero на основе анализа 100 млн электронных писем.



Сегодня мы поделимся с вами результатами исследования более 100 миллионов писем, которые мы отправили клиентам по электронной почте.

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

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

Электронная почта — отличный инструмент коммуникации, который позволяет компаниям доставлять аудитории контент удобным для нее способом. При этом читать письма в формате plain text не всегда удобно, поэтому в современных новостных рассылках используются различные графические элементы.

Вёрстка HTML для электронной почты — интересная и довольно сложная задача. Письма должны одинаково хорошо отображаться на старых устройствах и версиях программных клиентов.

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

Примечание переводчика: Представленный ниже материал содержит значительное количество технических терминов, при переводе которых могут возникнуть неточности. Если вы заметили опечатку, ошибку или неточность перевода — напишите нам, и мы оперативно всё исправим.

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

Конверсии просто так не происходят; также и электронные письма сами по себе не приносят результата. Эти 26 советов опираются на опыт ведения email-маркетинга нескольких наиболее успешных компаний со всего мира.

Как понять, на какой мобильной платформе сконцентрироваться при создании рассылки для компании и ее клиентов? Специалисты CampaignMonitor проанализировали 22 млрд писем для того, чтобы сформулировать рекомендации по дизайну email-рассылок.

Цифры

Специалисты проанализировали 6 млн маркетинговых кампаний, в ходе которых было отправлено 22 млрд писем. Исследователей интересовала статистика по открытиям писем на мобильных платформах, десктом-компьютерах и веб-клиентах, изменение этих цифр за несколько лет и паттерны «прокликивания» CTR в зависимости от конкретного устройства.



Данные основаны на 1,8 млрд открытий писем, совершенных 22 миллионами получателей; в 9% случаев определить платформу не удалось

Как и ожидалось, цифры показали доминирование мобильных устройств в 2013 и 2014 годах. Помимо прочего рост популярности мобильных почтовых клиентов помогает дизайнерам в разработке шаблонов писем для всех платформ.

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

В нашем сегодняшнем топике мы расскажем о том, как строится инфраструктура подобных сервисов, на примере проекта Pechkin-mail.ru.

От переводчика: это короткий (буквально – пятиминутный) рассказ о том, каковы основные направления, цели и задачи UX, который будет интересен тем, кто только начинает знакомство с этим топиком. В конце статьи мы решили привести список интересных публикаций по теме, которыми можно продолжить процесс изучения проектирования интерфейсов и юзабилити.

Задача проектировщика UX – сделать работу пользователей более эффективной, повысить их удовлетворенность процессом и, как следствие, обеспечить компании коммерческий успех. Но соблюдать баланс между потребностями пользователей и целями вашего бизнеса непросто. Редакция издания FastCompany попросила Майкла Хайлеманна (Michael Heilemann), директора по интерфейсам в Squarespace, и Аарона Уолтера (Aarron Walter), директора по UX в сервисе email-рассылок MailChimp, поделиться своими знаниями по теме.

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

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

Продолжая рассказывать о технологиях, которые используются в нашем сервисе email-маркетинга Pechkin-mail.ru, мы просто обязаны упомянуть об автоматическом определении пола подписчика по имени. Еще в 2007 году, разрабатывая сервис sms-рассылок, мы очень хотели реализовать возможность автоматического подставления окончаний в прилагательные “Уважаемый”, “Дорогой” и так далее. Обычно такая подстановка осуществляется на основании дополнительного поля в адресной базе клиента. Однако, как нам кажется, это полный отстой.
На это есть 3 причины:

1. заставлять подписчика задавать свой пол глупо (чем больше полей в форме, тем ниже вероятность ее заполнения)
2. определять вручную — долго, а значит дорого
3. от ошибок человек не застрахован ровно так же, как и машина.

Но мы не лингвисты, поэтому реализовать такой модуль было бы слишком сложно для нас, да и функция “не первой необходимости”. Но недавно, работая над склонениями текстов бесконечных актов, договоров и прочих юридических документов, мы вспомнили об используемом нами уже 2 года сервисе Морфер. Это прекрасный лингвистический сервис, специализирующийся на русском языке и позволяющий склонять по падежам слова, целые предложения, числительные, а также получать текст из цифр. В общем, потрясающая разработка всего одного человека — Сергея Слепова.

Видео ворвалось в жизнь интернета внезапно и, не сказать, чтобы так давно. Однако, уже стало неотъемлемой частью жизни любого из нас. Видео стало инструментом бизнеса в продвижении товаров и услуг. На Youtube можно найти инструкции к товарам, промо-ролики, записи вебинаров итд. Размещение видео в email-рассылках — это очень толковый маркетинговый ход. По нашей статистике это на 17% повышает долю кликов в вашей рассылке (по сравнению с аналогичными без видео).

Но как это сделать в своем html-макете рассылки?

Вставлять видео из Youtube на веб-страницах просто — достаточно скопировать html-код с iframe и разместить его у себя. А вот с email-рассылкой такой финт не пройдет. И, хотя, email-рассылка тоже содержит html-макет вставить в него iframe нельзя по соображениям безопасности. Открываем Технические и административные требования для отправки электронных сообщений на Mail.Ru. Мы их используем, как основные на рынке рунета (в нашем трафике доля Mail составляет более 70%).

… при использовании HTML в ваших сообщениях, убедитесь что соблюдена валидная структура HTML-документа. Запрещено использовать потенциально опасные объекты, такие как ActiveX, JavaScript, VBScript, Java-апплеты, Frames и IFrames, подключаемые с внешних сайтов CSS, Meta Refresh и т.п. (использование таких элементов может привести к блокировке ваших рассылок);

К тому же, такие iframe зачастую будут просто некорректно отображаться почтовыми клиентами, программами или веб-сервисами. И, все-таки, как вставить видео в письмо? Сервис email-маркетинга Pechkin-mail.ru, как всегда, делает всю основную работу за вас.

Мы продолжаем рассказывать о технологиях, используемых на нашем сервисе email-маркетинга Pechkin-mail.ru. Одной из ключевых задач любого сервиса, связанного с данными клиентов, является загрузка этих данных на сервис. Для Печкина очень важно быстро и без проблем для пользователя загружать адресные базы, содержащие email-адреса, имена, фамилии и другие дополнительные данные.

Что использовать в качестве инструмента?

В качестве базового стандарта, используемого при импорте адресных баз, мы взяли Microsoft Excel. Объясняется это просто:

• это стандартный инструмент, которым на базовом уровне владеют 100% пользователей компьютеров. Более того, в бизнесе — это де-факто корпоративный стандарт и используется даже, если на рабочих компьютерах Mac или Linux.
• Практически все CRM-, CMS-, облачные или десктопные системы имеют экспорт в Excel или CSV, который простым пересохранением приводится к формату XLS или XLSX.
• Известно также, что “90% ошибок ПО сидит в полуметре от монитора”. Не в обиду будет сказано рядовым пользователям, но мы должны учитывать самый базовый уровень подготовки и тех. поддержке для объяснения достаточно сказать “Загрузите Excel-файл”, а не объяснять процедуру подготовки файла в нужном формате.

Проблему пользователей при импорте адресных баз сняли. Но тут возникает уже проблема непосредственно разработки.

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

В целях борьбы со спамом некоторые организации (и наш сервис email-маркетинга в том числе) используют так называемые “спам-ловушки” (spam traps) для определения спамеров. Вокруг спам-ловушек уже сложилась целая сеть мифов и легенд о том, что это такое, как они создаются, как используются и как они попадают в ваши адресные базы.

Спам-ловушка (spam trap) — это email-адрес, который создается, но не используется в работе, т.е. он не подписывался ни на одну из рассылок. Он мониторится на предмет получения сообщений, которые явно будут спамерскими. Также, эти адреса ищутся в ваших адресных базах. Массовое присутствие spam trap в ваших адресных базах приводит к немедленной блокировке вашего аккаунта. В этой статье мы расскажем о том как классифицируются спам-ловушки на основании их происхождения.

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

В Рунете мы ежедневно и ежечасно сталкиваемся с попытками “проспамить” подписчиков по купленным адресным базам, по базам подписчиков из открытых источников, по, так называемым, “партнерским” базам. Для того, чтобы не было жалоб и все чувствовали себя комфортно в рамках нашего АнтиСпам-соглашения в Печкине была разработана система мониторинга и модерации, которая позволяет нам надежно фильтровать спам-рассылки, отправляемые через наш сервис.

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

• веб-версии у почтовых провайдеров (Gmail, Yandex, Mail, Yahoo итд.)
• десктопные почтовые клиенты (Outlook, Bat, Thunderbird, Mac Mail)
• мобильные почтовые клиенты (Blackberry, Android, Iphone, Ipad итд)

К сожалению, не существует обязательного стандарта верстки писем, который бы универсально поддерживался бы всеми клиентами. Часть поддерживает CSS3, часть нет, какие-то теги и аттрибуты поддерживаются, какие-то нет, не говоря уже о том, что поддержка HTML и CSS меняется даже в пределах одного почтового клиента от версии к версии. Последнее особенно заметно на примере Outlook (от Express и 2003 к Outlook 2011).

Что же необходимо знать тем, кто собирается самостоятельно верстать HTML-код для email-писем?

Введение

Email-рассылки, отправляемые через Печкин, в большинстве своем содержат как html-версию письма, так и plain-text версию. Отправить рассылку без HTML-версии можно, а вот, отправив ее без plain-text, вы рискуете лишиться ряда подписчиков, почтовые клиенты которых без сожаления вырезают html-версии писем в целях безопасности. Особенно этим отличаются корпоративные аккаунты, почтовые администраторы которых заботятся о защите своих подопечных от спама и вирусов.

Ставим задачу

Итак, plain-text версия письма необходима, это факт. Но как же сложно заставить себя написать ее, если вы только что потратили кучу времени на создание html-версии своей рассылки. Очевидно, что Печкин должен снимать эту нагрузку и автоматически генерировать текстовую версию писем для наших клиентов. Но как это сделать?

Мы перепробовали многое:

• разнообразные регулярные выражения
• кучу разных библиотек для парсинга html

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

• выделять заголовки и подзаголовки
• выделять и аккуратно отображать ссылки
• следить за количеством переносов и аккуратно распологать блоки с текстом для их читаемости
• делать все это быстро