В нашем блоге на Хабре мы часто пишем о создании почтовых рассылок — верстке HTML и CSS, работе с plain-text сообщениями и описываем интересные эксперименты. Сегодня мы представляем вашему вниманию список из 60 полезных ресурсов, туториалов и исследований о работе с email.
Фреймворки
- Ink – для быстрой вёрстки адаптивных HTML-писем, которые будут одинаково хорошо отображаться на любом устройстве или почтовом клиенте, в том числе в Outlook
- Email Framework – фреймворк для создания HTML-писем
- По-настоящему адаптивные письма. Часть вторая. Фреймворк — подход к созданию адаптивных писем от Артура Коха
Шаблоны
- Sendwithus – открытая библиотека шаблонов для писем
- Шаблоны электронных писем от Mailchimp
- Шаблоны Campaign Monitor
- Шаблоны адаптивных HTML-писем – протестированы на популярных почтовых клиентах
- Cerberus – подборка адаптивных шаблонов для писем
- Antwort – адаптивные макеты для верстки писем
- Адаптивный HTML-шаблон – подходит для работы с основными почтовыми платформами
- Бесплатный адаптивный шаблон: сводка – пятерка проверенных шаблонов
- Шаблон электронных писем от Grunt
- Шаблоны адаптивных электронных писем
Шаблон HTML-письма – хорошая отправная точка для вашей рассылки
Инструменты
- «Пуленепробиваемые» кнопки для писем – кнопки для ваших писем на VML и CSS
- «Пуленепробиваемые» фоновые изображения
- PutsMail – бесплатный инструмент для тестирования HTML-писем перед отправкой
- «Печкин» — сервис для создания и анализа email-рассылок;
- «Инлайнер» писем от «Печкина» — инструмент для создания inline-стилей для корректного отображения HTML-писем;
- Litmus – тестирование и отслеживание писем
- Campaign Monitor – протестируйте дизайн вашего письма во всех почтовых клиентах
- Grunt Litmus – тестируйте письма на Litmus с помощью grunt
- Email on Acid – тестирование писем на платной и бесплатной основе
Туториалы
- Туториал от Ли Манро из Grunt (подробнее)
- Туториал от Дэрила Дойла из Gulp на основе работы Ли Манро
- How-to: адаптивные письма в Gmail
- Как сверстать фоновое HTML5-видео в email-сообщении
- How-to: Типографика в дизайне email-писем
- Дизайн простоты: Как делать эффективные plain-text письма
- Процесс вёрстки писем – разбор верстки писем от Sitepoint
- CSS Support – анализ поддержки CSS для самых популярных почтовых клиентов
- Как создавать формы для подписки на email-рассылку: Ошибки и решения
- Лучшие методики по верстке электронных писем
- Как верстать HTML-письма (Mailchimp)
- How-to: Техники создания интерактивных email-писем с помощью CSS
- Как не потерять рассудок (и душу) при вёрстке рассылок
- Как создать слайдер изображений в почтовом сообщении
- Как сверстать интерактивные вкладки в email-письме
- Пособие по email-маркетингу от Mailchimp
- Подробное руководство по CSS от Campaign Monitor
- Использование CSS в HTML-письмах
- Адаптивный дизайн HTML-писем – Курс по созданию адаптивных писем от сотрудников компании Litmus Джастина Дженда (Justine Jand) и Джейсона Родригеза (Jason Rodriguez)
- Дизайн HTML-писем – дизайнер интерфейсов MailChimp Фабио Карнейро (Fabio Carneiro) показывает, как создать с нуля многофункциональное письмо, адаптированное под мобильные устройства
- Создание HTML-письма – эти учебные пособия ознакомят вас с основами верстки HTML-писем. Здесь вы сможете найти информацию о технологиях разработки, процессе создания и дизайна HTML-писем
- Верстка шаблона адаптивного письма в Ink – создание шаблонов адаптивных писем с помощью Ink
- Зачем нужны plain-text письма, и как их нужно делать: 6 советов
Блоги
- Хабраблог «Печкина» о верстке рассылок
- Блог Артура Коха
- Блог Litmus
- Блог Stylecampaign
- Блог Myemma
- Блог Postmarkapp
- Блог Spently
- Блог Emailmonks
Исследования
- Как создать успешную рассылку — тренды и статистика по Рунету, собранные сервисом «Печкин»;
- Myemma Email Stats – 18 фактов от компании Emma, Inc, которые будут полезны современным email-маркетологам
- Mailchimp Research – команда исследователей MailChimp постоянно анализирует данные, чтобы помочь вам с проведением рассылок
- Отчет Campaign Monitor за 2015 год – отчёт за 2015 год: новые правила email-маркетинга
Источники вдохновения
- Идеальные электронные письма – лучшие дизайны писем
- Топ электронных маркетинговых кампаний
- Htmlemaildesigns – дизайн, который можно взять себе на заметку
Lamaster
Неужели вёрстка писем настолько сложна, что этому посвящается 100500 статей? Ну перенесите вы их на Мегамозг, им здесь нечего делать.
lol_wat
Вы удивитесь, но таки да, сложна. И подчас это вполне гиковская тема — здесь хотя бы куча верстки (HTML и CSS), поэтому ничего переносить на Мегамозг мы не будем. Лучше почитайте наш блог — откроете для себя эту область с новой стороны.