Найти в Дзене

4 бесплатных конструктора для верстки и дизайна писем

Email-рассылки - это важный канал продвижения для бизнеса. Наверняка у вас в CRM хранится много контактов: кто-то уже совершал покупки, кто-то обращался с вопросом, а кому-то вы отправляли коммерческое предложение. Пора использовать эту базу, ведь все ваши контенты - это ваши потенциальные покупатели. Рассылки отправляются через специальные сервисы для рассылок. Их много: Mailchimp, Unisender, SendPulse, SendSay и много других. Но как сделать для них красивое письмо? Даже профессиональные верстальщики говорят, что верстка email-письма - это отдельный вид искусства. К счастью, сейчас появились специальные конструкторы писем. Они похожи на конструктор сайтов — вы выбираете подходящий шаблон и дальше меняете его как угодно, добавляя и убирая блоки. Можно выбрать разные карточки товаров, блоки с текстом, рекламные баннеры и футер с социальными сетями. Мы проверили 4 таких сервиса и рассказываем об их возможностях. Для чистоты эксперимента в каждом из сервисов мы создадим письмо с одина
Оглавление

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

Рассылки отправляются через специальные сервисы для рассылок. Их много: Mailchimp, Unisender, SendPulse, SendSay и много других. Но как сделать для них красивое письмо? Даже профессиональные верстальщики говорят, что верстка email-письма - это отдельный вид искусства. К счастью, сейчас появились специальные конструкторы писем. Они похожи на конструктор сайтов — вы выбираете подходящий шаблон и дальше меняете его как угодно, добавляя и убирая блоки. Можно выбрать разные карточки товаров, блоки с текстом, рекламные баннеры и футер с социальными сетями. Мы проверили 4 таких сервиса и рассказываем об их возможностях.

Для чистоты эксперимента в каждом из сервисов мы создадим письмо с одинаковым контентом. Для примера возьмем уведомление о совершении заказа - мы уже писали о структуре такого письма. И посмотрим, что из этого получится. Вместо данных о заказе будет ставить переменные - эти данные потом заполнит ваш интернет-магазин. Если вы отправляете рассылку вручную, то просто дополните нужные блоки. Ну что, вперед?

1. Chamaileon

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

Ограничения бесплатной версии: можно экспортировать шаблон до 5 раз в месяц.

Язык интерфейса и техподдержки: английский.

Сайт: chamaileon.io.

 Мы доработали один из готовых шаблонов с тегом «Ecommerce»
Мы доработали один из готовых шаблонов с тегом «Ecommerce»

2. Topol

Если вы хотя бы раз делали картинки в сервисе Canva, то этот конструктор покажется вам простым и знакомым. Интерфейс очень похож на этот редактор.

Чтобы создать шаблон, можно выбрать один из 7 шаблонов или делать письмо с нуля. Проще всего взять за основу готовые шаблоны, ведь их можно изменить до неузнаваемости. При экспорте сохраняются ссылки на картинки из шаблона (например, иконки социальных сетей), а добавленные вами придется разместить где-то еще и указать ссылку.

Ограничения бесплатной версии: 7 готовых шаблонов писем. Картинки из шаблона доступны по ссылке, а пользовательские придется сохранить и указать ссылку.

Язык интерфейса и техподдержки: английский.

Сайт: topol.io.

Мы взяли готовый шаблон письма изменили его. Логотип сделали текстовым и обошлись без дополнительных картинок
Мы взяли готовый шаблон письма изменили его. Логотип сделали текстовым и обошлись без дополнительных картинок

3. Stripo

Достоинство Stripo — много шаблонов для разный целей и тематик. Есть даже 8 шаблонов специально для подтверждения заказа. В бесплатной версии количество используемых шаблонов ограничено, зато легко скопировать html-код и вставить в шаблон. Любой шаблон можно изменить и дополнить: для этого есть блоки разных уровней: structures — это количество колонок, blocks — это виджеты с текстом и другими важными элементами, modules — это готовые блоки.

Сразу в редакторе можно работать с изображениями: обрезать, наложить фильтр или текст. Это удобно, ведь вы сразу видите, как картинка будет выглядеть в письме. Еще к изображениям можно добавлять ссылку на сайт, статью или товар.

Ограничения бесплатной версии: до 2 шаблонов на проект, до 5 тестовых писем в день.

Язык интерфейса: английский.

Сайт: stripo.email.

Мы использовали готовый шаблон письма о подтверждении заказа «Собачий корм» и изменили его под проект
Мы использовали готовый шаблон письма о подтверждении заказа «Собачий корм» и изменили его под проект

4. BEE Free

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

Пользоваться конструктором очень легко. Весь контент строится на основе строк: вы сначала перетаскиваете в макет строку с нужным числом колонок (rows), а затем наполняете ее любым контентом. Письмо получается аккуратным и отлично смотрится в почтовых клиентах.

Главный минус конструктора в том, что на бесплатном тарифе он не сохраняет картинки на своем сервере. Макет скачивается в виде архива, в котором будут html-файл и отдельная папка с изображениями.

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

Язык интерфейса: английский.

Сайт: beefree.io.

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

Когда письмо будет готово, вам останется только скопировать html-код и вставить его в поле «Источник» в сервисе рассылок.

Обязательно сделайте тестовую покупку в своем магазине и посмотрите, как уведомление выглядит на разных почтовых клиентах — почте yandex.ru, mail.ru и gmаil.cоm. Если возникнут проблемы, обратитесь в поддержку выбранного конструктора email-писем — там вам помогут исправить шаблон.

Пусть у вас все получится!

***

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

Зарегистрируйтесь на сайте конструктора сайтов Vigbo и создайте собственный интернет-магазин со скидкой 30%. Выберите готовый дизайн, добавьте товары в каталог, подключите системы оплаты — и начните продавать свои изделия!

Хочу красивый сайт →

***

Оригинал: блог Vigbo.