Мифы email-маркетинга: Письма обязательно нужно верстать на таблицах

В последние несколько недель мы пересматриваем распространённые мифы email-маркетинга, чтобы понять, актуальны ли они в 2021 году. Мы уже обсудили однократную и двукратную подписку, а также существование (и важность) «складки». Сегодня же углубимся в вопрос, который лежит в основе email-маркетинга и буквально используется при создании практически каждого письма.

Да, мы ставим под сомнение один из самых давних постулатов отрасли:

*Все письма обязательно нужно верстать на таблицах.*

## Почему в письмах используются HTML-таблицы?

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

### Всё началось с веба

Хотя таблицы были официально включены в спецификацию HTML только в 1997 году, их начали использовать ещё в начале 90-х. Ранняя версия браузера Mosaic (позже ставшего Firefox) позволяла верстать таблицы уже в 1993 году. По мере роста популярности Всемирной паутины таблицы стали широко применяться для компоновки страниц — несмотря на то, что изначально они предназначались для табличных данных (как в электронных таблицах).

К 1996 году табличная вёрстка стала общепринятым стандартом для создания веб-страниц (и использования веб-безопасных шрифтов). Такие инструменты, как Microsoft Frontpage и Adobe Dreamweaver, сделали создание табличных макетов доступным (хотя и не всегда *доступным* в плане юзабилити).

Только с развитием движения за веб-стандарты и появлением каскадных таблиц стилей (CSS) в начале 2000-х годов бестабличная вёрстка стала набирать популярность. Сегодня, благодаря мощным возможностям CSS, современные дизайнеры и разработчики (справедливо) отказались от использования HTML-таблиц для создания веб-страниц.

### Поддержка CSS в письмах была ограничена

Однако таблицы по-прежнему доминируют в email-дизайне.

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

С тех пор почтовые клиенты значительно продвинулись вперёд, как и инструменты для email-дизайна. Сегодня не редкость красивые, доступные и интерактивные письма как на десктопе, так и на мобильных устройствах. Но вернёмся к нашему главному вопросу…

## Обязательно ли верстать все письма на таблицах?

Здесь всё становится сложнее. Ещё в 2015 году мы писали о том, почему дизайн писем и веба отличается, и пришли к выводу, что таблицы — единственное решение для вёрстки писем. Сегодня ответ уже не так однозначен: «да» или «нет». Скорее, «в какой-то степени». Позвольте объяснить:

### Почтовые клиенты эволюционировали

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

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

### За исключением Outlook (в основном)

К сожалению, некоторые почтовые клиенты развиваются медленнее. А некоторые компании ещё медленнее обновляют своё ПО, из-за чего старые версии клиентов до сих пор широко используются.

Главный виновник здесь — Microsoft Outlook. Парадоксально, но старые версии Outlook неплохо поддерживали HTML и CSS, так как использовали для рендеринга Internet Explorer. Однако, начиная с 2007 года, Microsoft перешла на Word в качестве движка рендеринга — в основном для унификации создания контента в продуктах Office. Это привело к ухудшению поддержки HTML и CSS в письмах. С тех пор email-маркетологи не перестают проклинать этот продукт.

Даже при использовании гибридной вёрстки дизайнерам приходится применять «фантомные» таблицы, чтобы письма корректно отображались в Microsoft Outlook.

Фантомные таблицы — это всё те же HTML-таблицы, но скрытые от других почтовых клиентов с помощью условных комментариев HTML. Благодаря условным комментариям дизайнеры могут создать фантомный макет для Outlook на таблицах, в то время как остальные клиенты получают более современный дизайн на основе div-элементов.

### Итог таков…

Вы *можете* верстать часть писем с использованием современного CSS. Но если вам нужно поддерживать большинство версий Microsoft Outlook, придётся использовать таблицы — хотя бы частично, если вы хотите, чтобы письмо выглядело приемлемо.

Единственное исключение из этого правила — простые текстовые письма, которые вообще не используют HTML и CSS. У таких писем есть свои преимущества, но обычно их применяют для очень специфических целей. А отсутствие брендирования, кастомизации и трекинга означает, что большинство брендов не будут использовать исключительно текстовый формат в email-маркетинге.

Так что, пока Outlook не улучшит поддержку HTML и CSS (а они, справедливости ради, над этим работают), письма *придётся* верстать на таблицах — хотя бы в какой-то степени.

## Тестируйте каждое письмо, независимо от способа вёрстки

Проверьте, как ваши письма отображаются в более чем 100 почтовых клиентах и на разных устройствах — независимо от используемых техник вёрстки — с помощью Litmus Email Previews.