Подборка: 40+ полезных инструментов, ресурсов и исследований о работе с email
[1]
В нашем блоге на Хабре мы часто пишем о создании почтовых рассылок [2] — верстке HTML и CSS, работе с plain-text сообщениями и описываем интересные эксперименты. Сегодня мы представляем вашему вниманию подборку полезных ресурсов, туториалов и исследований на английском и русском языках, посвященных работе с email.
1. Блоги
- Blog — Campaign Monitor: [3] Блог о разработке и совершенствовании email-рассылки;
- Email on Acid: [4] Блог о дизайне маркетинговых писем и хитростях email-маркетинга;
- Email Wizardry: [5] Блог разработчика почтовых рассылок.;
- Блог Артура Коха [6]
- Блог Печкина [7]: На Хабре мы рассказываем о верстке почтовых рассылок и связанных с этим технологиях.
2. Шаблоны (Boilerplate)
- Emailology: [8] Об использовании шаблонов для верстки писем (html и css);
- Ink: A Responsive Email Framework from Zurb: [9] Адаптивный дизайн писем от Zurb;
- Litmus: [10] Компоновщик Litmus для верстки писем;
- Автоматический CSS-inliner от Печкина [11]: Данная утилита автоматически приводит все CSS, которые есть в вашем HTML в inline-style. инструмент
3. Разработка
- Bulletproof Email Buttons Litmus: [12] Подходы к созданию универсальных кнопок;
- Bulletproof Email Buttons List A Part: [13] Статья о том, как сделать письмо адаптивным;
- HTML5 Video Background in Email Litmus: [14] Руководство Litmus о том, как встроить HTML5-видео в фон письма;
- Meet the Ipsums: [15] Как применить технику модульного дизайна;
- Процесс вёрстки писем [16] – разбор верстки писем от Sitepoint
- Outlook Conditional CSS MailChimp: [17]Об условных конструкциях CSS для MS Outlook.
4. Сообщества
- Litmus | Discussions: [18] Список веток в сообществе Litmus.
5. Отправка писем
- Emailonacid: [19] Статья о влиянии веса письма на его доставку получателям.
6. Self-hosted приложения
- Sendy: [20] Self-hosted приложение для почтовой рассылки*
7. Шрифты и типографика
- Q&A with Paul Airy (Litmus Blog): [21] Об оформлении писем и шрифтах с Полом Эйри;
- Font Squirrel: [22] Бесплатные шрифты для оформления писем;
- Typekit Practice: [23] Уроки типографики;
- How-to: Типографика в дизайне email-писем [24]
- WhatFont: [25] Сервис, позволяющий определить шрифт при наведении курсора.
8. Руководства
- Как создавать формы для подписки на email-рассылку: Ошибки и решения [26];
- Зачем нужны plain-text письма, и как их нужно делать: 6 советов; [27]
- Как создать слайдер изображений в почтовом сообщении; [28]
- Как сверстать интерактивные вкладки в email-письме; [29]
- Campaign Monitor's «Will It Work?»: [30] Оформление рассылки средствами CSS и HTML;
- Litmus Our Favorite Responsive and Mobile Email Resources: [31] Уроки, статьи и советы по email-маркетингку.
9. Изображения
- Optimizer JPG: [32] Бесплатный онлайн-инструмент для сжатия jpeg-изображений;
- Tiny PNG: [33] Уменьшение веса PNG-изображений.
10. Адаптивный дизайн
- Multi-Column Responsive Layouts (Campaign Monitor): [34] Адаптивный дизайн для мобильных устройств;
- Responsive HTML Emails: [35] Об адаптивном дизайне писем для мобильных устройств
- From Brad Frost's «This is Responsive»: [36] Подборка источников по адаптивному дизайну;
- Responsive Web Design Resources: [37] Список ссылок на статьи и сайты об адаптивном дизайне.
11. Данные и статистика
- Как создать успешную рассылку [38] — тренды и статистика по Рунету, собранные сервисом «Печкин»;
- The best time of day to send emails (infographic): [39] Инфографика на тему оптимального времени отправки писем;
- Deployment Times: [40] Заметка о том, когда лучше всего отправлять письма;
- Email Still Dominates Sharing: [41] Статистика нажатия на кнопки (поделиться, прочитать позже…);
- Mobile vs Desktop (infographic): [42] Инфографика для разработки дизайна под мобильные устройства;
- Heatmapping Technology CrazyEgg: [43] Веб-инструмент для создания «тепловой карты» сайта.
12. Другие инструменты
- Litmus Scope: [44] Инструмент от Litmus для создания веб-версии писема;
- Emmet: [45] Набор плагинов для различных популярных текстовых редакторов;
- FFFFallBack Bulletproof Web Typography: [46] Инструмент для работы с текстами, шрифтами и их оформлением;
- HTML Tidy: [47] Исправление ошибок в HTML и улучшение внешнего вида верстки;
- Sublime Text: [48] Кроссплатформенный текстовой редактор.
Автор: Pechkin-mail.ru
Источник [49]
Сайт-источник PVSM.RU: https://www.pvsm.ru
Путь до страницы источника: https://www.pvsm.ru/how-to/109625
Ссылки в тексте:
[1] Image: https://habrahabr.ru/company/pechkin/blog/275603/
[2] почтовых рассылок: https://pechkin-mail.ru/?utm_source=habr&utm_medium=referral&utm_campaign=40email
[3] Blog — Campaign Monitor:: https://www.campaignmonitor.com/blog/
[4] Email on Acid:: http://www.emailonacid.com/blog
[5] Email Wizardry:: http://blog.emailwizardry.co/
[6] Блог Артура Коха: http://habrahabr.ru/users/dudeonthehorse/topics/
[7] Блог Печкина: http://habrahabr.ru/company/pechkin/blog/
[8] Emailology:: http://www.emailology.org/#1
[9] Ink: A Responsive Email Framework from Zurb:: http://foundation.zurb.com/emails.html
[10] Litmus:: https://litmus.com/email-builder
[11] Автоматический CSS-inliner от Печкина: http://labs.pechkin-mail.ru/inliner/
[12] Bulletproof Email Buttons Litmus:: https://litmus.com/blog/a-guide-to-bulletproof-buttons-in-email-design
[13] Bulletproof Email Buttons List A Part:: http://alistapart.com/article/can-email-be-responsive
[14] HTML5 Video Background in Email Litmus:: https://litmus.com/blog/how-to-code-html5-video-background-in-email
[15] Meet the Ipsums:: http://www.smashingmagazine.com/2014/08/improve-your-email-workflow-with-modular-design/
[16] Процесс вёрстки писем: http://habrahabr.ru/company/pechkin/blog/268025/
[17] Outlook Conditional CSS MailChimp:: http://templates.mailchimp.com/development/css/outlook-conditional-css/
[18] Litmus | Discussions:: https://litmus.com/community/discussions
[19] Emailonacid:: https://www.emailonacid.com/blog/article/email-development/how_does_email_file_size_affect_deliverability/
[20] Sendy:: https://sendy.co/
[21] Q&A with Paul Airy (Litmus Blog):: https://litmus.com/blog/creative-typography-in-email-qa-with-paul-airy
[22] Font Squirrel:: http://www.fontsquirrel.com/
[23] Typekit Practice:: http://practice.typekit.com/
[24] How-to: Типографика в дизайне email-писем: http://habrahabr.ru/company/pechkin/blog/259909/
[25] WhatFont:: http://chengyinliu.com/whatfont.html
[26] Как создавать формы для подписки на email-рассылку: Ошибки и решения: http://habrahabr.ru/company/pechkin/blog/265853/
[27] Зачем нужны plain-text письма, и как их нужно делать: 6 советов;: http://habrahabr.ru/company/pechkin/blog/272971/
[28] Как создать слайдер изображений в почтовом сообщении;: http://habrahabr.ru/company/pechkin/blog/267565/
[29] Как сверстать интерактивные вкладки в email-письме;: http://habrahabr.ru/company/pechkin/blog/265409/
[30] Campaign Monitor's «Will It Work?»:: https://www.campaignmonitor.com/dev-resources/will-it-work/
[31] Litmus Our Favorite Responsive and Mobile Email Resources:: https://litmus.com/blog/our-favorite-responsive-and-mobile-email-resources
[32] Optimizer JPG:: http://jpeg-optimizer.com/
[33] Tiny PNG:: https://tinypng.com/
[34] Multi-Column Responsive Layouts (Campaign Monitor):: https://www.campaignmonitor.com/dev-resources/guides/mobile/
[35] Responsive HTML Emails:: http://blog.fogcreek.com/responsive-html-emails-a-different-strategy/
[36] From Brad Frost's «This is Responsive»:: https://github.com/bradfrost
[37] Responsive Web Design Resources:: http://bradfrost.github.io/this-is-responsive/resources.html#email-design
[38] Как создать успешную рассылку: http://habrahabr.ru/company/pechkin/blog/252641/
[39] The best time of day to send emails (infographic):: http://www.adverblog.com/2012/10/12/the-best-time-of-day-to-send-emails-infographic/
[40] Deployment Times:: http://www.emailstatcenter.com/DeploymentTimes.html
[41] Email Still Dominates Sharing:: http://blog.digg.com/post/49264812779/were-still-learning
[42] Mobile vs Desktop (infographic):: https://www.pinterest.com/pin/34973334579201964/
[43] Heatmapping Technology CrazyEgg:: http://www.crazyegg.com/
[44] Litmus Scope:: https://litmus.com/scope/
[45] Emmet:: http://emmet.io/
[46] FFFFallBack Bulletproof Web Typography:: http://ffffallback.com/
[47] HTML Tidy:: http://infohound.net/tidy/
[48] Sublime Text:: http://www.sublimetext.com/
[49] Источник: https://habrahabr.ru/post/275603/
Нажмите здесь для печати.