Подборки

9 ошибок вёрстки, из-за которых письмо может попасть в спам

... и как их исправить
Ошибки верстки, из-за которых письма попадают в спам

Сыграем в игру. Я покажу 2 письма, а вы угадаете, какое я достал из папки «Спам».

Какое письмо я достал из спама
Игра: какое письмо я достал из спама?

Спам-рассылку сразу видно из-за специфического дизайна: шапка и футер отсутствуют, ссылки привязаны почти ко всему тексту, используются вырвиглазные цвета.

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

Иногда спам-фильтры отправляют в «Спам» письма от добросовестных отправителей. Часто это происходит из-за особенностей вёрстки — программа цепляется к цвету шрифта, сокращённым ссылкам или отсутствию alt-тегов у картинок. Если таких мелочей наберется достаточно, рассылка будет отмечена как спам и не дойдёт до «Входящих».

Я расскажу об ошибках в вёрстке письма, из-за которых рассылка может попасть в спам, и дам рекомендации, как их исправить.

Обновить статью помог Денис Щукин, верстальщик писем в Unisender Agency.

Ошибка 1. Письмо свёрстано одной картинкой

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

Бухгалтерский беспредел в папке «Спам»

Как исправить. Напишите в письме текст, хотя бы 1-2 абзаца. Это снизит риск того, что рассылка попадёт в спам.

Ошибка 2. В письме используются редиректы или укоротители ссылок

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

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

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

Гиперссылка ведет прямиком на сайт — у спам-фильтра никаких подозрений
Гиперссылка ведет прямиком на сайт — у спам-фильтра никаких подозрений

Как исправить. Зашиваем ссылки в текст и картинки. Укоротители ссылок и редиректы не используем.

Ошибка 3. Большой размер вложения к письму

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

Как исправить. Если вам нужно, чтобы пользователь скачал файл, дайте на него ссылку в письме. Файл для этого нужно заранее залить на файлообменник. Вот пример того, как можно привязать ссылку на загрузку к кнопке:

Привязываем ссылку на Google Диск к кнопке
Привязываем ссылку на Google Drive к кнопке

Бывают ситуации, когда без вложения не обойтись. Тогда проследите, чтобы файл не превышал 5 МБ.

Ошибка 4. Большой размер письма

Чем больше весит письмо, тем больше шансов, что оно попадет в спам. Поэтому вес верстки лучше держать на уровне до 100–120 КБ. Тогда риск попасть в спам меньше. 

Кроме того, письма с более тяжелой версткой почтовый сервис может обрезать и не отобразить полностью. Так, например, делает Gmail.

Gmail обрезал сообщение. Чтобы посмотреть письмо целиком, нужно перейти по ссылке
Gmail обрезал сообщение. Чтобы посмотреть письмо целиком, нужно перейти по ссылке

Как исправить. Стараемся уменьшить размер писем до 100 КБ и меньше.

Ошибка 5. Много ярких шрифтов

Яркие шрифты, которые часто меняются по ходу письма — популярный прием спамеров. Вот типичный пример спам-рассылки:

Яркие цвета текста часто меняются
Два письма из спама с частой сменой ярких цветов

Как исправить. Следим, чтобы рассылка не пестрила. Использовать 2-3 разных цвета можно, если не выкручивать насыщенность на максимум.

Рассылка Рег.ру: цвет меняется, когда авторы хотят сказать что-то важное или подсветить кнопку
Рассылка Рег.ру: цвет меняется, когда авторы хотят сказать что-то важное или подсветить кнопку

Ошибка 6. Часть текста написана с Caps Lock

Ещё один прием, который можно встретить в спам-рассылках. Авторы хотят заинтересовать пользователей отдельными словами и фразами, которые считаются стоп-словами и привлекают только внимание спам-фильтров.

Caps Lock в спам-рассылке
Caps Lock, восклицательные знаки и яркие цвета — все, чтобы попасть в «Спам»

Кроме того, чрезмерное использование заглавных букв воспринимается как кричащий и агрессивный стиль, что является признаком спам-рассылки.

А еще почтовые сервисы имеют определенные правила, фильтрующие письма с необоснованным использованием заглавных букв. Такие письма с большей вероятностью попадут в «Спам».

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

Ошибка 7. Форматирование скопировано с текстовых редакторов или с сайта

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

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

Пеобразование Google Doc в HTML
Преобразовал Google Doc в HTML через конвертер. В коде появились атрибуты HTML и стили CSS, которые не поддерживаются почтовыми приложениями

Как исправить. Если нужно скопировать текст в рассылку, то сначала вставьте его в простейший текстовый редактор («Блокнот»), а только потом — в письмо. Так вы очистите форматирование текста — лишние теги и атрибуты не попадут в рассылку.

Проблемы с форматированием чаще возникают, когда копируют текст с отступами, дополнительными колонками, редкими шрифтами или заливкой фона. Если вставить несколько предложений обычного текста, написанного на Arial, то, скорее всего, ничего страшного не произойдет. Но чтобы перестраховаться, рекомендую любой текст прогонять через «Блокнот» или набирать вручную.

Ошибка 8. Нет ссылки на отписку

Ссылка на отписку от рассылки — обязательное требование всех почтовых сервисов. Письма, от которых нельзя отписаться, с большой вероятностью попадут в папку «Спам» или будут заблокированы.

Ссылка на отписку в письме
Ссылка на отписку в письме

Как исправить. 

Вот несколько правил, которые нужно соблюдать:

  • В каждом письме давать чёткие инструкции, как отписаться от рассылки. При этом процесс отписки не должен требовать от получателя сложных действий вроде  восстановления пароля, регистрации или авторизации. Получатель должен иметь возможность отписаться от рассылки в течение 10 минут.
  • В теле письма должен быть явно указан адрес подписчика.
  • В письме должен быть использован заголовок list-unsubscribe, оформленный по стандарту RFC. При переходе по ссылке из этого заголовка пользователь должен быть моментально отписан от рассылки.
  • Для отписки необходимо указывать только работающие ссылки».

Ошибка 9. У картинок отсутствуют alt-теги

Alt-тег — текст, который показывает браузер, если картинка не отобразилась или отключена.

Письмо без картинок, но с alt-тегами
Отключил картинки, чтобы увидеть alt-теги

К письмам без alt-тегов спам-фильтры относятся неодобрительно: пользователи с отключенными картинками могут не понять сути сообщения.

Как исправить. Прописываем alt-теги к каждой картинке. Если изображение имеет исключительно декоративную роль, alt-тег всё равно нужен, но его можно оставить пустым: alt=»». Это можно сделать как в редакторе кода, так и через функционал блочного редактора. Например, так это выглядит в конструкторе EmailMaker, который используется в Unisender:

Альты к изображениям в рассылке

Делаем чистенько

Спам-фильтрам нравится, когда рассылка аккуратно свёрстана и продумана до мелочей: для тех, кто смотрит без картинок, есть alt-теги, а внизу гордо красуется большая кнопка отписки. Аккуратное и любовно свёрстанное письмо с большей вероятностью упадет во «Входящие», чем в «Спам».

Дизайн и верстка письма для вашей рассылки

Придумаем с нуля, подстроимся под брендбук или отрисуем по вашему макету. Верстка в блочном редакторе Unisender или HTML-шаблон.

Подробнее