Linkowanie jest czymś co normalnie nie występuje w innych mediach. Można zamieścić odnośnik pod słowem, frazą lub obrazkiem, który zabierze użytkownika w inne miejsce. Miejsca te nazywa się kotwicami (po angielsku anchor). Można sobie wyobrazić, że wysztkie strony internetowe są statkami umiejscowionymi w konkretnym miejscu na morzu sieci internetowej. Są one zakotwiczone w jednym miejscu,pod konkretnym adresem,który możemy wskazać.
anchor Zazwyczaj umieszczane są one na górze strony ale możemy je umiejscowić gdziekolwiek.

Typowa skladnia odnośnika:

<a href=”http://www.universalcss.com/”>link do tej strony</a>

Umieszone są one w znacznikach <a>…</a> z dodatkowym elementem href=”…”, który wskazuje konkretny adres do ltórego odnośnik prowadzi.

Można też kierować odnośnik do jakiejkolwiek sekcji strony na której się znadujemy. Składnia taka wygląda następująco:

<a name=”myanchor” title=”myanchor”></a>

Odnośniki na stronie wyróżniają się od pozostałego tekstu. Domyślnie są one w czcionce podkreślonej, niebieskiej. Po kliknięciu zmieniąją kolor na czerwony. Jeśli powrócimy na stronę ponownie, będą miały kolor fioletowy.

Domyślna prezentacja odnośników w dokumentach HTML:

Nieodwiedzony link

Aktywny link

Odwiedzony link

Oczywiście nie jesteśmy zadowoleni z wartości domyślnych. Podkreślony link może być praktyczny ale nie koniecznie ładnie wygląda. Najważniejszym kryterium powinno być to, aby link się odróżniał od pozostałego tekstu. Ważnym też jest położenie linku. Jeśli jest od w menu, nie ma znaczenia czy jest on podkreślony czy nie, ponieważ użytkownik wie, że to część nawigacji. W kontekście, niepodkreślony link może użytkownikowi za dużo nie mówić.

Jeśli słowo lub zdanie wygląda inaczej niż pozostała część tekstu, musi mieć to jakąś logiczną przyczynę. Może chcemy ten fragment podkreślić ze względu na jego wagę a może to być odnośnik. Ważnym jest aby w kontekście wszystkie linki wyglądały tak samo, aby użytkownik nie miał problemu z ich znalezieniem.

CSS pozwala na definiowanie odnośników. Syntaks wygląda następująco:

a:link { color: #696; text-decoration: none }

Zmieniliśmy kolor na zielony i zlikwidowaliśmy podkreślenie poprzez dodanie text-decoration:none.

Jeśli chcesz zmienić link odwiedzony, robisz to w nastepujący sposób:

a:visited { color: #699; text-decoration: none }

CSS

pozwala też na ustawianie paramtrów odnośnika nad którym znajduje się kursor.

a:hover { color: #c93; text-decoration: underline }

Aktywny link jest widoczny po kliknięciu.

css link states

Wszystkie parametry odnośników na danej stronie można określic następująco:

a:link { color: #696; text-decoration: none; background-color: transparent }
a:visited { color: #699; text-decoration: none; background-color: transparent }
a:hover { color: #c93; text-decoration: underline; background-color: transparent }
a:active { color: #900; text-decoration: underline; background-color: transparent }

Kolejność jest ważna, dlatego musimy umieścić a:hover i a:active definitions na smym końcu.