mailto 1160x620 - Проблема с почтовыми ссылками mailto и что использовать вместо них

Пару месяцев назад я и моя подруга Amy Hupe открыли совместное предприятие под названием Frankly, целью которого является помощь в создании понятных, доступных и ориентированных на пользователя цифровых продуктов.

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

Вместе мы написали эту статью об одной из таких деталей, с которой столкнулись на пути реализации нашего проекта.

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

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

Один из вопросов, с которыми мы столкнулись заключался в том, добавлять стандартные ссылки mailto в адрес электронной почты или нет.

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

Во-первых, ссылки mailto затрудняют копирование адреса, например, если вы хотите поделиться адресом электронной почты с кем-то еще.

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

И, наконец, у многих пользователей не настроено приложение электронной почты. Это означает, что ссылка может привести их в тупик или «кроличью нору».

Например, когда вы кликаете по адресу электронной почты в Chrome на своем Macbook, приложение «Почта» загружает запрос на настройку учетной записи электронной почты. Мы используем Gmail, и настроить его в Chrome действительно сложно.

ux research big - Проблема с почтовыми ссылками mailto и что использовать вместо них

Профессиональная подготовка UX-исследователей

Научитесь определять потребности пользователей! 3 месяца обучения, ведущие эксперты, удостоверение о повышении квалификации НИУ ВШЭ, менторство
Узнать подробнее

По этим причинам мы решили убрать ссылку mailto и добавить адрес почты в виде обычного текста.

png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABAQMAAAAl21bKAAAAA1BMVEUAAP+KeNJXAAAAAXRSTlMAQObYZgAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAApJREFUCNdjYAAAAAIAAeIhvDMAAAAASUVORK5CYII= - Проблема с почтовыми ссылками mailto и что использовать вместо них
Итерация 1: нет ссылки mailto

Но у этого решения были свои недостатки.

Плюсы ссылок mailto

Мы сомневались в правильности решения убрать ссылку mailto, потому что:

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

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

Предлагая выбор

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

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

png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABAQMAAAAl21bKAAAAA1BMVEUAAP+KeNJXAAAAAXRSTlMAQObYZgAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAApJREFUCNdjYAAAAAIAAeIhvDMAAAAASUVORK5CYII= - Проблема с почтовыми ссылками mailto и что использовать вместо них
Итерация 2: «Email us», в качестве ссылки mailto и адрес электронной почты, в виде обычного текста

Люди, которые хотят перейти к отправке письма могут нажать на ссылку mailto, а люди, которые хотят скопировать адрес электронной почты могут скопировать текст.

Добавление кнопки копирования адреса

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

Чтобы исправить это, мы решили добавить ссылку mailto к адресу электронной почты, и расположить рядом с ней кнопку «copy address», которая позволяет пользователям быстро скопировать адрес в буфер обмена.

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

png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABAQMAAAAl21bKAAAAA1BMVEUAAP+KeNJXAAAAAXRSTlMAQObYZgAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAApJREFUCNdjYAAAAAIAAeIhvDMAAAAASUVORK5CYII= - Проблема с почтовыми ссылками mailto и что использовать вместо них
Итерация 3: адрес электронной почты – это ссылка mailto, а рядом с ней есть кнопка «Copy»

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

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

Даже используя наше решение, люди, переходящие по этой ссылке, по-прежнему:

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

Что нам действительно нравится

Это такая распространенная проблема, и кажется, что браузеры и операционные системы должны это исправить.

Мы считаем, что это будет идеальным решением, если пользователи, нажимающие на ссылку mailto, увидят меню с такими вариантами:

  1. Отправить письмо из Gmail
  2. Письмо с другого аккаунта
  3. Скопировать адрес электронной почты
  4. Поделитесь адресом электронной почты через…

Это отвечает наиболее распространенным потребностям и дает большинству пользователей возможность двигаться вперед.

Вот такая небольшая история о ссылках mailto. Что вы думаете?

Оригинал: adamsilver.io

Если вы нашли ошибку, выделите фрагмент текста и нажмите Ctrl+Enter

Добавить комментарий
Похожие записи

Тренды UI/UX дизайна на 2020 год

Подборка основных трендов UI/UX дизайна, которые мы увидим в 2020 году

47 важных советов для UI и UX дизайнеров

Эта статья – список важных советов для UI / UX дизайнеров, дизайнеров взаимодействия или продуктовых дизайнеров любого уровня

Паттерн нижней панели навигации на мобильных веб-сайтах, исследование

Гамбургер-меню? Есть ли лучшая альтернатива? В этой статье я попытаюсь рассмотреть эти вопросы