Утерянное искусство оформления посещенных ссылок
Цвет другого измерения
Высок шанс того, что вы посещали эту страницу, или эту страницу, или, наверняка, эту страницу. Возможно, не эту или эту, но я точно знаю, что вы бывали на этой странице.
Если на чистоту, это все мои догадки. В то же время вы можете без промедления сказать, какие из этих ссылок вы точно посещали, потому что мой сайт меняет цвет посещенных ссылок.
(примечание переводчика: Ирония =) На medium этого не происходит.)
Путешествие во времени
Просмотр web-страниц в основном двумерный: вы либо прокручиваете (ось y) или кликаете (ось z).
Цвет ссылок добавляет третье измерение: время.
- фиолетовые ссылки из прошлого
- синие ссылки — потенциальные кандидаты на настоящее или будущее
В зависимости от того, какова ваша цель, вид посещенных ссылок может вызывать две основные реакции:
- “Ах да, это тот сайт, который я искал! Я уже был на нем.”
- “Я уже заходил на эту страницу, попробую-ка следующую.”
Список ссылок как чек-лист
Агрегаторы ссылок, типа Reddit или Hacker News, являются теми немногими сайтами, которые по прежнему отличают просмотренные ссылки от “новых”.
Страница с результатами поиска в Google, как правило, отображает ссылки подобным образом. Скажем, вы изучаете JavaScript и хотите знать, как проверить, пуст ли массив.
Фиолетовые ссылки воспринимаются как выполненные задания, так как:
- вероятно, вы не захотите заходить на одну страницу дважды
- вы хотите продолжить работать с чек-листом с того места, на котором остановились, когда закрыли его
Разница цветов дает информацию о том, на сколько далеко вы продвинулись по списку.
Фиолетовые ссылки? Фуу!
Но почему выделение посещенных ссылок — такое редкое явление? Потому что дизайнеры (такие как я) слишком ленивы и придирчивы.
После завершения макета (он утвержден лично вами или вашим клиентом) вы хотите сверстать веб-страницу в полном соответствии с этим макетом. Вы не заботитесь об истории просмотра пользователя, потому что она повлияет на ваш идеально сбалансированный дизайн, не так ли?
Если вы профессиональны, то вы нарисовали дизайн для разных состояний кнопок и полей ввода (состояние по умолчанию, при наведении, нажатое, с фокусировкой, неактивное). Но состояние “посещенное” никогда не придет вам на ум.
Это одно из первых css правил, которое пишет дизайнер (прим.переводчика: или верстальщик):
a {
color: $anythingButBlue;
}Это повлияет на все ссылки в любом состоянии: hover, active, focus и visited. Это как сброс цвета. Вы пишите это правило и забываете. Вы можете использовать псевдокласс :link, но никто не узнает об этом. Но вы в любом случае забыли установить правило для :visited.
Веб-страница это живой документ: вы создали дизайн для разных типов экранов, разных устройств, разных интерфейсов, разных типов взаимодействия с пользователем.
Игнорирование подсветки посещенных ссылок похоже на заботу о логичности серфинга: вера в то, что весь пользовательский опыт должен быть идентичным.
Вопрос приватности
Несколько лет назад кто-то провел эксперимент: создал веб-сайт со списком из 1000 самых посещаемых сайтов. Сайт потенциально может “украсть” вашу историю просмотра путем вычисления цвета каждой ссылки.
Но браузеры, например Firefox, сейчас предотвратили подобное поведение:
Хотя цвет и может быть изменен, но метод getComputedStyle будет “врать” и всегда возвращать цвет непосещенной ссылки.
(Выделено мной)
В результате стилизация посещенных ссылок очень ограничена:
Не все ссылки равны
Большинство ссылок не требуют выделения цветом, если по ним был переход:
- навигационные ссылки (главная страница, учетная запись, настройки), те, что посещаются неоднократно
- интерфейсные ссылки, влияющие на состояние страницы
Как решить, какие ссылки стоит выделять после их посещения?
- внешние ссылки, потому что они дают пользователю представление о странице, которую вы упоминаете (поэтому агрегаторы подсвечивают посещенные ссылки)
- ссылки на статьи (или страницы, содержание которых остается неизменным долгое время)
Для примера возьмем The Guardian и представим, что вы его просматриваете. Главная страница динамичная, ее контент обновляется каждые несколько минут. Вам, как пользователю, не нужно знать о том, что вы посетили главную страницу, так как:
- вы наверняка там уже были
- вероятно вы будете там снова
Однако вы хотели бы знать, какие статьи вы уже читали, потому что содержание опубликованной статьи является статичным и маловероятно, что что-то изменится при следующем вашем переходе.
Поэтому зная перед кликом, какие статьи вы уже читали, вы можете совершить действие (прим.переводчика: кликнуть или пролистать дальше) исходя из вашего намерения:
В следующий раз при создании дизайна сайта подумайте о :visited!
Веб (интернет) и его пользователи оценят это по достоинству.
Перевод статьи The lost art of visited links by Jeremy Thomas
Нашли ошибку? Воспользуйтесь функцией Private notes: выделяете текст с ошибкой, нажимаете на символ замка в появившемся дудле и оставляете свой комментарий. Спасибо!
