Расскажите о ссылке

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

Традиционный способ сделать узнаваемой текстовую ссылку — выделить синим цветом и подчеркнуть. Распространено представление об этом приёме как о неэстетичном или устаревшем, однако ничего лучше пока не придумали. Альтернатива подчёркиванию — шеврон вправо после текста (или влево перед текстом, если ссылка ведёт назад в каком‑либо смысле):

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

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

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

Слова вроде «кликните», «перейти», «здесь» хоть и могут повысить узнаваемость ссылки, но лишают сам текст смысла, нарушают синтаксис и мешают понять, куда ссылка ведёт. Об узнаваемости, удобстве нажатия, информативности ссылки, а также о выделительной роли ссылки читайте также совет Артёма Горубнова.

Помимо клика для перехода со ссылкой и её адресом связано много других возможных действий: клик с одной клавишей-модификатором откроет ссылку в новом окне или вкладке; с другим — скачает документ, на который она ведёт; через меню по правой кнопке ссылку (адрес) можно скопировать, отправить, сохранить в закладки; ссылку можно перетащить на рабочий стол, в папку, в чат.

Встречаются интерфейсы с подчёркнутым текстом, который выполняет навигационную функцию, но истинной ссылкой не является, так как адреса за ним нет. По клику на такой элемент происходит переход, но другие действия недоступны. Фактически такой элемент является кнопкой, оформленной как ссылка.

Область нажатия ссылки расширяют за пределы самого текста для удобства прицеливания.

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

Можно настроить ссылки так, чтобы после перехода они автоматически меняли цвет. Подкраска посещённых ссылок помогает не сбиться и не держать в голове, куда ты уже ходил, когда это важно. Традиционный цвет посещённых ссылок — фиолетовый. Отображать посещённость не нужно, если сценарий предполагает регулярное возвращение на одну и ту же страницу, например в главном меню сайта.

В речи ссылкой называют как элемент интерфейса для перехода к документу, так и сам её адрес («отправить ссылку»). Многие интерфейсы автоматически превращают адрес в рабочую ссылку для перехода по этому адресу. Так текстом ссылки становится сам её адрес.