Модули электронной почты: как действительно масштабировать уникальные электронные письма с уверенностью

Возможно, вы слышали о модульных шаблонах электронной почты в течение многих лет, но еще не сделали этого. Или, может быть, вы новичок в этой идее. Так что же такое модули электронной почты и стоит ли их использовать? Простой ответ - да, и, в отличие от других вопросов по электронной почте, здесь нет «зависит от обстоятельств».

Согласно нашему отчету «Состояние рабочих процессов электронной почты», 52% команд электронной почты тратят две или более недель на создание электронного письма от начала до конца. Модульные электронные письма ускоряют процесс, повышая эффективность - вы тратите меньше времени на повторяющийся код и больше времени на инновации. Это несложно.

Продолжайте читать, чтобы узнать:

• Что такое почтовый модуль?
• Преимущества модульной электронной почты
• Как начать работу с модульной конструкцией

Что такое почтовый модуль?

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

Все ваши модули могут быть размещены в библиотеке шаблонов как часть вашей более широкой системы дизайна электронной почты или рекомендаций по бренду. Таким образом, ваша команда точно знает, как комбинировать и сочетать, чтобы создавать электронные письма, соответствующие бренду, которые не будут ломаться. По сути, модульный дизайн электронной почты вращается вокруг меньших разделов или модулей, соединенных вместе, чтобы создать более крупный дизайн. Так же, как кубики LEGO можно собрать, чтобы построить что угодно.

Каковы преимущества модульной электронной почты?

У модульной системы есть много преимуществ, и я уже намекнул на некоторые из них. Если у вас все еще есть сомнения, вот преимущества.

Стандартизация, известная как марка и безошибочная

Ваши логотипы или цвета бренда немного отличаются от письма по электронной почте? Модульный дизайн устраняет подобные несоответствия. Поскольку все блоки предварительно закодированы и протестированы, вы можете быть уверены, что они будут создавать электронные письма, поддерживающие стандарты вашего бренда во всех электронных письмах. Без ошибок.

Экономит время и ускоряет рабочий процесс электронной почты

Согласно данным нашего опроса о состоянии электронной почты за 2020 год, около 35% маркетологов тратят 1-2 часа на кодирование и разработку одного электронного письма. Еще 34% занимают не менее 3 часов. Поскольку более половины респондентов обрабатывают шесть или более писем одновременно, эти часы разработки быстро складываются.

Благодаря стандартизированному дизайну электронной почты вам больше не нужно беспокоиться о написании писем с нуля. Это сэкономит вам массу времени, и вы сможете быстрее отправлять электронные письма. Лично я теперь могу создавать электронные письма за 10 минут.

Гибкость и креативность

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

И ваши блоки являются частью живой системы дизайна электронной почты. Это означает, что вы можете постоянно добавлять новые по мере роста вашей дизайн-системы, чтобы поддерживать гибкость и креативность.

Может использоваться в конструкторах электронной почты с перетаскиванием

Еще одна замечательная вещь в модулях электронной почты? По сути, они работают по принципу «подключи и работай» и, таким образом, идеально подходят для конструкторов электронной почты с перетаскиванием, таких как визуальный редактор перетаскивания Litmus Builder. Просто установите их, и вы готовы к работе.

Некодеры тоже могут создавать электронные письма

После того, как ваши повторно используемые блоки контента настроены в визуальном редакторе, вы можете создавать электронные письма, даже не касаясь кода. А это значит, что даже те, кто не занимается программированием, могут создавать электронные письма! Больше не нужно беспокоиться о том, что они могут случайно что-то сломать.

Масштабирует производство электронной почты

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

Быстро создавайте фирменные электронные письма без ошибок Создавайте, просматривайте и проверяйте свои электронные письма в одном непрерывном потоке - с Litmus Builder. Больше не нужно переключаться между инструментами. Узнайте как →

Как начать работу с модульной конструкцией

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

Как только дизайн-система будет завершена - на самом деле, не ждите. Дизайн-системы - это живые существа, которые будут меняться по мере того, как вы продолжаете создавать электронные письма. Вместо того, чтобы ждать, пока вся система будет завершена, начните кодирование, как только у вас будет достаточно блоков для создания шаблона.

Вот как начать.

1. Проверьте свою электронную почту, чтобы увидеть, какие разделы наиболее часто используются.

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

Составьте список или задокументируйте разделы, которые вы планируете разбить на модули и как они будут использоваться (включая правила взаимодействия). Организация ваших компонентов с самого начала упрощает их поиск и правильное использование в вашей команде, особенно по мере того, как вы продолжаете расширять свою библиотеку шаблонов. Он может быть таким же простым, как маркировка блоков содержимого для заголовков, тела и нижних колонтитулов. Или категоризация по команде или клиенту.

Мне нравится упорядочивать свои по разделам и типам электронной почты, используя Категории в Библиотеке дизайна в Litmus.

2. Определите стандарты и руководящие принципы бренда.

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

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

3. Создайте шаблон электронной почты.

Все ваши модули нужно будет поместить в скелет или шаблонный HTML. Это дает вам максимальную гибкость в том, как вы хотите оформить электронную почту. Существует несколько различных способов настройки шаблона, но все шаблоны включают в себя раздел вверху с открывающими тегами, содержимым заголовка, любыми стилями сброса и фирменными стилями, а также закрывающими тегами.

Марк Роббинс создал отличный упрощенный базовый шаблон электронной почты, который поможет вам начать работу. Объедините это с репозиторием Джея Орама последних стандартных стилей сброса CSS для электронной почты, и вы получите достойный шаблон для начала.

4. Создайте свои модули

Модули можно создавать разными способами. Если вы согласны с модулями, они будут работать вместе при объединении. Я рассмотрю два разных метода: модули на основе <table> и модули на основе <tr>.

Использование модулей на основе <table>

Вы можете обернуть каждый модуль в таблицу, чтобы таблицы складывались как модули. Модули на основе таблиц будут выглядеть примерно так:

Плюсы : модули аккуратные и автономные. Любые стили макета из одной таблицы не повлияют на другие модули.

Минусы : складывание таблиц иногда может вызывать проблемы с отрисовкой в ​​Outlook, например тонкие белые линии.

Использование модулей на основе <tr>

Модули, основанные на строках таблицы, необходимо поместить в содержащую таблицу. Затем строки могут быть помещены в содержащую таблицу, располагая строки друг над другом следующим образом:

Плюсы : в Outlook меньше надоедливых проблем с белой линией.

Минусы : проблема рендеринга в одном модуле может привести к проблеме рендеринга в другом модуле. И может потребоваться дополнительный код для вложения таблиц внутри строк для решения проблем.

5. Тестировать, тестировать, тестировать!

Оба метода модуля требуют, чтобы вы провели некоторое тестирование обеспечения качества (QA), чтобы убедиться, что один компонент не нарушает целостность электронной почты.

Я считаю, что лучший способ одновременно создавать модули и тестировать - это создать один большой шаблон, содержащий все модули в Litmus Builder.

Это позволяет QA тестировать модули в шаблоне, чтобы увидеть, как они влияют друг на друга. Это также обеспечивает сохранение расстояния между модулями. После добавления всех модулей их можно легко скопировать и сохранить в библиотеке дизайна Litmus в виде фрагмента или части.

6. Начните использовать модули в процессе создания электронной почты.

После того, как вы создали свои модули, остается лишь использовать их в процессе сборки. Большинство редакторов кода позволяют добавлять фрагменты в код или шаблон.

Я использую Litmus Builder. В представлении редактора кода вы можете использовать триггерные слова фрагмента или меню вставки для добавления фрагментов непосредственно в код. С помощью визуального редактора перетаскивания в Litmus Builder можно просто перетащить фрагменты на место.

Попробуйте создать модульное электронное письмо Litmus позволяет легко перейти на модульную структуру. Храните и систематизируйте свои фрагменты и части в Библиотеке дизайна. Затем быстро создавайте и проверяйте электронные письма с помощью визуального редактора в Litmus Builder. Он даже поставляется с предварительно загруженным полностью оптимизированным шаблоном электронной почты с модулями, так что вы можете сразу приступить к работе. Начать бесплатную пробную версию →

Получим модульную

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