На чистом HTML. Как не странно, за два года в бесплатном доступе появилось не так уж и много бесплатных решений, но то, что удалось найти, значительно превосходит по качеству любой из старой статьи.
E-mail рассылки , несомненно, мощнейший инструмент маркетолога, но пользоваться им нужно очень осторожно. Наш народ никогда не был в восторге от рекламных писем в почтовом ящике, но если вы хороший маркетолог, то сумеете войти в контакт с получателем письма. Данная подборка не решит всех проблем, связанных с рассылками и даже не поможет их обойти, ведь обратит внимание получатель на ваше письмо, удалит или отправит его в спам, зависит не от того, какой красивый в будет дизайн, а от содержимого. Все, что я хотел сказать этой фразой - не шлите спам или каких-либо шаблонных предложений. Используйте эти html шаблоны с умом и без вреда окружающим.
Еще раз повторю, не рассылайте спам, лучше применить эти шаблоны для рассылки различных поздравлений для ваших клиентов с праздниками. Если у вас есть интернет-магазин и имеется база пользователей, которые действительно хотят получать от вас письма, можете на остове любого html шаблона сделать рассылку с оповещением о какой-либо акции или скидке.
Итак. К вашему вниманию 20 бесплатных E-mail шаблонов для рассылок . Пользуйтесь с умом.

Бесплатный HTML + PSD E-mail шаблон: PHStock Template

Адаптивный E-mail шаблон для интернет-магазина

Бесплатный E-mail шаблон для мероприятия

Green Village - хипстерский E-mail шаблон для блогера

Photon - E-mail шаблон для фотоблога

KATAUSTRIA - адаптивный Email шаблон

Boxi - бесплатный E-mail шаблон в стиле Meto / Flat

Miks Blogger Newsletter - универсальный E-mail шаблон для блогера

Новостной HTML + PSD Email шаблон

Бесплатный E-mail шаблон в зеленых тонах

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 разрабатывает профессиональные шаблоны рассылок с настоящей любовью.

Показать больше

Добро. Больше чем уверен, Вам понравится эта статья. А точнее понравится то, что лежит в архиве. А точнее в архивах, а если еще точнее то в 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 писем, нажав на кнопка «Скачать», которая ниже.

Здравствуйте дорогие читатели – сайт!

Сегодня я покажу, как сделать красивый для E-mail рассылки.

Уже давно ни для кого не секрет, что весь бизнес в Интернете построен на E-mail маркетинге.

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

Но, что бы на такое предложение обратили внимание, а не сразу отправили в папку «спам», нужно привлечь к нему внимание.

Для этого будет уместным сделать красиво оформленный HTML шаблон письма.

Специально для Вас я подобрал тестовый шаблон, который будет наглядным пособием.

Что и как мы будем делать?

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

Создание каркаса и таблицы-контейнера

Для начала нам нужно сделать HTML каркас нашего письма. Выглядеть это будет так:

Обратите внимание, что ширину таблицы я задал 99% , оставив вокруг небольшое расстояние. Это не моё личное желание, а требование некоторых почтовых Веб-клиентов таких, как Gmail и Yahoo . Остальная часть нашей электронной почты будет находиться в этой одной ячейке таблицы, которая расположена по центру.

Следующий шаг заключается в создании обёртки таблицы фактического содержания письма. Сохраняйте максимальный размер конструкции не более 600 пикселей:

Вместе с тенью света на белом фоне наш шаблон письма был растянут до 640px , но его рабочая зона по-прежнему осталась равной 600px .

Создание шапки

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

Верхняя строка

Начиная с этого момента, я буду исключать ранее написанный код (рамки таблицы).

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

Возникли проблемы при просмотре этого письма? Щелкните здесь для просмотра.

А за её внешний вид отвечает CSS стиль:

/* Fonts and Typography */ .footer { font-family: Arial,Helvetica,sans-serif; font-size: 11px; color: #fff; padding-right: 20px; }

Логотип и иконки социальных сетей

Опускаясь ниже, мы видим логотип и , которые расположены на одном уровне.

За их вывод отвечает вот такой код:

Вдобавок, ко всем нашим изображения в HTML шаблоне письма добавляются следующие стили:

/* Backgrounds */ .email_background { width: 640px; background: url("email_images/email_bg.jpg") repeat-y; } /* Images */ img { display: block; border: none; }

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

Добавление содержания

Сначала мы начнём с добавления первого изображения, которое в данном дизайне имеет размер 560px на 210px . Вы также можете увидеть милую деформированную тень под изображением, которая была сделана отдельно, что позволяет быстро менять изображения, не теряя тень. Давайте перейдем к коду:

Здесь мы создали новую строку для показа больших изображений, установив ширину до 560px с добавление 20px отступов с обеих сторон. Те же действия мы проделали и с тенью.

Добавление заголовка и содержания

Перемещаясь ниже, мы видим заголовок основного материала и непосредственно само содержимое. Здесь за вывод контента отвечает вот такой код:

This is your featured story

Существует мнение, что Паттайя стала популярным курортом благодаря тому, что тут часто отдыхали американские моряки, которых впрочем, тут и сейчас большое количество и они всегда в окружении нескольких таек. Естественно среди наших соотечественников он менее популярен, чем Египет и Турция. Но родную речь тут слышно повсеместно)) и в торговых комплексах во время шоппинга и во множестве здешних баров)). Паттайя в основном знаменита своей ночной жизнью, морем и текстилем. Конечно, кроме всего прочего тут можно найти множество других интересностей. Здесь можно брать в прокат любой транспорт, в том числе и джипы и скутеры. Для любителей мототехники тут вообще райский уголок. Чтобы взять в аренду мотобайк права могут даже и не потребовать, всего за 100-500 бат (плюс залог в размере 2 000 бат) можно арендовать приличный скутер и погонять в свое удовольствие!

Чтобы изменить внешний вид заголовка и текста шаблона письма, достаточно воспользоваться следующими стилями:

H1 { color: #e95f03; font-family: Futura, Verdana, Sans-Serif; padding: 0; margin: 0; font-size: 24px; font-weight: normal; } .content { padding: 0; margin: 0; } p { font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 20px; }

Дополнительное содержимое

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

This is a secondary headline	This is a secondary headline
Несмотря на погубленную репутацию Паттаи, здесь можно узнать, что пресловутый тайский массаж - не только прикрытие для борделей. В Таиланде действительно делают неплохой массаж, а лучшими специалистами в этом искусстве считаются слепые мастера. Их секрет заключается в повышенной чувствительности пальцев.	Центральная улица и сердце Паттайи, которая никого не оставляет равнодушным. Местный Арбат, Таймс-Сквер и Содом с Гоморрой в одном стакане, «Уокинг Стрит» – настоящий источник любви и ненависти как для местных жителей, так и для приезжих. Говорим «Паттайя», подразумеваем Walking Street.

Здесь нам ещё потребуется добавить дополнительный стиль. Вот он:

H2 { color: #e95f03; font-family: Futura, Verdana, Sans-Serif; padding: 0; margin: 0; font-size: 18px; font-weight: normal; }

Закрытие HTML шаблона письма

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

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

Здесь Вам необходим такой код:

Рассылка от: Иванов Иван
Автор блога: Ivan.ru

Хотите отказаться от подписки? Нажмите здесь

Заключение

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

Тестовый HTML шаблон письма был дан, как пособие, которое Вы можете в любой момент переверстать на свой вкус и цвет.

На сегодня это всё. Надеюсь, что Вам понравилось.

До новых статей…

С уважением, Денис Черников!