Дискуссии по понедельникам: подчёркивание ссылок

Сегодня начинаем новую рубрику — дискуссии по понедельникам. В понедельничных заметках будут разрешены комментарии. Я буду удалять офтопик, мат не по делу, личные оскорбления. Темы дискуссий — это темы моего блога: дизайн, технологии, музыка и жизнь. Посмотрим, что из этого выйдет.

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

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

Пишите всё, что думаете по этому вопросу.

Стараюсь подчёркивать ссылки всегда, люблю тонкое подчёркивание и небольшой fade out при наведении.

Единственное, что всё ещё кажется странным — это подчёркивание ссылок в навигационном меню (не в таком, как на этом сайте, а, например, как на apple.com).

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

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

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

Ну и Гугль в последнее время к этому располагает ;-) Всё это из серии КО, конечно.

А кто-нибудь может объяснить, почему в Хроме сделали жирное подчёркивание у ссылок с большим кеглем?

Сегодня подчёркивание ссылок — исключительно дело вкуса. Фейсбук и «Вконтакте» научили всех, что на синенькое можно нажимать.

Если есть нужда, «синенький» может быть любым достаточно насыщенным цветом, контрастирующим с цветом текста.

Тонкое подчёркивание — замечательно; необходимые костыли с border-bottom отвратительны.

По наведении ссылку нужно перекрашивать и сохранять подчёркивание (или его отсутствие).

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

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

А подчёркивание, например, в уже выделенных это лишнее.

Вопрос для Ильи: зачем выделять на этой страница Блог и Илья Бирман? Не лишнее ли это?

На мой взгляд, подчёркивание необязательно только в том случае, если все ссылки выделены одинаково, например, только синим цветом (Википедия, Вконтакте) и такое выделение больше нигде не используется. Т. е. там, где ясно, что на это можно кликнуть. А вот, например, на Ленте.ру не всегда очевидно, куда кликать, но все попривыкли уже.

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

Подчёркивание ссылок — это олдскул. Сегодня кнопки должны быть яркими и большими под нажатие пальцем на планшете — вот примерно как у кнопки «Отправить». Красным цветом — нельзя. Зелёным — можно. Лишние ссылки пугают людей и случайно нажимаются.

Фейсбук, Гугл, Айфон и другие — интерфейсы повседневного пользования.

Даже если бы Гугл сделал ссылки в поисковой выдаче черными и отразил слева направо, ничего не изменилось бы. Так же и на Айфоне. Хоть обведи ссылку, хоть в кнопку засунь — и так будет понятно, что нужно жать на неё.

Но нельзя проецировать эту практику на обычные сайты или сайты с большим количеством изменяемого контента, особенно если контент является элементом навигации (привет, Лента.ру).

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

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

Если уж все про меню, то там подчёркивание излишне.

Вот эту логику я никак не могу понять.

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

И что сейчас изменилось по сравнению с ранними порами?

Поколение сменилось. Новичков в интернете становится меньше, цифровых аборигенов всё больше. Это сродни переходу от скеоморфизма к плоскому дизайну.

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

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

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

Тонкое подчёркивание — хорошее решение. Только делать его нужно без просвета.

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

Два исследования по теме:

Comparing Link Marker Visualization Techniques — Changes in Reading Behavior Среди выводов: подчёркнутые ссылки ухудшают восприятие информации в тексте.

A Comparison of Link Readability Techniques Подчёркнутые ссылки улучшают читаемость и удобство навигации (т. к. они привычнее — здесь важно заметить, что исследование проводилось в 2004 году).

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

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

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

Подчёркивание, каким его рисуют браузеры, избыточно и уродливо, поэтому его и стали делать «тонким». Если уж подчёркивать, то лучше так.

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

Смысл подчёркивания — быстро отличить ссылку от не ссылки в одинаково оформленном блоке текста, не зависимо от особенностей зрения. При выделении только цветом смело говорим «пока» дальтоникам и слабовидящим (поди быстро найди серые слова в абзаце чёрного текста). Даже цветные ссылки в простыне текста найти не сразу удается без подчёркивания.

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

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

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

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

Мигать подчёркиванием, особенно при изменении цвета ссылки при наведении, лично мне создает лишний дискомфорт. Но если в убирании подчёркивания при наведении я ещё могу узреть смысл (например, чтобы ещё проще прочитать стало), то в появлении подчёркивания при наведении — совсем не могу.