Как самостоятельно сверстать письмо для рассылки: бесплатный онлайн‑курс от Letteros
Подготовили девять уроков с домашними заданиями для всех, кто хочет научиться вёрстке рассылок в HTML.
Курс будет полезен:
- Верстальщикам. Разберётесь с HTML, его элементами и синтаксисом. Научитесь верстать креативные письма и адаптировать их под разных почтовых клиентов
- Email или CRM-маркетологам. Узнаете технические ограничения вёрстки. Научитесь создавать письма с идеальной структурой, которые будут корректно отображаться на любых устройствах.
Прохождение одного урока займёт 60–120 минут
Вам некуда торопиться — изучайте материалы в удобном для себя темпе и выполняйте все домашки, чтобы закрепить знания.
Какой результат получите после курса
- Узнаете все тонкости идеальной вёрстки.
- Научитесь работать в Figma.
- Разберётесь, как адаптировать рассылку в мобильной версии.
- Поймёте, как тестировать письма и выявлять баги.
- Самостоятельно сверстаете своё первое письмо.
Теперь — к программе
Урок 1. Что такое HTML
Начнём с базы. Расскажем, что такое HTML-теги и атрибуты. Из чего состоит страница письма и HTML-таблицы. Разберём, что такое парные и непарные теги и как в HTML строятся + CSS + инструменты.
Урок 2. Особенности вёрстки писем
Расскажем о движках, почтовых клиентах. Объясним, зачем нужен HTML, и познакомим со свойствами CSS.
Урок 3. Служебные элементы кода письма
«Препарируем» шаблон кода писем и подробно изучим все элементы.
Урок 4. Работа с графикой
Погрузимся в Figma. Разберём, что нужно знать верстальщику для эффективной работы.
Урок 5. Основные элементы кода письма
Узнаем всё про таблицы, текст, кнопки и другие важные элементы.
Урок 6. Фоновые изображения в письмах
Поговорим об особенностях фоновых изображений в разных почтовых клиентах.
Урок 7. Перестроение элементов письма
Рассмотрим различные сетки и перестраивающиеся блоки.
Урок 8. Мобильная адаптация
Научимся адаптировать письмо в мобильной версии с помощью кода.
Урок 9. Тестирование
Зафиналим обучение темой о веб‑версиях рассылок и тестировании писем.
Все уроки уже доступны в блоге Letteros
Переходите по ссылкам выше и приступайте к обучению