Post on 20-Aug-2015
КАК СДЕЛАТЬ ШАБЛОН ПРОДАЮЩЕГО ПИСЬМА
Юрий Цыганков
Руководитель отдела дизайна и креатива
компании EmailMatrix
ЭЛЕМЕНТЫ ДИЗАЙНА ПИСЬМА • Структура письма
• Особенности дизайна писем
• Примеры
• Рекомендации
СТРУКТУРА ПИСЬМА
СТРУКТУРА ПИСЬМА • Прехедер
Текст для превью-панелей, отписка, контакты
ПРИМЕР ВЫВОДА ПРЕХЕДЕРА В ПОЧТЕ GMAIL.COM
СТРУКТУРА ПИСЬМА • Прехедер
Текст для превью-панелей, отписка, контакты
• Шапка Логотип, важные ссылки, телефон, социальные сети
СТРУКТУРА ПИСЬМА • Прехедер
Текст для превью-панелей, отписка, контакты
• Шапка Логотип, важные ссылки, телефон, социальные сети
• Постхедер Меню, дата
СТРУКТУРА ПИСЬМА • Прехедер
Текст для превью-панелей, отписка, контакты
• Шапка Логотип, важные ссылки, телефон, социальные сети
• Постхедер Меню, дата
• Тело Рабочая часть письма (контент, графика, сетка товаров и т. д.)
СТРУКТУРА ПИСЬМА • Прехедер
Текст для превью-панелей, отписка, контакты
• Шапка Логотип, важные ссылки, телефон, социальные сети
• Постхедер Меню, дата
• Тело Рабочая часть письма (контент, графика, сетка товаров и т. д.)
• Префутер Блоки с дополнительными анонсами, скидками, акциями, событиями
СТРУКТУРА ПИСЬМА • Прехедер
Текст для превью-панелей, отписка, контакты
• Шапка Логотип, важные ссылки, телефон, социальные сети
• Постхедер Меню, дата
• Тело Рабочая часть письма (контент, графика, сетка товаров и т.д.)
• Префутер Блоки с дополнительными анонсами, скидками, акциями, событиями
• Футер Меню, социальные сети, телефон
СТРУКТУРА ПИСЬМА • Прехедер
Текст для превью-панелей, отписка, контакты
• Шапка Логотип, важные ссылки, телефон, социальные сети
• Постхедер Меню, дата
• Тело Рабочая часть письма (контент, графика, сетка товаров и т.д.)
• Префутер Блоки с дополнительными анонсами, скидками, акциями, событиями
• Футер Меню, социальные сети, телефон
• Постфутер Юридическая информация и копирайт
ОСОБЕННОСТИ ДИЗАЙНА ПИСЕМ Делайте письмо структурно, проще. Помните о верстке.
ОСОБЕННОСТИ ДИЗАЙНА ПИСЕМ Старайтесь не использовать много мелких элементов или очень больших картинок.
ОСОБЕННОСТИ ДИЗАЙНА ПИСЕМ Используйте всю видимую область письма, не перегружая лишним.
ОСОБЕННОСТИ ДИЗАЙНА ПИСЕМ Постарайтесь сделать графику качественной и понятной.
ОСОБЕННОСТИ ДИЗАЙНА ПИСЕМ Делайте такое письмо, чтобы оно было красивым даже без картинок.
ОСОБЕННОСТИ ДИЗАЙНА ПИСЕМ
ОСОБЕННОСТИ ДИЗАЙНА ПИСЕМ
Важен верх и низ письма
ШАПКА И ФУТЕР
ОСОБЕННОСТИ ДИЗАЙНА ПИСЕМ
Важен верх и низ письма
Никто не любит много читать
ШАПКА И ФУТЕР
МЕНЬШЕ ТЕКСТА
ОСОБЕННОСТИ ДИЗАЙНА ПИСЕМ
Важен верх и низ письма
Никто не любит много читать
Бесстрашно ведите к цели
ШАПКА И ФУТЕР
МЕНЬШЕ ТЕКСТА
ПРИЗЫВ К ДЕЙСТВИЮ
ОСОБЕННОСТИ ДИЗАЙНА ПИСЕМ
Важен верх и низ письма
Никто не любит много читать
Бесстрашно ведите к цели
Голое, но красивое
ШАПКА И ФУТЕР
МЕНЬШЕ ТЕКСТА
ПРИЗЫВ К ДЕЙСТВИЮ
КРАСОТА БЕЗ КАРТИНОК
КЛАССИЧЕСКИЙ ДИЗАЙН: СТИЛЬНО И КРАСИВО
КРЕАТИВНЫЙ ДИЗАЙН: ЛАКОНИЧНО И ИНТЕРЕСНО
ПЛОХОЙ ДИЗАЙН: ХАОС И УЖАС
ВЫВОДЫ И РЕКОМЕНДАЦИИ • Помните, что письмо потом будет
верстаться
ВЫВОДЫ И РЕКОМЕНДАЦИИ • Помните, что письмо потом будет
верстаться
• Соблюдайте привычную структуру ― это упрощает жизнь всем
ВЫВОДЫ И РЕКОМЕНДАЦИИ • Помните, что письмо потом будет
верстаться
• Соблюдайте привычную структуру ― это упрощает жизнь всем
• Фантазируйте и экспериментируйте. Но не переусердствуйте! Иначе ваше письмо превратится в груду цветных картинок
ХОТИТЕ БОЛЬШЕ ПРАКТИЧЕСКИХ НАВЫКОВ? Получите 24 часа бесплатного доступа к интерактивному курсу Юрия Цыганкова «Дизайн писем в email-маркетинге»!
Пройти курс бесплатно
БОЛЬШЕ ЗНАНИЙ ДЛЯ ИНТЕРНЕТ-МАРКЕТОЛОГОВ
Читайте статью «Как персонифицировать отправителя в рассылке»
СПАСИБО ЗА ВНИМАНИЕ «Нетология» - маркетинг и менеджмент от практиков Рунета
УЗНАТЬ БОЛЬШЕ