W pliku CSS znajdują się poniższe style. Kiedy klikniemy na hiperłącze i wrócimy na stronę, jego kolor zmieni się na
| a { color: Brown; } a:link { color: Green; } a:visited { color: Red; } a:hover { color: Yellow; } |
W stylach CSS dla hiperłączy istnieją różne pseudoklasy które określają ich wygląd w zależności od stanu. W tym przypadku kolor czerwony przypisany jest do pseudoklasy a:visited co oznacza że po odwiedzeniu i późniejszym powrocie na stronę hiperłącze przyjmie kolor czerwony. Pseudoklasa a:visited jest używana aby oznaczyć linki które użytkownik już odwiedził co jest przydatne w nawigacji i pozwala użytkownikom zidentyfikować które strony już odwiedzili. Dobre praktyki w projektowaniu stron internetowych zalecają użycie wyraźnych i kontrastujących kolorów aby użytkownicy mogli łatwo rozpoznać odwiedzone linki co poprawia doświadczenie użytkownika. Warto pamiętać że przeglądarki mają różne poziomy wsparcia dla pseudoklasy a:visited w kontekście stylizacji innych właściwości niż kolor co wynika z wymogów prywatności. Dlatego w standardowych przypadkach kolorowe oznaczenie linków przynosi pożądany efekt zapewniając zgodność z wytycznymi WCAG dotyczącymi dostępności stron internetowych. Bardzo ważne jest aby projektując strony internetowe dbać o klarowność i intuicyjność nawigacji co zwiększa satysfakcję z użytkowania serwisu.
W zrozumieniu działania stylów CSS dla hiperłączy kluczowe jest poznanie zastosowania pseudoklas takich jak a:link a:visited i a:hover. Każda z tych pseudoklas odpowiada za inny stan linku. Pseudoklasa a:link stosuje się do linków które użytkownik jeszcze nie odwiedził dlatego kolor zielony przypisany do tej pseudoklasy oznaczałby nieodwiedzony link co w tym przypadku jest nieprawidłowe. Pseudoklasa a:hover zmienia kolor podczas najechania myszką i tutaj ustalono kolor żółty który jest tylko tymczasowy. Błędne byłoby uznawanie że kolor żółty pozostanie po odwiedzeniu linku ponieważ dotyczy on jedynie stanu przejściowego. Pseudoklasa a:visited która definiuje kolor po odwiedzeniu jest tu kluczowa ponieważ określa właśnie kolor po powrocie na stronę. Zastosowanie odpowiednich stylów pomaga w nawigacji i poprawia dostępność. Typowe błędy związane z rozumieniem pseudoklas wynikają z braku znajomości ich specyfiki działania oraz priorytetu jaki mają w kaskadowym modelu stylów. Dlatego zrozumienie i prawidłowe stosowanie tych zasad jest fundamentalne w projektowaniu intuicyjnych i przyjaznych dla użytkownika stron internetowych co jest zgodne z najlepszymi praktykami branżowymi i standardami WCAG.