E-mail маркетинг для интернет?магазина. Инструкция по внедрению
Шрифт:
• Кнопки сделать по габаритам, как в примере, но по внешнему виду – как кнопки на сайте (оранжевые):
3 товара
• Использовать
• Первую цену перечеркнуть, указать сниженную – ярче.
• Кнопки сделать по габаритам, как в примере, но по внешнему виду – как кнопки на сайте (синие).
2 товара
• Использовать настоящие товары с сайта (1 и 3 из первого блока)
• Последнюю цену перечеркнуть, указать сниженную – ярче.
• Одну кнопку сделать оранжевой, другую синей.
Товар слева
• Использовать настоящий товар с сайта (2 из первого блока)
Товар справа
• Повторить зеркально товар слева.
• Использовать настоящий товар с сайта (4 из первого блока).
Маркированный список
• Буллиты сделать цветными, необычными – можно галочки.
• Заголовок раздела: НАШИ ПРЕИМУЩЕСТВА.
• Текст:
• Первый пункт маркированного списка.
• Второй пункт маркированного списка.
• Третий пункт маркированного списка.
4. Футер
• Верхняя часть футера залита насыщенным фоном.
• Текст в 4 столбца.
• Нижняя часть футера на основном фоне письма.
• Текст по центру мелко, как в прехедере:
Вы получили это письмо, потому что зарегистрированы в интернет-магазине shop.example.
Вы всегда можете отписаться от нашей рассылки в один клик.
Б:
ТЗ на верстку e-mail шаблонаСверстать e-mail шаблон для массовой рассылки интернет-магазина.
1. Скачать исходник в PSD: ссылка на скачивание макета
2. Сверстать шаблон:
• Верстка нужна кросс-e-mail: чтобы корректно отображалась в распространенных почтовых клиентах (gmail, outlook, mail, yandex, rambler).
• Верстка нужна адаптивная: чтобы корректно отображалась на разных устройствах (смартфоны, планшеты).
• «Шапка» становится 'yже (лого ближе к телефону и дате).
• Баннер масштабируется.
• Текст масштабируется.
• Заголовок раздела масштабируется.
• Блок 4-го товара перестраивается в 2 строчки по 2 товара.
• Блок 3-го товара перестраивается в 3 строчки по 1 товару.
• Блок 2-го товара перестраивается в 2 строчки по 1 товару.
• Блоки картинка слева и справа становятся 'yже (ширина текста уменьшается).
• Маркированный список масштабируется.
• Верхняя часть футера перестраивается в 2 строчки по 2 столбца.
• Текст в нижней части футера масштабируется.
• Верстка нужна блочная: добавить в код комментарии, отмечающие начало и конец каждого блока:
3. В результате предоставить html-файл шаблона (картинки залить на сервер).
Материалы по теме
• Статья про верстку для e-mail: ссылка на статью.
• Статья про адаптивную верстку: ссылка на статью.
• Пример верстки шаблона (кросс-e-mail, адаптивный): ссылка на шаблон.
• Сервис для проверки верстки на разных устройствах: http://viewlike.us.
• Сервис для проверки верстки в разных почтовых клиентах/на разных устройствах:
https://litmus.com.
В: Чек-лист на подготовку рассылки
1. Получить информацию о тематике рассылки и товарах (набор ссылок) от руководителя.
2. Определить компоновку письма.
3. Скопировать одно из предыдущих писем (наиболее подходящее) и подогнать компоновку под текущее письмо.
4. Написать тексты для письма (черновик).
5. «Нарезать» картинки в размер.
6. Вставить тексты в письмо.
7. Вставить картинки в письмо (баннер, фото товаров, кнопки) и прописать ALT-тексты.
8. Вставить ссылки и прописать TITLE.
9. Доработать тексты (вступление, заголовки, P.S.).
10. Прописать PREHEADER.
11. Просмотреть письмо в браузере:
• вычитать тексты;
• прощелкать ссылки;
• проверить TITLE.
12. Отправить на тестовые ящики:
• вычитать тему и PREHEADER;
• проверить ALT (отображение без картинок);
• проверить корректность верстки (особенно в OUTLOOK!).
13. При необходимости внести правки и повторить тесты.
14. Согласовать письмо с руководителем.
15. Сгенерировать TXT-версию.
16. Проверить список (сегмент) для отправки и UTM-метку.
17. Поставить рассылку в расписание на отправку.
18. Проконтролировать отправку и внести данные в таблицу статистики рассылок.