Выпуск 5: Что такое дизайн электронной почты на самом деле?

В этом выпуске Delivering ведущий Джейсон Родригес пытается ответить на вопрос: «Что такое дизайн электронной почты на самом деле?» Знает ли он ваш путь к HTML и CSS? Или это выходит за рамки простого кода?

Обязательно подпишитесь на Delivering в iTunes или Spotify, чтобы слушать будущие выпуски и присоединяться к беседе в Twitter, используя хэштег #DeliveringPodcast.

Стенограмма эпизода

На первый взгляд дизайн электронной почты кажется простым. Он просто пишет HTML и CSS и отправляет их подписчикам, верно? Но проплывите немного глубже, и вы откроете для себя мир сложности, который выходит далеко за рамки простого кода. В этом выпуске Delivering я пытаюсь ответить на вопрос: «Что такое дизайн электронной почты на самом деле?»

Добро пожаловать в Delivering, подкаст о электронном маркетинге, стратегии, индустрии электронной почты и, да, дизайне и разработке электронной почты. Доставка осуществляется Litmus, креативной платформой, которую используют более 600 000 специалистов по электронной почте для разработки, тестирования, анализа и совместной работы над улучшенными кампаниями по электронной почте для более счастливых подписчиков. Узнайте больше и попробуйте Litmus бесплатно в течение семи дней на litmus.com.

Дизайн электронной почты - это просто, правда? Когда дело доходит до электронной почты, это просто HTML и CSS, вроде написания веб-страницы. Есть общая структура документа - заголовок и тело в файле HTML - а затем все содержимое внутри этого документа. Вы используете стандартный HTML для разметки контента, а затем CSS для стилизации этого контента. Теоретически любой человек, имеющий небольшой опыт создания веб-страниц, может создать быстрое электронное письмо, загрузить его в ESP и отправить подписчикам.

По крайней мере, так думают многие.

На самом деле HTML и CSS - это только начало, когда дело доходит до дизайна электронной почты. Конечно, дизайнеры, разработчики и маркетологи электронной почты должны знать свой HTML и CSS. Без него вы оставлены на произвол судьбы редактора WYSIWYG и любого спагетти-кода, который он создает. Но что такое дизайн электронной почты на самом деле?

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

Как и многие люди, я сначала изучил HTML и CSS, чтобы создавать свои собственные веб-сайты. Я достиг совершеннолетия с движением за веб-стандарты и неукоснительно следовал за такими людьми, как Джеффри Зельдман и Эрик Мейер. Когда у меня появляется время, я трачу его на то, чтобы писать и беседовать с такими людьми, как Рэйчел Эндрю и Джен Симмонс.

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

Известно, что Microsoft Outlook перешел от использования Internet Explorer, относительно хорошего движка для рендеринга электронной почты, к использованию Microsoft Word на сервере для отображения электронной почты. Есть множество причин, по которым Microsoft сделала переход, но с тех пор он стал проблемой для маркетологов электронной почты.

Почтовые клиенты варьируются от потрясающего рендеринга, как в Apple Mail, до худшего из худших. Подумайте о более старых версиях Lotus Notes, которые не поддерживали чертовски много разметки.

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

Условные комментарии Microsoft и таблицы-призраки, гибридное кодирование и методы Fab Four, даже такие простые вещи, как использование встроенного CSS и ограничение количества элементов HTML и свойств CSS, используемых в электронном письме, - все это снижает риск.

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

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

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

Самый популярный пример этого типа дизайна - создание интерактивных писем. Марк Роббинс и команда Rebelmail, как известно, создали полностью интерактивную систему оформления заказа в почтовом ящике для таких брендов, как Burberry. В Litmus мы получили огромные отклики после отправки каналов Twitter, фоновых видеороликов и поисков мусора в кампаниях по электронной почте.

Но не думайте, что электронные письма должны быть интерактивными, чтобы раздвигать границы и развивать среду. Копирайтинг, стратегия, графика и визуальный дизайн тоже могут сдвинуть с мертвой точки. Really Good Emails привлекла огромную преданную аудиторию не за счет того, что все свои электронные письма стали интерактивными, а за счет использования их уникального голоса, юмора и некоторой потрясающей персонализации.

Один из моих любимых информационных бюллетеней всех времен, ныне не существующий информационный бюллетень Mailchimp по UX, не делал ничего особенного с кодом. Но их электронные письма с художественным оформлением - моим любимым из них было электронное письмо в формате HTML, которое выглядело как эра 90-х, простой текст в формате ASCII - вдохновили других дизайнеров на привнесение художественного направления в свои собственные почтовые кампании и расширение концепции того, что, по мнению подписчиков, может дать информационный бюллетень по электронной почте. быть.

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

Без новаторских разработок таких людей, как Фабио Карнейро и Николь Мерлин, Стиг Мортен Майре и Реми Парментье, у нас не было бы техник, которые мы все принимаем как должное, для повышения качества обслуживания подписчиков. Фабио, Николь и Реми внесли свой вклад в обсуждение создания отзывчивых, удобных для мобильных устройств электронных писем, которые миллионы подписчиков читают каждый день по всему миру. А преданность Стига раскрытию секретов VML и мира пуленепробиваемых кнопок и фонов с его помощью позволила подписчикам во всем мире участвовать в кампаниях по электронной почте, несмотря на все странное дерьмо, которое почтовые клиенты делают с нашим кодом.

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

Итак, это возвращает нас к вопросу: «Что такое дизайн электронной почты на самом деле?»

Дизайн электронной почты - это больше, чем код. Это намного больше.

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

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

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

Нравится этот эпизод Delivering? Поделитесь с нами обзором в iTunes и поделитесь подкастом с друзьями. И обязательно присоединяйтесь к беседе, используя хэштег #DeliveringPodcast в своей любимой социальной сети.