(Здесь и далее приводятся в пример скриншоты подобранного прототипа.)
• Слева: логотип магазина.
• Справа: значок телефонного аппарата + номер +7 (777) 777–77–77.
• Ниже надпись: НОЯБРЬ 2014.
3. Тело письма
Баннер
![Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_144.jpg] Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_144.jpg]](img/book_covers/066/66927/i_144.jpg)
• Взять любой из тех, которые сейчас есть на главной странице.
• Отмасштабировать до ширины 600px.
Текст
• Заголовок: Большой заголовок.
• Подзаголовок: Подзаголовок рассылки интернет-магазина.
• Текст:
Хотя погода за окном еще далеко не летняя, само лето, пора долгожданных отпусков, приближается!
Скоро, скоро в дорогу: сборы чемоданов, аэропорт, гостиница, теплый песок на пляже…
А чтобы Вы путешествовали с комфортом и привезли домой много сувениров для друзей и приятных воспоминаний для себя, запасайтесь сумками побольше!:-)
Заголовок раздела
![Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_145.jpg] Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_145.jpg]](img/book_covers/066/66927/i_145.jpg)
• Горизонтальная полоса с заливкой фирменным цветом.
• НАШИ НОВИНКИ.
4 товара
![Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_146.jpg] Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_146.jpg]](img/book_covers/066/66927/i_146.jpg)
• Использовать настоящие товары с сайта:
Ссылка на товар 1
Ссылка на товар 2
Ссылка на товар 3
Ссылка на товар 4
![Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_147.jpg] Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_147.jpg]](img/book_covers/066/66927/i_147.jpg)
• Кнопки сделать по габаритам, как в примере, но по внешнему виду – как кнопки на сайте (оранжевые):
![Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_148.jpg] Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_148.jpg]](img/book_covers/066/66927/i_148.jpg)
3 товара
![Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_149.jpg] Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_149.jpg]](img/book_covers/066/66927/i_149.jpg)
• Использовать настоящие товары с сайта (1, 2 и 3 из первого блока):
![Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_150.jpg] Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_150.jpg]](img/book_covers/066/66927/i_150.jpg)
• Первую цену перечеркнуть, указать сниженную – ярче.
• Кнопки сделать по габаритам, как в примере, но по внешнему виду – как кнопки на сайте (синие).
2 товара
![Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_151.jpg] Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_151.jpg]](img/book_covers/066/66927/i_151.jpg)
• Использовать настоящие товары с сайта (1 и 3 из первого блока)
![Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_152.jpg] Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_152.jpg]](img/book_covers/066/66927/i_152.jpg)
• Последнюю цену перечеркнуть, указать сниженную – ярче.
• Одну кнопку сделать оранжевой, другую синей.
Товар слева
![Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_153.jpg] Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_153.jpg]](img/book_covers/066/66927/i_153.jpg)
• Использовать настоящий товар с сайта (2 из первого блока)
![Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_154.jpg] Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_154.jpg]](img/book_covers/066/66927/i_154.jpg)
Товар справа
• Повторить зеркально товар слева.
• Использовать настоящий товар с сайта (4 из первого блока).
Маркированный список
• Буллиты сделать цветными, необычными – можно галочки.
• Заголовок раздела: НАШИ ПРЕИМУЩЕСТВА.
• Текст:
• Первый пункт маркированного списка.
• Второй пункт маркированного списка.
• Третий пункт маркированного списка.
4. Футер
![Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_155.jpg] Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_155.jpg]](img/book_covers/066/66927/i_155.jpg)
• Верхняя часть футера залита насыщенным фоном.
• Текст в 4 столбца.
![Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_156.jpg] Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_156.jpg]](img/book_covers/066/66927/i_156.jpg)
![Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_157.jpg] Иллюстрация к книге — E-mail маркетинг для интернет?магазина. Инструкция по внедрению [i_157.jpg]](img/book_covers/066/66927/i_157.jpg)
• Нижняя часть футера на основном фоне письма.
• Текст по центру мелко, как в прехедере:
Вы получили это письмо, потому что зарегистрированы в интернет-магазине shop.example.
Вы всегда можете отписаться от нашей рассылки в один клик.
© 2014 Shop-example
Б: ТЗ на верстку e-mail шаблона
Сверстать e-mail шаблон для массовой рассылки интернет-магазина.
1. Скачать исходник в PSD: ссылка на скачивание макета
2. Сверстать шаблон:
• Верстка нужна кросс-e-mail: чтобы корректно отображалась в распространенных почтовых клиентах (gmail, outlook, mail, yandex, rambler).
• Верстка нужна адаптивная: чтобы корректно отображалась на разных устройствах (смартфоны, планшеты).
• «Шапка» становится ýже (лого ближе к телефону и дате).