Проверьте HTML своего письма

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

Загружаем инструмент…

Как это работает

  1. Вставьте HTML письма — из режима просмотра исходника вашего сервиса рассылок или из файла, который вы собираетесь отправить.
  2. Прочитайте находки, а затем таблицы ссылок и изображений.
  3. Используйте предпросмотр, чтобы проверить узкие ширины экрана, тёмную тему и, самое главное, как письмо выглядит с заблокированными изображениями.

Почему ничего не отправляется на сервер

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

Проверьте сами

  1. Откройте инструменты разработчика в браузере (F12) и перейдите на вкладку «Сеть» (Network).
  2. Загрузите свой файл и запустите инструмент.
  3. Единственные запросы, которые вы увидите, — это код самого инструмента, а у нескольких тяжёлых инструментов ещё и их открытый движок из публичного CDN, плюс один небольшой сигнал о просмотре страницы на loreatec.jp (адрес и заголовок страницы, больше ничего). Ни один из них не несёт ваш файл.

Проверьте, что файлы не уходят →

Частые вопросы

Почему мой блок <style> — это проблема?

Gmail сохраняет большую часть, Outlook под Windows — часть, несколько веб-клиентов вырезают его целиком, а внешнюю таблицу стилей не подгружает никто из них. Всё, что должно отображаться правильно наверняка, должно быть встроенным атрибутом style; блок <style> годится только для медиазапросов, которые вообще нельзя встроить. Механическую часть этой работы делает инлайнер CSS на этом сайте.

Что такое лимит в 102 КБ?

Gmail перестаёт отображать письмо примерно на 102 КБ и показывает ссылку «Просмотреть сообщение полностью» (View entire message). Всё, что после обрезки, скрыто — обычно это подвал письма, а именно там живут ссылка отписки и почтовый адрес компании. Это делает проблему не только дизайнерской, но и юридической. Урезайте HTML, а не содержимое: основной вес обычно дают повторяющиеся инлайновые стили и табличная разметка-каркас.

Почему он не говорит, работают ли мои ссылки?

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

Что показывает вид с заблокированными изображениями?

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