Добро. Больше чем уверен, Вам понравится эта статья. А точнее понравится то, что лежит в архиве. А точнее в архивах, а если еще точнее то в 10-и архивах. :)) Затянул. Выкладываю я, дорогие подписчики, 10 офигенных адаптивных шаблонов email писем.
Каждое письмо почищено, проверено, упаковано в архивчик и залито для того, чтобы вы нажали кнопочку «Скачать» и сохранили шаблон email письма у себя на компьютере. Это настоящий подарок для того, кто увлекается email рассылками. Мне же интересны эти шаблоны с точки зрения уведомлений посетителям, которые оставили заявку на обратный звонок на сайте или заказали какой-либо товар на одном из моих интернет магазинов. Хотя многие из этих email шаблонов запросто можно использовать как и обычный промо-сайт. Но все таки лучше посмотреть , благо их уже собралось не малое количество.
Верстать email шаблоны дано не каждому, так как там есть свои правила. Но больших отличий email писем от обычных сайтов на html нет. Единственные отличия, это css внутри html и наличие уже устаревшей на сайтах табличной верстки. Поэтому знания html будет достаточно для создания email письма. Для этого не нужно проходить профессиональное обучение web-дизайну. Но ведь гораздо легче скачать варианты, которые ходят в интернете в свободном доступе. И вот один из таких вариантов. Смотрим, радуемся, качаем.
Email шаблон под кодовым названием «Focus»
Идеально подойдет для интернет магазина одежды или аксессуаров. На фотографиях этого email шаблона представлены кожанные сумка, кошелек и чехлы для телефона.
Крутецкий email шаблончик «Summers coming»
Полностью адаптивный резиновый легкий простой email шаблон
Отлично сверстанный шаблон или платформа для email шаблона. Здесь нет картинок, иконок и так далее. Это пример как нужно верстать email шаблоны. Отлично подойдет для уведомлений о регистрации, подтверждение пароля и так далее.
Симпатичный шаблон email письма в синих тонах под названием «Minty»
Смешной и стильный шаблон email письма с несколькими блоками. Наверное, лучше всего подойдет для рассылки статей с новостного портала или блога.
СкачатьEmail шаблон «Nexit» для интернет магазина
Серьезное email письмо. Судя по картинкам - это рассылка интернет магазина женской одежды. Отлично представлены скидки, акции и популярные позиции с ценами. Отличный рекламный email инструмент.
Строгий стильный шаблон для email письма «Simples»
Люблю минимализм. А это, черт возьми, самое ярое воплощение минимализма. Тонкий шрифт, стильные изображения и иконки. Все как надо. Отличный email шаблон для рассылки акционных товаров в интернет магазине техники, преимущественно компьютерной.
Email шаблон «Tempo» на тему туризма
Мини сайт в формате email письма. Здесь есть и меню и мини баннер. Очень хорошо подойдет для рассылки горящих туров (если это туристическая компания) или свежие предложения квартир (риелторская контора или агентство недвижимости)
Простой двублочный шаблон «Tubor» для email рассылки
Простой, не обозначенный тематически, шаблон email письма под названием «Tubor».
Коричневый странный html шаблон email «Underscore»
Шаблон email письма «Wooshi» email рассылки ресторана или кафе
Каждый шаблон имеет адаптивную верстку, поэтому они будут также молодцом держаться на мобильных девайсах. Также, каждое email письмо в этой сборке сделано по всем правилам email письма. Есть ссылки на головной сайт, мобильную версию и ссылка, чтобы отписаться от рассылки. Хороший получился пост. Надеюсь, Вы почерпнули из него нужные вам шаблончики. Рад был помочь, до новых постов. Также вы можете скачать сразу все 10 шаблонов email писем, нажав на кнопка «Скачать», которая ниже.
Stripo предлагает широкий выбор бесплатных шаблонов емейл-рассылок. Они сгруппированы по сферам бизнеса и категориям, такие как особые события, праздники и т.д. Наши шаблоны предварительно разработаны для всех типов триггерных сообщений, для сферы юридических и консалтинговых услуг, для промо-сообщений и других типов сообщений.
Здесь вы найдете емейл-маркетинговые шаблоны, которые удовлетворяют ваши запросы и отвечают вашему вкусу.
Почему мы так в этом уверены:
Адаптивный веб-дизайн
Все шаблоны Stripo полностью адаптивны. Это означает, что все мобильные устройства и большинство почтовиков отображают их правильно.
Тем не менее вы можете выбрать любое изображение, блок или структуру и сделать их неадаптивными, если хотите, чтобы определенные элементы ваших емейл-шаблонов оставались без изменений.
Также благодаря открытому HTML-коду наших бесплатных емейл-шаблонов есть возможность выбирать, какие изображения и блоки будут отображаться на мобильных девайсах , а какие – только на десктопных устройствах.
Используйте наши HTML-шаблоны сообщений для самых разных маркетинговых кампаний.
Два редактора в одном
Наш инструмент нового поколения сочетает в себе открытый HTML/CSS-код и drag-and-drop редактор.
Эта особенность дает вам возможность работать над дизайном визуальных элементов и текста путем перетаскивания в drag-and-drop части инструмента. Благодаря HTML коду вы можете встраивать видео и интерактивные элементы в шаблон рассылки и возвращаться к дизайну визуальных элементов, не выходя из редактора.
Создание баннеров
С помощью Stripo вы можете легко создавать баннеры, обрабатывать их в редакторе и помещать текст поверх баннера. Благодаря этой функции у вас есть возможность использовать баннеры многократно. Теперь вам не нужны никакие дополнительные инструменты (например, фоторедакторы), чтобы сделать адаптивный HTML-шаблон креативным и настроенным в соответствии с вашими пожеланиями.
Широко известно, что почтовики заменяют декоративные шрифты веб-безопасными. При этом дизайн вашего емейла теряет свой особый шарм. Но Stripo позволяет применять любой шрифт, который вам нравится, из доступных в нашем редакторе. Как это сделать? Просто разместите текст поверх баннера, выберите для него подходящий цвет и примените к тексту полюбившийся вам декоративный шрифт.
Емейл-клиенты расценивают текст, добавленный поверх любого изображения, как элемент самого изображения. Таким образом, подписчики увидят ваш текст, добавленный в бесплатный HTML-шаблон, именно в таком виде, как было задумано.
Автоматизация работы - наши уникальные смарт-элементы
Создание карточек товаров – довольно утомительный процесс. Но Stripo делает все, чтобы облегчить эту работу для вас. После некоторой настройки смарт-элементов, вам нужно будет просто вставить ссылку в нужную строку. Описание, стоимость, образец товара будут автоматически вставлены в соответствующие поля. Для вашего удобства мы уже добавили смарт-элементы в некоторые HTML-шаблоны сообщений . Stripo экономит ваше время!
Личная библиотека модулей в Stripo
Создавайте, редактируйте и сохраняйте блоки/структуры/полосы/контейнеры контента в своей личной библиотеке. Вы можете использовать их в любое время при запуске новой емейл-кампании.
Наши существующие бесплатные шаблоны автоматически разделены на модули, которые уже доступны в личной библиотеке.
Простой экспорт
Адаптивные шаблоны сообщений Stripo легко экспортируются в большинство емейл-провайдеров и популярных почтовиков, таких как Gmail и Outlook .
Отличная новость: наши емейл-шаблоны доступны для редактирования даже после экспорта. Благодаря продвинутой интеграции вы можете делать всевозможные изменения HTML-кода, текста и визуальных элементов. Эта опция делает адаптивные HTML-шаблоны Stripo дружественными по отношению к емейл-клиентам и провайдерам.
Для вашего удобства вы также можете сортировать свои емейл-шаблоны по папкам.
Емейл-маркетинг - наша страсть, и поэтому Stripo разрабатывает профессиональные шаблоны рассылок с настоящей любовью.
Показать больше
Неудивительно, что существуют целые сайты, посвященные примерам маркетинговых и транзакционных писем, а также конструкторы HTML-шаблонов. В этой статье я постараюсь собрать список наиболее популярных и интересных.
Сайты шаблонов- TemplateMonster Это, в первую очередь, каталог шаблонов для веба, но также есть и достаточно большая категория шаблонов для e-mail рассылок (160 на момент написания этой статьи). Цены умеренные.
- GoodEmailCopy Ещё один сайт с примерами транзакционных писем от крупных Интернет-компаний. Удобный поиск по тегам. Удобно, что всё на одной странице и работает очень быстро. Неудобно, что они сохранили только текст и удалили весь дизайн и разметку, а это очень важно.
- EmailDrips Примерно полсотни вручную отобранных примеров писем известных компаний. Удобный фильтр категорий. Сайт отличается от многих других подобных тем, что содержит советы и комментарии по сериям писем.
- GetMailto На этом сайте вам предлагается за $89 купить набор шаблонов для всех случаев жизни. Утверждение, конечно же, спорное, так как при принципе «One fits all» работает не всегда и не везде. Впрочем, для начинающих компаний и стартапов очень даже может подойти.
- GoodSalesEmails Примеры писем известных компаний для сейлз-менеджеров. Удобно, что в шаблоны сразу же вставлены макросы подстановки. Этот сайт интересен тем, что собирает письма узкой направленности, с чёткой целью что-то кому-то продать.
- EmailsFresh Коллекция примеров писем с категориями по индустриям. Не шаблоны, реальные примеры. В сумме несколько сотен шаблонов. Преимущественно транзакционные письма
На выше приведённых сайт (кроме TemplateMonster и GetMailTo) представлены примеры реальных писем реальных компаний. Просто так брать и использовать их нельзя, так как это защищено авторским правом. Легально использовать можно шаблоны, которые продаются или раздаются бесплатно. Например, на СендПульсе вы сможете найти более 150 шаблонов для разных случаев жизни.
Конструкторы шаблонов- EmailFactory Новый сервис автоматической генерации шаблонов для e-mail рассылок. Самым важным преимуществом является генерация шаблона на основе вашего сайта. EmailFactory может распознать ключевые элементы на вашем сайте, такие как логотип, описание компании, цветовая гамма и создать шаблон для ближайших событий. Есть удобная интеграция с SendPulse и другими менее популярными в России сервисами.
- Tilda . Конструктор шаблонов писем – это относительное новая услуга. Есть интеграция с аккаунтами в MailChimp и SendGrid, а с аккаунтами SendPulse интеграция через Zapier . Можно получить HTML-код письма и импортировать его в другой сервис рассылок. Все шаблоны адаптивные, письма корректно отображаются на разных устройствах. Конструктор состоит из четырех блоков: текст, изображения или gif-анимация, карточки товаров и статей, шапка и футер. Есть функция добавления фонового изображения. В шаблон от Тильды к карточкам товаров можно добавлять кнопки действий. А также у каждого письма своя страница с адресом.
- MailCult Это итальянский сервис, похож по функционалу на EmailFactory. Есть интеграциям с несколькими сервисами рассылок. Сервис бесплатный, но, похоже, именно по этой причине выглядит заброшенным и не развивается.
- Mosaico Редактор шаблонов, работает по лицензии open-source. Можно скачать код проекта с Гитхаба и приспособить для своих целей. Заявлена корректная генерация HTML-кода для всех самых популярных почтовых приложений.
- RocketWay Ещё один конструктор шаблонов, который на самом деле работает больше как агентство, через менеджера. Экспорт в популярные на западе сервисы рассылок.
- InkBrush Бесплатный сервис для генерации адаптивного HTML-кода для рассылок от компании MovableInk. Их уникального – позволяет загрузить просто картинку или PSD-файл, и далее сделать HTML-вёрстку в конструкторе. Есть экспорт в сервисы рассылок, но всего лишь два раза в месяц.
- Stripo .Email Конструктор HTML-писем от украинской компании еСпутник. Есть прямой экспорт в еСпутник, MailChimp и GetResponse. Сервис бесплатный для всех, каких-то выдающихся уникальных особенностей мы не обнаружили.
- BeeFree Продукт от небольшого итальянского сервиса рассылки MailUp. Никаких уникальных особенностей нет, просто неплохой конструктор HTML-писем.
Можно сделать вывод, что редактор HTML-писем есть в любом приличном сервисе e-mail рассылки и работает он, как правило, неплохо. Смысл использовать сторонние решения есть только при наличии таких уникальных особенностей, как автоматическая генерация шаблона, как у EmailFactory , создание шаблона на основе картинки, как у InkBrush.
Почти 50% всех электронных писем открывается с мобильных устройств, и этот показатель будет только увеличиваться. Поэтому важность использования адаптивных HTML шаблонов писем для email маркетинговых кампаний возрастает.
Разработать базовый HTML-шаблон электронных писем , который будет корректно отображаться в разных клиентах, довольно непросто. Но разработать шаблон, который будет корректно отображаться также на всех мобильных и планшетах, еще сложнее.
К счастью, есть дизайнеры и разработчики, создавшие коллекции редактируемых бесплатных адаптивных шаблонов электронных писем, которые работают во всех клиентах и на любых устройствах.
Блочно-модульные адаптивные шаблоны
Litmus Responsive Email Templates (7 шаблонов)
Litmus выпустил подборку из семи адаптивных шаблонов электронных писем с готовым дизайном. Они поставляются с исходными файлами PSD :
Green Village HTML Templates
Это минималистичный блочно-модульный HTML шаблон письма для рассылки, который подходит для различных целей. Загружаемый пакет включает в себя как исходный PSD-файл , так и HTML-код :
Responsive Email Template от Email on Acid
Этот блочно-модульный шаблон предлагает три варианта дизайна, которые отображаются в зависимости от ширины экрана. По умолчанию, он поддерживает 1-3 колонки, Он использует медиа-запросы, поэтому на мобильных устройствах преобразуется в одностолбцовый макет:
Basic Responsive Email Template
Simple Responsive HTML Email
Простой блочно-модульный адаптивный шаблон HTML письма для email рассылки использует медиа-запросы и плавающую ширину, чтобы обеспечить максимальную совместимость:
Responsive & Flat Newsletter Template
Responsive Email Template
Шаблоны электронных писем с чистой структурой
Responsive Email Blueprints от MailChimp (6 шаблонов)
MailChimp выпустил подборку из шести адаптивных готовых шаблонов писем для рассылки HTML под названием Email Blueprints . Они включают в себя некоторые элементы специфического языка шаблонов Mailchimp , но их можно легко удалить, если вы не являетесь пользователем MailChimp :
Ink – A Responsive Email Framework (4 шаблона)
Это адаптивный Email-фреймворк от ZURB , который включает в себя сетку из 12 столбцов и простые элементы пользовательского интерфейса для быстрой разработки электронных писем:
Antwort Responsive Email Layout Templates (2 шаблона)
Antwort предлагает надежные адаптивные шаблоны электронных писем HTML с обширной документацией и с настраиваемой шириной в зависимости от размеров экрана. Шаблоны отлично работают в мобильных клиентах, а также во всех основных стационарных клиентах и в Outlook (2000+) :
Salted, A Responsive Email Template
Шаблон разработан на основе кода, используемого Litmus для своих собственных рассылок. Предлагает простую основу для построения адаптивных электронных писем, созданных на HTML :
A Table-Based (but Responsive) Email Template
Этот красивый шаблон HTML письма был разработан на основе E-mail Blueprints от MailChimp и Email Boilerplate от Шона Пауэлла . Это адаптивный табличный шаблон электронных писем, который уже включает в себя теги объединения Mailchimp (их можно удалить, если они не нужны ):
Respmail Responsive Email Template
Улучшенная версия MailChimps Email Blueprints с большим количеством опций, заново определенной структурой и рядом исправлений для Outlook , Yahoo , Hotmail , Gmail … Данный шаблон был протестирован и тщательно проанализирован на предмет совместимости. Также он невероятно прост в настройке:
rwdemail
Разработанный на основе шаблонов Ink от ZURB . Это проект, который позволяет автоматизировать все, начиная от прекомпиляции SASS , встраивания CSS , CSS / HTML , минимизации изображений и до S3-хостинга изображений и тестирования Litmus . С помощью шаблонов INK и их CSS-образцов можно создавать шаблоны HTML письма любого уровня сложности.
Future-Proof Responsive Email Template Without Media Queries
А что, если бы можно было создавать адаптивные шаблоны электронных писем даже в средах с неудовлетворительной поддержкой CSS? Шаблон вы найдете здесь :
Другие ресурсы для создания шаблонов электронных писем
- Responsive Email Patterns — подборка шаблонов и модулей для адаптивных электронных писем;
- Cerberus — шаблоны для адаптивных электронных писем;
- Really Good Emails — лучшие дизайны для HTML шаблонов писем;
- Responsive Email Resources — подборка инструментов для создания адаптивных шаблонов электронных писем.
Перевод статьи «30 Free Responsive Email and Newsletter Templates » был подготовлен дружной командой проекта