Все в гиперпространстве связанно между собой гиперссылками. Почти каждый переход с одной страницы на другую страницу подразумевает предварительный щелчок мышью по определенной ссылке. Как дать посетителю сайта знать о том, что он уже посещал страницу, на которую ведет определенная ссылка?
Известно достаточно много методов для того, чтобы дать пользователю знать о том, что он уже посещал конкретную страницу в интернете. Какой из этих методов самый подходящий? Цветовое определение ссылок? Подчеркивание? Картинка?
При ответе на этот вопрос не стоит забывать о дальтониках, о карманных компьютерах, и, конечно же, не стоит забывать о браузерах, вернее браузере — всеми любимый ослик — Internet Explorer. Появившуюся седьмую версию этого браузера можно называть уже посолидней – осел. Но эта тема для отдельной статьи.
Итак, начнем с Якоба Нильсена – эксперта по удобству и простоте использования. Краткое изложение его статьи по визуализации ссылок (Guidelines for Visualizing Links):
#19 CSS Links | Link States | a:Link | a:Visited | a:Hover | a:Active
Текстовые ссылки должны быть цветными и подчеркнутыми для того, чтобы достигнуть необходимой воспринимаемости этих ссылок, хотя существуют несколько исключений.
По его словам можно избегать подчеркиваний в навигационном меню сайта и в списках ссылок. При этом пользователю должно быть предельно ясно, какую роль выполняют эти объекты страницы. Если для определения ссылок используются красный и зеленый цвета, то подчеркивание обязательно из-за наиболее распространенных форм дальтонизма.
Подчеркивание также обязательно, если одним из ваших приоритетов является доступность сайта, т.к. много людей имеют плохое зрение.
Примерно 74% всех сайтов используют цветовое определение для распознавания уже посещенных ссылок от еще не посещенных ссылок. Это хорошая дизайнерская традиция, к которой привыкли пользователи.
Цвет не посещенных ссылок должен быть ясным, ярким и насыщенным чем цвет посещенных ссылок, которые должны выглядеть размытыми и тусклыми. Два цвета, отличающие один тип ссылок (которые не открывались) от другого типа ссылок (которые открывались ранее) должны быть оттенком одного и того же цвета. Оттенки голубого цвета больше всего сигнализируют о том, что это ссылка.
Метод Симона Коллисона был признан как один из самых практичных и оригинальных методов. Идея достаточно проста и хорошо подходит для списков со ссылками. На сайтах можно увидеть галочку, которая появляется напротив той ссылки, по которой посетитель уже щелкал мышью или раньше был на странице, куда ведет адрес ссылки. Весь эффект полностью создается в CSS, т.е.
XHTML код страницы остается нетронутым. Если внести некоторые изменения в CSS код Симона, то этот метод можно применять к обычным ссылкам, которые не находятся в списках. CSS код этого метода:
Internet Explorer тормозит широкое использование уже давно появившихся псевдо-элементов fore и :after, которые могут идеально выполнять необходимую функцию определения уже посещенных ссылок. Почти все современные браузеры поддерживают эти элементы.
#5 :link :hover :visited | CSS | Frontend | Take it easy #shorts
Для псевдо-элементов fore и :after Майк Дэйвидсон (и несколько людей до него) предложил вместо текста использовать знак корня (радикал) – своеобразная галочка. Но эта галочка является не картинкой, а unicode символом ( 221A ), который появляется после ссылки, по адресу которой уже был определенный посетитель. Весь код также находиться в CSS и выглядит следующим образом:
a:visited:after
0A0 означает непрерывающиеся пустое место (вместо пробела).
Я думаю, что различные галочки иногда могут вводить пользователя в заблуждение. В его понимании этот знак может нести в себе другой смысл. Поэтому необходимо дать знать посетителю сайта о том, какую роль выполняет определенный символ после ссылок.
Источник: visavi.net
Что такое » visited links » ?
В нашей базе содержится 4 разных файлов с именем visited links . You can also check most distributed file variants with name visited links.
Подробности о наиболее часто используемом файле с именем «visited links»
Продукт: (Пустое значение) Компания: (Пустое значение) Описание: (Пустое значение) Версия: (Пустое значение) MD5: fdcaa34886216f69bcdab9ad3148d2ca SHA1: d28e5748c6d23b36ac58712e3e9befcec23b4327 SHA256: 0c771311736438fc86d298a1c2a801575bba350eee3cfa2752bab2fa5ed03813 Размер: 131072 Папка: %USERPROFILE%AppDataLocalGoogleChromeUser DataDefault ОС: Windows 7 Частота: Низкая
Проверьте свой ПК с помощью нашей бесплатной программы
System Explorer это наша бесплатная, удостоенная наград программа для быстрой проверки всех работающих процессов с помощью нашей базы данных. Эта программа поможет вам держать систему под контролем.
«visited links» безопасный или опасный?
Последний новый вариант файла «visited links» был обнаружен 3910 дн. назад.
Комментарии пользователей для «visited links»
У нас пока нет комментариев пользователей к файлам с именем «visited links».
Добавить комментарий для «visited links»
Для добавления комментария требуется дополнительная информация об этом файле. Если вам известны размер, контрольные суммы md5/sha1/sha256 или другие атрибуты файла, который вы хотите прокомментировать, то вы можете воспользоваться расширенным поиском на главной странице .
Если подробности о файле вам неизвестны, вы можете быстро проверить этот файл с помощью нашей бесплатной утилиты. Загрузить System Explorer.
Проверьте свой ПК с помощью нашей бесплатной программы
System Explorer это наша бесплатная, удостоенная наград программа для быстрой проверки всех работающих процессов с помощью нашей базы данных. Эта программа поможет вам держать систему под контролем. Программа действительно бесплатная, без рекламы и дополнительных включений, она доступна в виде установщика и как переносное приложение. Её рекомендуют много пользователей.
Источник: systemexplorer.net
Visited links что это за файл
The :visited CSS pseudo-class represents links that the user has already visited. For privacy reasons, the styles that can be modified using this selector are very limited.
Styles defined by the :visited pseudo-class will be overridden by any subsequent link-related pseudo-class ( :link , :hover , or :active ) that has at least equal specificity. To style links appropriately, put the :visited rule after the :link rule but before the :hover and :active rules, as defined by the LVHA-order: :link — :visited — :hover — :active .
Privacy restrictions
For privacy reasons, browsers strictly limit which styles you can apply using this pseudo-class, and how they can be used:
- Allowable CSS properties are color , background-color , border-color , border-bottom-color , border-left-color , border-right-color , border-top-color , column-rule-color , outline-color , text-decoration-color , and text-emphasis-color .
- Allowable SVG attributes are fill and stroke .
- The alpha component of the allowed styles will be ignored. The alpha component of the element’s non- :visited state will be used instead, except when that component is 0 , in which case the style set in :visited will be ignored entirely.
- Although these styles can change the appearance of colors to the end user, the window.getComputedStyle method will lie and always return the value of the non- :visited color.
- The element is never matched by :visited .
Note: For more information on these limitations and the reasons behind them, see Privacy and the :visited selector.
Syntax
Examples
Properties that would otherwise have no color or be transparent cannot be modified with :visited . Of the properties that can be set with this pseudo-class, your browser probably has a default value for color and column-rule-color only. Thus, if you want to modify the other properties, you’ll need to give them a base value outside the :visited selector.
В нашей базе содержится 4 разных файлов с именем visited links . You can also check most distributed file variants with name visited links.
Подробности о наиболее часто используемом файле с именем «visited links»
Продукт: (Пустое значение) Компания: (Пустое значение) Описание: (Пустое значение) Версия: (Пустое значение) MD5: fdcaa34886216f69bcdab9ad3148d2ca SHA1: d28e5748c6d23b36ac58712e3e9befcec23b4327 SHA256: 0c771311736438fc86d298a1c2a801575bba350eee3cfa2752bab2fa5ed03813 Размер: 131072 Папка: %USERPROFILE%AppDataLocalGoogleChromeUser DataDefault ОС: Windows 7 Частота: Низкая
Проверьте свой ПК с помощью нашей бесплатной программы
System Explorer это наша бесплатная, удостоенная наград программа для быстрой проверки всех работающих процессов с помощью нашей базы данных. Эта программа поможет вам держать систему под контролем.
«visited links» безопасный или опасный?
Последний новый вариант файла «visited links» был обнаружен 3359 дн. назад.
Комментарии пользователей для «visited links»
У нас пока нет комментариев пользователей к файлам с именем «visited links».
Добавить комментарий для «visited links»
Для добавления комментария требуется дополнительная информация об этом файле. Если вам известны размер, контрольные суммы md5/sha1/sha256 или другие атрибуты файла, который вы хотите прокомментировать, то вы можете воспользоваться расширенным поиском на главной странице .
Если подробности о файле вам неизвестны, вы можете быстро проверить этот файл с помощью нашей бесплатной утилиты. Загрузить System Explorer.
Проверьте свой ПК с помощью нашей бесплатной программы
System Explorer это наша бесплатная, удостоенная наград программа для быстрой проверки всех работающих процессов с помощью нашей базы данных. Эта программа поможет вам держать систему под контролем. Программа действительно бесплатная, без рекламы и дополнительных включений, она доступна в виде установщика и как переносное приложение. Её рекомендуют много пользователей.
Тег link подключает CSS файлы на HTML страницу. Кроме того, link подключает некоторые другие файлы, например, фавикон. (Фавикон — это ярлычок сайта, который виден во вкладке браузера. Его также можно увидеть в некоторых поисковиках при поиске напротив сайтов, например в Яндексе).
У данного тега очень много атрибутов и они могут принимать разнообразные значения, однако в реальной жизни они все практически не используются. Самое популярное — это подключение CSS и добавление фавикона.
Как подключить CSS в HTML5: . В более ранних версиях нужно было добавлять атрибут type в значении text/css. В HTML5 так тоже можно делать, но это не обязательно.
Тег link не требует закрывающего тега.
Атрибуты
| Путь к подключаемому файлу. |
| Тип устройства, для которого следует подключить файл. Что имеется ввиду — вы можете подключить CSS файл только для больших экранов (значение screen ) или только для маленьких экранов: для мобильников или планшетов (значение handheld ). Возможные значения: all, braille, handheld, print, screen, speech, projection, tty, tv. Подробнее смотрите ниже. |
| Тип подключаемого файла. Возможные значения: stylesheet | alternate. Значение stylesheet указывает на то, что подключается CSS файл, значение alternate используется, к примеру, для указания ссылки на файл в формате XML для описания ленты новостей, анонсов статей. |
| Кодировка подключаемого файла. В настоящее время стандартом является utf-8 . |
| Тип данных подключаемого файла. Для CSS следует использовать text/css, для фавикона: image/x-icon. |
Значения атрибута media
В HTML5 в качестве значений могут быть указаны медиа-запросы.
| Все устройства. |
| Экран монитора. |
| Телефоны, смартфоны, устройства с маленьким экраном. |
| Устройства, основанные на системе Брайля, предназначены для слепых людей. |
| Речевые синтезаторы, а также программы для воспроизведения текста вслух. Сюда же входят речевые браузеры. |
| Принтеры. |
| Проекторы. |
| Телетайпы, терминалы, портативные устройства с ограниченными возможностями экрана. Для них не должны использоваться пиксели в качестве единиц измерения. |
| Телевизоры, которые умеют открывать web страницы (бывает и такое). |
Значение по умолчанию: all .
Пример
Давайте посмотрим, как выглядит структура простейшей html страницы, к которой добавим подключение CSS файлов и фавикона:
Я думаю, что вы, посещая различные сайты в интернете, обращали внимание на то, что ссылки обычно реагируют на наведение мышкой на них. Такого эффекта можно добиться, задавая поведение ссылок в различных состояниях.
К примеру, вот так — a:hover — мы поймаем состояние, когда на ссылку навели курсор мышки. В этот момент мы можем, к примеру, поменять цвет ссылки или убрать/добавить ей подчеркивание. Конструкция :hover называется . Псевдоклассы позволяют отлавливать разные состояния элементов.
Кроме :hover есть еще псевдоклассы :link , которые отлавливают не посещенную ссылку, и :visited , которые отлавливают посещенную ссылку. На некоторых сайтах с их помощью показывают пользователям, где они были, а где — нет. Есть еще и псевдокласс :active , который отлавливает следующее состояние: на элемент нажали мышкой, но еще не отпустили.
В следующем примере для ссылки в состоянии :hover убирается подчеркивание, в состоянии :link задается красный цвет, в состоянии :visited — зеленый, в :active — голубой. В результате получится, что в начале ссылка будет красного цвета, после нажатия на нее — зеленого, если нажать на нее мышкой и не отпускать — голубого, а если навести мышкой — станет неподчеркнутой.
Нюансы
Псевдоклассы наследуют друг от друга. К примеру, если я уберу подчеркивание для состояния :link , то оно уберется для всех состояний.
Из-за наследования для корректной работы данные псевдоклассы следует размещать именно в таком порядке, как в примере: :link , :visited , :hover , :active (ненужные можно не писать). Этот порядок подчиняется следующему мнемоническому правилу: LoVe HAte.
Сделайте все ссылки в состоянии :hover красными и неподчеркнутыми, в состоянии :link — голубыми, в состоянии :visited — зелеными, в состоянии :active — черными.
Состояния link и visited
Часто состояния :link и :visited объединяют вместе через запятую:
В таком случае можно их вообще и не указывать:
Обычное использование
Как правило, указываются состояния для всех типов ссылок одновременно, а потом ниже добавляются особенности поведения ссылки при наведении мышкой, вот так:
Сделайте все ссылки во всех состояниях голубыми и неподчеркнутыми, а в состоянии — красными и подчеркнутыми.
- Как запустить файл c
- Как воспроизвести видео с компьютера на телевизор potplayer
- Acorp модем мигает и связь рвется
- Asrock 970 extreme3 совместимость
- Как установить diablo 3 на playstation 4
Источник: kompyutery-programmy.ru