Как сделать электронную почту для всех за 3 простых шага: запись вебинара + вопросы и ответы

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

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

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

Вопросы и ответы

Большое спасибо всем, кто задал вопрос во время вебинара! Вот краткий обзор наших ответов на самые популярные вопросы, а также наш ответ на некоторые вопросы, которые мы не получили во время веб-семинара. Есть дополнительные вопросы? Пожалуйста, оставьте их в комментариях.

Как вы учитываете когнитивные ограничения?

Беттина : Есть много разных типов когнитивных нарушений, от трудностей с запоминанием до дислексии или аутизма. Каждое из этих условий уникально, но следование советам, приведенным в разделе копирайтинга и дизайна этого вебинара, в значительной степени поможет сделать ваши электронные письма более доступными для людей с ограниченными познавательными способностями. Например, сделайте копию электронного письма ясной и краткой и избегайте использования сложных слов или жаргона. Делайте макеты простыми и разработайте четкую визуальную иерархию, которая позволит вашим подписчикам легко сканировать вашу электронную почту и быстро понимать, что важно (а что нет).

Какая программа для чтения с экрана используется чаще всего? Как вы его проверяете?

Алиса: Двумя самыми популярными программами чтения с экрана являются NVDA и JAWS . NVDA - это бесплатный инструмент с открытым исходным кодом, разработанный NV Access. Это удивительная организация, которая посвящает свою работу тому, чтобы сделать технологии более доступными для людей с нарушениями зрения. JAWS - популярный инструмент для чтения с экрана по подписке.

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

Кроме того, все современные операционные системы также предлагают некоторую встроенную поддержку чтения с экрана. Например, на Mac это VoiceOver .

Какие бренды отлично справляются с оптимизацией своей электронной почты для обеспечения доступности? Я бы хотел вдохновения!

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

Рискуя показаться тщеславным, я был очень впечатлен работой Алисы и ее электронной почты, проделанной над информационным бюллетенем Litmus . Он не только красиво оформлен, но и приложил немало усилий, чтобы сделать его доступным на основе лучших практик, обсуждаемых в The Ultimate Guide to Email Accessibility.

Хотите узнать, чем такие инструменты, как «Alexa» или «Siri», отличаются от других программ чтения с экрана? Или функция Outlook «зачитывать вслух»?

Джейсон : В недавнем выпуске подкаста Delivering я глубоко погрузился в голосовых помощников. Я обнаружил, что Alexa - единственная, кто действительно читает вашу электронную почту, но она будет читать только текст HTML, игнорируя любые атрибуты alt, таблицы или любые другие элементы HTML. Это отличается от того, как программа чтения с экрана обрабатывает электронную почту. Голосовые помощники ориентированы на удобство, не обязательно на доступность, поэтому они не работают так же, как полнофункциональные программы чтения с экрана, такие как, например, NVDA. Во многих случаях вам по-прежнему нужен телефон или ноутбук для навигации по контенту, голосовой помощник только поддерживает вас. Чтобы узнать, как Alexa, Google Home, Siri и Cortana обрабатывают электронную почту, посмотрите этот выпуск подкаста.  

Как насчет анимированных GIF-файлов? Использовать их или нет? Вызывают ли они проблемы у читателей?

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

Где я могу найти примеры доступных шаблонов писем?

Джейсон : Существует так много бесплатных шаблонов, но не многие из них оптимизированы с учетом доступности! Вот почему мы недавно создали четыре совершенно новых шаблона, которые следуют лучшим практикам в области специальных возможностей - и они доступны вам бесплатно в сообществе Litmus . Ознакомьтесь с нашими шаблонами, если вы хотите построить…

• Доступные информационные бюллетени
• Доступные личные заметки
• Доступные транзакционные электронные письма
• Доступные объявления о продуктах

Как использование смайлов влияет на доступность?

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

Самая большая распродажа года

Вы можете услышать, как разрозненно звучит смайлик рядом с текстом. Хотя сейчас смайлики стали обычным явлением, и пользователи вспомогательных технологий, вероятно, привыкли их слышать, в зависимости от смайликов они все равно могут звучать неловко. Как и любой другой элемент или копия в электронном письме, лучший способ проверить, работает он или нет, - это проверить его и прослушать свое электронное письмо с помощью такого инструмента, как NVDA или Litmus Accessibility Checker.

Нужно ли мне применять «роль = презентация» и к DIV?

Алиса : Нет! role = ”presentation” предназначен только для того, чтобы программы чтения с экрана игнорировали семантическое значение тегов, поэтому они нужны таблицам, потому что табличные данные, такие как графики, требуют всей информации о столбцах и строках, чтобы люди могли правильно перемещаться и понимать их. В электронной почте разработчики часто полагаются на таблицы для представления вместо табличных данных, поэтому таблицы требуют этого. DIV, с другой стороны, не имеют семантического значения, которое нужно было бы переопределить для программ чтения с экрана.

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

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

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

Влияет ли использование веб-шрифтов на доступность?

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

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

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

Могут ли программы чтения с экрана читать специальные символы, такие как фигурные апострофы, кавычки, амперсанды и т. Д.?

Алиса : Это зависит от обстоятельств. Амперсанды часто читаются как «и». Кавычки и фигурные апострофы игнорируются, как если бы кто-то не произносил их, читая что-то вслух. Другие специальные символы рассматриваются от случая к случаю, например, маркеры читаются как «маркеры». Я обычно рекомендую всегда тестировать, чтобы быть уверенным.

Есть предложения по форматированию текста только для удобства? Я использую несколько разрывов «=» или «-» между разделами. Как с ними обращаются?

Алиса : Тире и подчеркивания не читаются, так что это нормально. Однако программы чтения с экрана будут читать знак «равно», поэтому я бы рекомендовал избегать его.