Помощь! Моя электронная почта не работает: распространенные ошибки + исправления

Опубликовано: 2017-04-18

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

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

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

Неподдерживаемый HTML или CSS в почтовых клиентах

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

Если вы не уверены, будет ли ваша техника работать в вашем почтовом клиенте, используйте инструмент анализа кода Litmus.

Доступный в Litmus Builder, анализ кода покажет вам любые неподдерживаемые свойства HTML или CSS в этом конкретном почтовом клиенте, сэкономив вам часы на устранение неполадок.

Распространенные ошибки, связанные с изменением поддержки, включают:

Изображения не отображаются

Электронная почта Anthropologie с включенными и заблокированными изображениями

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

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

Другими менее распространенными проблемами могут быть:

  • Ваше изображение не размещено на общедоступном сервере
  • В вашем изображении используется относительный, а не абсолютный URL-путь
  • Формат вашего файла изображения не JPEG, GIF или PNG.
  • Под вашими изображениями появляются пробелы

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

Предварительный просмотр ваших писем с отключенными изображениями

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

Узнать больше →

Пользовательские шрифты не отображаются

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

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

Чтобы узнать больше о типографике, ознакомьтесь с нашим полным руководством.

Электронная почта выглядит забавно на мобильном телефоне

Размер экрана может иметь большое значение, когда дело доходит до того, как отображается ваша электронная почта. Поскольку с 2015 года более 50% электронной почты открывается с мобильных устройств, важно оптимизировать электронную почту для небольших экранов. С Litmus Instant Previews легко протестировать электронную почту на iPhone, iPad и Android.

Адаптивный дизайн - это новая норма, особенно теперь, когда его поддерживает Gmail. Адаптивные электронные письма для правильной работы полагаются на медиа-запросы или правила @media в коде. Медиа-запросы - это особый набор стилей CSS, которые действуют как условные операторы или динамические правила. Тщательно спланированные, они могут помочь сделать электронные письма более удобными для использования на экранах разных размеров. Медиа-запросы поддерживаются не везде, так что имейте это в виду при разработке.

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

Подумать о:

  • Увеличение шрифтов: мы рекомендуем минимум 14 пикселей для основного текста и 22 пикселя для заголовков, чтобы ваше письмо можно было читать на маленьких экранах.
  • Использование сенсорного CTA: ваши подписчики больше не нажимают - они тоже нажимают! Мы рекомендуем кнопки размером не менее 44x44 пикселей, удобные для пальцев.
  • Упрощение макета: используйте подход с одним столбцом или адаптивный дизайн, чтобы обеспечить возможность просмотра на небольших экранах и повысить удобочитаемость.
  • Оптимизация вашего контента: оцените контент в своем электронном письме и избавьтесь от менее полезных или нерелевантных ссылок, копий и изображений. Будьте лаконичны, но все же убедительны.

Разрыв ссылок + отслеживание

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

Снимок экрана: 13 апреля 2017 г., 17.30.07.

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

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

Снимок экрана: 18 апреля 2017 г., 9:55. 04.

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

Снимок экрана: 18 апреля 2017 г., 9:55:38

Анимированные GIF + видео не работают

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

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

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

лопата

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

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

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

Тогда есть мелочи ...

Проблемы синтаксиса

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

Снимок экрана: 13 апреля 2017 г., 5.24.50 PM

Исправление : чтобы обнаружить какие-либо ошибки, пропустите письмо с помощью контрольного списка Litmus, чтобы сразу увидеть, что сломано.

Синие ссылки

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

Снимок экрана: 13 апреля 2017 г., 17:32, 22

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

Исправление : К счастью, есть несколько способов исправить это.

Устранение неполадок с электронной почтой

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

Начать тестирование сейчас →