4 ошибки HTML-верстки email-писем: спам, обрезка, Alt и рамки в Outlook

В email-маркетинге есть опасная иллюзия: если письмо «в целом выглядит нормально», значит, с ним всё хорошо. Картинки на месте, кнопка кликается, текст читается - можно отправлять. Но опыт CPAExchange показывает обратное: именно такие «нормальные» письма чаще всего тихо теряют эффективность. Они не обязательно падают лицом в грязь на глазах у всей команды - они просто начинают хуже доходить, дают кривые цифры, а иногда незаметно выжигают базу, потому что почтовики и подписчики видят то, чего вы не замечаете.

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

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

Первая ошибка выглядит особенно невинно - и именно поэтому часто дорого стоит. Это когда в письме в качестве текста ссылки используют голый URL, например: https://example.com. Чаще всего такое появляется в футере, в юридических пояснениях или в блоках «контакты/политика». С точки зрения здравого смысла всё логично: человек видит адрес и понимает, куда кликает, прозрачность максимальная.

Но email живёт по своим законам. Почти любая платформа рассылок (ESP) подменяет ссылки на трекинговые - чтобы фиксировать клики и строить аналитику. И получается парадокс: в письме отображается один адрес, а реальный href ведёт на совсем другой (трекинговый домен). Для почтовых сервисов это выглядит так же, как устроено множество фишинговых схем: «показываем безопасное, ведём на другое».

Результат бывает разный: от предупреждения «возможное мошенничество» до падения доверия к домену и ухода письма в спам. И самое неприятное, что вы можете даже не понять, что проблема была именно здесь: письмо же «красивое», всё работает, кнопки есть, а доставляемость проседает.

Как переписать ссылки по-человечески (3 нативных примера):

А если хочется оставить ощущение прозрачности, используйте «мягкий» вариант: «Перейти на сайт CPAExchange» - это и понятно, и не похоже на письмо мошенников.

Есть и исключение: когда в тексте и в ссылке тот же домен, а разница только в UTM-метках. Тогда почтовики обычно реагируют спокойнее. Но если ваша ESP подменяет ссылки на трекинговые домены, лучше не искушать фильтры и не использовать URL как видимый текст.

Вторая ошибка - из тех, что убивают эффективность «тихо и незаметно». Это перевес письма по HTML. Многие знают про условные 102 КБ, после которых письмо у некоторых почтовиков может обрезаться. И часто относятся к этому как к пустяку: «ну подумаешь, футер не загрузился».

Только проблема в том, что «футер» - это часто не просто юридическая вежливость. В конце HTML обычно живёт то, что маркетологу жизненно важно: трек-пиксель открытий и сервисные элементы. Если письмо обрезалось, пиксель не загрузился - и открытия не засчитались.

Дальше начинается цепочка ошибок уже не в коде, а в управлении: вы видите заниженный Open Rate, делаете вывод «не зашло», меняете темы, убираете контент, начинаете «спасать» то, что работало. А потом ещё хуже: сегментация по активности ломается. Люди, которые реально читали письмо, по данным становятся «спящими». Их исключают из коммуникации, чистят, перестают догревать - и вы теряете не просто метрики, а лояльных подписчиков.

Отдельная ловушка: письмо может стать тяжелее уже внутри платформы рассылок - после подмены ссылок, добавления трекинга, динамики, служебных кусков. Поэтому верить «на глаз» или «на макете всё было ок» - плохая стратегия.

Самый простой и честный способ проверки - тестовая отправка в популярные почтовики и проверка, не появилось ли «Показать полностью» и не обрезался ли низ письма. Email не про догадки. Он про проверку!

Третья ошибка - про Alt-тексты. И да, это не «техническая мелочь», это то, как ваше письмо выглядит, когда изображения не загрузились. А они не загрузятся. Особенно в B2B, особенно на корпоративных почтах, особенно у тех, кто по умолчанию отключает картинки ради безопасности.

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

Есть два типовых промаха. Первый - слишком длинный Alt в маленьком элементе. Классика - иконки соцсетей: маленькая картинка плюс Alt «Подписывайтесь на нашу страницу во ВКонтакте». Итог: синие слова наезжают друг на друга, футер выглядит как случайная поломка, а кликабельность падает.

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

Как писать Alt так, чтобы это выглядело профессионально (3 нативных примера):

И ещё одна практическая мысль: Alt - это не место для романа. Это подпись-маркер, который должен помогать пользователю ориентироваться в письме без картинок. Если Alt сделан правильно, письмо остаётся понятным даже «голым» текстом.

Четвёртая ошибка - про то, как письмо может «вдруг стать некрасивым», хотя у вас всё было идеально. Это необнулённые рамки (border) вокруг картинок, особенно у тех, которые кликабельны. В большинстве современных почтовиков это может не проявиться вообще, и поэтому о проблеме забывают. А потом письмо открывают в Outlook, корпоративном интерфейсе или в старом клиенте - и вокруг ваших картинок появляются ярко-синие рамки, как будто вы верстали в эпоху кнопки «Сделать сайт за вечер».

Почему это неприятно не только эстетически: рамка занимает место, может влиять на ширину блоков и ломать адаптив. Письмо может «поехать» даже на десктопе - просто, потому что где-то внезапно добавились пиксели по периметру.

Решение - скучное, но спасающее: обнулять border у изображений (border="0") и делать это «по умолчанию», даже если вы уверены, что картинка не кликабельна. Email любит сюрпризы. Мы - нет.

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

Поэтому в CPAExchange мы относимся к проверке письма как к предполётному чек-апу. Не потому, что мы параноики, а потому что это дешевле, чем потом объяснять «почему рассылка не сработала».

Мы делаем простые вещи, которые дают огромный эффект: сверяем письмо с макетом (глаз замыливается - это нормально), открываем письмо с выключенными картинками (это мгновенно показывает качество Alt и логики), смотрим в разных средах и обязательно тестируем в реальных инбоксах, потому что синтетика не заменяет живой Outlook или Яндекс.Почту. И да - проверяем тёмную тему, потому что именно там часто всплывают самые неожиданные «почему кнопка стала невидимой».

Плавно перейдем к итогу:

Email-верстка - не второстепенная техническая задача и не «дело верстальщика». Это часть маркетинговой стратегии, которая напрямую влияет на доставляемость, аналитику, сегментацию и доверие к бренду.

Хорошая верстка почти незаметна. Плохая - бьёт по показателям и деньгам даже тогда, когда письмо визуально кажется «нормальным».

Если вы хотите, чтобы email-маркетинг работал стабильно и предсказуемо, важно начинать не с «кнопок и картинок», а с технической гигиены: аккуратного HTML, веса письма, ссылок, Alt-текстов и обязательного тестирования в реальных инбоксах. Именно так мы подходим к рассылкам в CPAExchange - потому что в email выигрывают не самые креативные, а самые системные.

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

Например, у нас есть рассылка в дайджесте CPAExchange - формат, который позволяет органично рассказать о продукте или предложении аудитории, уже привыкшей получать от нас полезные подборки и новости рынка. Плюс - доступна индивидуальная рассылка по целевой базе CPAExchange и другие варианты размещения под задачу (подробности - в коммерческом предложении): https://clck.ru/Sf4e5 И список возможностей здесь: https://clck.ru/3PkFC3

Отдельно - для брендов, которым важна женская аудитория и доверительная нативная подача - мы открыты к сотрудничеству в рамках проекта LadyHoroscope. Это женская ЦА 18–55 и форматы нативных email-кампаний/спецрассылок с высокой доставляемостью. Коммерческое предложение LadyHoroscope: https://www.ladyhoroscope.ru/Content/kp_ledigor.pdf

Если захотите - обсудим вашу задачу и подберём формат так, чтобы коммуникация выглядела естественно, а результат был измеримым: охват, клики, лиды и рост узнаваемости - без «случайного маркетинга». Напишите нам на demand@cpaexchange.ru.