lightanddesign.ru
You might also like
Чтобы как-то подорвать тему дизайна, взгляните на еще один семинар по макетам сегодня. Это произошло во время предыдущего эффекта Hover CSS Effect. В этом посте мы сосредоточимся на том, как создавать ссылки на HTML в электронной почте. Все это делается с помощью простой метки A. Это, несмотря на свою простоту, имеет не только гиперссылку, но и несколько интересных оттенков.
Базовая пенсия выглядит следующим образом.
Здесь фраза MailTo записывается в виде функции HREF и электронной почты, на которую нужно отправить сообщение. Внутри метки находится текст ссылки, на которую нажимает пользователь.
Проблема такого дизайна заключается в том, что нажатие на ссылку не является хорошим UI/UX решением для пользователя, поскольку он нажимает на действие, которое не всем нравится. Это похоже на документ PDF, который сразу же открывается в браузере.
Открытие в новом окне
Если одна из коммуникационных программ (например, Apple Mail, MS Outlook) установлена на компьютере пользователя как приложение по умолчанию для текущей работы, щелкните ссылку MailTo. Соответствующее приложение откроется во вновь созданном сообщении электронной почты. Не имеет значения, определяется ли здесь target = "_ blank" или нет — программа всегда реагирует одинаково.
Однако если вы используете веб-клиент для электронной почты, например, и указали Gmail в качестве основной программы почтового клиента для Chrome, щелчок по ссылке будет таким же, как и в любом другом случае. В открывшемся новом окне вы будете просто перенаправлены на Gmail (текущая открытая страница исчезнет).
По сути, предоставление target = "_ blank" для всех ссылок на сайте так же спорно, как и отключение правой кнопки мыши. Однако, даже если вы в целом не согласны с этим свойством, оно разумно, по крайней мере, для ссылок на адреса электронной почты.
Дополнительные параметры в письме
Если вы видели трюк с открытием новой электронной почты и автоматическим введением сообщений и даже содержания сообщений, то все это легко сделать с помощью следующих добавок
Также можно использовать дополнительные механизмы добавления получателей (включая скрытые) — введите конкретные CC (копия) и BCC (скрытая копия). Цена этих опционов делится между сторонами, и между ними стоит знак "&".
Конструктор ссылок mailto
Новичкам, которые не понимают, как подключиться к электронной почте, мы рекомендуем заглянуть на сайт mailtolink.me. Это позволяет ввести все необходимые параметры сообщения в визуально интуитивно понятной рабочей среде, а на выходе получить готовый HTML-код электронного письма.
Единственный оттенок, который пока нужно проверить, — это введение русских букв, сервис преобразует их в определенные символы. Возможно, было бы проще сначала создать английскую версию ссылки, а затем изменить ее формулировку.
CSS оформление
Вы могли видеть много интересных приемов в нашей статье о подчеркивании ссылок и текста с помощью CSS. Люди не особенно любят сюрпризы, поэтому существует идея подчеркивания ссылок в электронной почте в характерной альтернативной манере. В принципе, это логично. Это связано с тем, что нажатие на них приводит к разным результатам.
Первый способ — использовать сам адрес электронной почты в качестве якоря.
Дополнительно можно указать стиль CSS.
Этот код применяется ко всем меткам A, поэтому если вы хотите указать только некоторые из них, используйте команду class/ID.
Плагин IHateMailto в Chrome/Firefox
Для тех, кто находит эту характерную непрактичную и раздражающую функциональность, разработчики создали специальное расширение для браузерной программы — IhateMailto.com.
Его работа состоит из двух частей: сначала приложение блокирует традиционный механизм электронной почты, затем сам адрес электронной почты копируется в буфер обмена в процессе работы.
Почтовая форма
Еще одно возмутительное использование Mailto Association в HTML предлагает автор оригинальной статьи, переведенной сегодня. Как вы знаете, метки форм могут перенаправлять на внешний URL с помощью инструкции GET; URL может быть ссылкой Mailo с использованием параметров, введенных в форме.
Это очень простая альтернатива отправке сообщения через форму обратной связи, но без использования PHP или различных модулей CMS. После нажатия станет ясно, что вам нужно написать сообщение, используя его или ее клиента. Заполните только основные параметры: получатель, тема и т.д.
Завершенная линия. Мы надеемся, что этот краткий семинар по созданию почтовых ссылок на ваш сайт будет вам полезен. Здесь не так много информации об экспертах, но некоторые финальные детали вам неизвестны. У кого есть что добавить, пусть напишет нам.
