Ссылки при наведении курсора: нужна ли реакция?

Очень хорошо, на мой взгляд, когда ссылку видно. Пользователь не должен рыскать по тексту в поисках появления вместо курсора "руки с выпяченным пальчиком". Меняется цвет - тоже неплохо. Особенным недостатком и безвкусицей считаю ссылки, при наведении на которые происходит трансформирование оных (меняется размер, наклон, сам шрифт) - беее.

Вообще я бы сказал, что зависит от задачи. В частностях: представьте, что вы беретесь набирать номер телефона, а кнопки начинают менять цвет, начертание и тип текста? Удобно? А теперь представьте, что они аккуратно так подсвечиваются - несильно, но удобно, если в комнате темно, или у вас плохо с тактильными ощущениями.

Действительно, хороший мини-обзорчик) Но сомневаюсь что этим постом Вы поставите точку в споре!)
Нету верного ответа. Этот вопрос решается в каждом случае индивидуально, в балансе удобства и красоты-стиля. Вот если ссылка в тесте, то, наверное, её лучше не "подсвечивать". А если ссылка многословная, в столбце, в куче других ссылок, то подсвечивать надо.
Тут каждый имеет право на свою точку зрения.

Лично для меня ссылки делятся на "очевидные" и "ссылки в тексте".

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

Ссылки в тексте обязательно должны быть выделены исходно, ну, это и так всем понятно.

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

Что до меня, то я люблю, когда ссылки при наведении меняют background (ну и цвет, чаще всего на белый), как в прямом эфире на хабре.

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

Ха-ха, живу с похожей проблемой все последнее время - спасибо, что не оставили меня наедине с моими мыслями (=

...

Черт, пока писал свои рассуждения - углубился в большой аналитический текст... Сейчас допишу его и выложу отдельно наверное. (=

Спасибо, что заставили подумать подробно над этой мучавшей меня проблемой (=

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

Активные ссылки надо выделять, чтобы отличить не от текста вокруг, а от прочих ссылок.
Если ссылки в тексте расставлены редко:

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur...

то не надо. А вот если часто и сплошняком:

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur...

то удобнее, когда ссылка подсвечивается. Иными словами, подсвечивание имеет смысл, когда нужно выделить не то, что это ссылка, а какая именно это ссылка. Что пример с guicci.ru прекрасно иллюстрирует.

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

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

При наведении курсора можно слегка поменять фон под ссылкой. Шрифт (размер, наклон) менять недопустимо. Если при наведении курсора пропадает подчёркивание, это, без сомнения, изврат. А, ещё на хомяках и в ЖЖ некоторые любят менять курсор на крестики и прочую экзотику. Тоже отвратительный изврат.

Также при наведении должна всплывать подсказка, объясняющая, что человека ждёт по ссылке. Если ссылка открывается в новом окне, об этом также должно быть сказано в подсказке или в самом тексте. Остальные ссылки должны открываться в том же окне.

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

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

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

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

Чаще всего раздражает если отсутсвует пометка посещеных ссылок...

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

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

У известного юзабилиста Якоба Нельсона по этому поводу есть небольшая заметка: Guidelines for Visualizing Links.
Приведу одну цитату из неё:

There is no need to use special colors or other visualizations when the cursor hovers over a link. Doing so only makes the page appear more cluttered as the user moves the mouse across the screen.

Другая интересная тема — оформление посещённых ссылок.

Что касается ссылок:

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

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

3. Что действительно важно во внешнем виде ссылок, так это обеспечение видимости и индикация того, что называют clickability.

Я за максимальное отличие ссылок от текста и за максимальную же обратную связь: т.е. и подчеркнуты, и выделены цветом, и меняют цвет при наведении. Может, даже и фон (в стиле Хабра).

Лично я всегда делаю все ссылки на сайтах подчеркнутыми. И подчеркивание использую только для ссылок.
Так же в тексте всегда ссылки выделены цветом и при наведении его меняют.
В элементах навигации ссылки также подчеркнуты и как правило тоже реагируют на наведение (за редким исключением)

Что касается посещенных ссылок, то в тексте они практически всегда выделяются. А вот в элементах навигации и "служебных" ссылках - никогда.

По возможности стараюсь использовать цветы ссылок близкими к значениям по умолчанию. (просто ссылки синие, посещенные - фиолетовые). Но это, естесственно, возможно далеко не всегда.

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

- подчеркнута всегда
- при наведении: курсор стандартный, размеры ссылки не меняются
- меняет цвет при наведении / после клика - цветогармонично основной идее ресурса (или не меняет, если это оправданно)

ИМХО, есть только 2 вещи, которые НЕ стоит делать:

- Ссылку оставлять без подчёркивания (БЕЗ наведения), разве что кроме заголовков;
- При наведении менять шрифт, размер, начертание.

Всё остальное - сколько душе угодно.

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

чисто моё мнение и мне так удобно

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

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

IMHO (для голосования :))

Ссылка не подчеркнута, но выделяется цветом.
При наведении - появляется подчеркивание.

Подчеркивание мне лично мешает читать текст. Выделение цветом помогает без блуждания мышкой определить ссылку. Подчеркивание при наведении - как дополнительный элемент попадания на ссылку и дополнительный элемент "общения" с посетителем :)

За обзор спасибо.

Мое мнение: универсального решения быть не может. Возможность отличить ссылку от остального текста на странице должна быть всегда. А вот выделять при наведении или нет — по ситуации. Если, к примеру, ссылки в тексте и их немного, то можно не выделять. А если ссылок сразу много (как облако тегов на хабре), то выделение определенно спасает ситуацию. Обратите внимание: в облаке тегов не используется подчеркивание, так как оно добавило бы дополнительный шум к и без того не самой простой конструкции.

Офтоп: ставить ссылки вроде «столь уважаемую контору» и «российский деятель» — не очень хорошо.

Ну раз уж тут статья появилась без моего прямого участия и ведома (за что спасибо автору), не могу не заметить следующее.

Формулировка вопроса поставлена неверно: «ссылку изменять: убирать\добавлять подчеркивание ссылки, изменять цвет?». Вопроса не шло о том, стоит ли вообще когда-либо и где-либо менять внешний вид ссылки при реакции на действия пользователя.

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

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


P.S. Автору статьи. Ярослав, если ты хочешь опубликовать «исследование», то его так и нужно бы опубликовывать, как исследование. Упоминая в начале текста тот факт, что это был спор с конкретным человеком и ты высказывая только свою позицию — как минимум, не честно. Если это действительно спор, то нужны 2 стороны, каждая со своей позицией. Иначе выглядит примерно как: «Пожалуйста, подтвердите, что я прав».

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

1) Ссылка должна быть подчеркнута, так как подчеркивание - пожалуй единственный критерий в вебе, который однозначно характеризует ссылку. Так уж сложилось исторически: подчеркнутый текст в вебе - ссылка. (Исключение возможно, но только одно - ссылка, оформленая в виде кнопки)

2) На цвет ссылки может влиять только общая стилистика страницы. Старание использовать максимально часто для ссылок дефолтные цвета, или близкие к ним, некоторыми разработчиками, считаю некорректным. Так как синий - наиболее неудачный цвет для ссылки, так уж устроен человеческий глаз, что синий цвет способствует более быстрому восприятию предмета, в случае с текстом большей скорости прочтения, что протеворечит цели акцентировать внимание читающего на текстовом элементе (в коментариях выше говорят что при большой плотности ссылок в текстовом блоке их восприятию мешает подчеркивание, смею предположить что дело в цветовом решении, так как глазу трудно "зацепится" при высокой скорости чтения за требуемый элемент). Те кто изначально решили использовать для ссылок синий цвет, во времена зарождения веба, просто не обладали должной квалификацией в области визуальных коммуникаций. И если раньше следование этому стилю можно было оправдать, в связи с принудительно сформированым стериотипом у большенства пользователей, и технической сложностью изменения (использование дополнительного тега к ссылкам - фонт), то сейчас ситуация совершенно иная (эта тема доказательство существующему большому разнообразию в оформлении ссылок даже в рамках одного проекта, не говоря о вебе в целом)

3) Изменение гарнитуры и размера шрифта гиперссылки при наведении - неприемлемо. Но не потому что хуже любого другого графического акцента, а так как влечет изменение позиции всех следующих за ним элементов в строке.

4) Лично я предпочитаю использовать для отображения реакции при наведении, взаимную смену цветов фона и текста ссылки, инверсию, вместе с удалением подчеркивания.

5) Так же считаю, что все контекстные ссылки должны обязательно обладать отличным оформлением для посещенного состояния.

6) Хорошей практикой так же является использование пиктограм для ссылок на файлы (для ссылки назначается левое поле на котором фоном размещается пиктограммка, указывающая на тип файла)

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

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

А имеет смысл отделять ссылки которые откроются в новом окне от ссылок открывающихся в текущем, ну и ссылок которые используя ajax перезагружают часть страницы? И если и Может кто-то скажет что не нужно вообще ничего открывать в новом окне, пусть пользователь сам решает, но в нектороых случаях это весьма удобно. Например открытие ссылки у яндекса в новом окне(результаты поиска) мне гораздо симпатичнее чем открытие гугла в том же окне из-за чего часто теряю список результатов.

Ссылки и любые элементы управления должны изменятся при неведении. Это приятная мелочь. Дело в том что наш локус внимания (термин введен Д.Раскиным), не смотри на курсор, который становится рукой, а смотрит на наводимый объект.

Так что всегда стоит подсвечивать элемент управления.

Правила "успешного" юзабилити:
1. Не подчеркивать ссылки
2. Не выделять ссылки цветом
3. Цеплять кучу эффектов при наведении
4. Не выделять посещенные ссылки

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

Сейчас посидел поэксперементировал со ссылками и их оформлением.
Как вариант могу предложить следующее:
a{
text-decoration:none;
color: blue;
border: 0px;
border-bottom: 1px solid blue;
}
a:visited {
border-bottom: 1px solid lightgray;
}
a:hover {
background: lightgray;
}
Цвета, понятно, можно использовать свои. Такой вариант однозначно определяет ссылки подчеркиванием, но в отличии от text-decoration: underline; подчеркивание идет ниже и таким образом не мешает читать. Посещенные ссылки подчеркиваются другим цветом, но цвет текста самой ссылки не меняется. Таким образом пользователь привыкает видеть ссылки одного определенного цвета, но может легко определить уже посещенные.