Hiperłącza <a> (linki) w HTML

MZ | 12-06-2017 | 22:50:38

Dlaczego znacznik definiujący link na stronie to właśnie <a>? Prawdopodobnie wzięło się to od angielskiego słowa "anchor", które oznacza kotwicę (gdyż hiperłącza są – jak to mówimy – zakotwiczone w dokumencie). Link jest złożony z dwóch znaczników – posiada zatem tag otwierający oraz zamykający: <a>Podlinkowany tekst</a>. Jest to logiczne, gdyż musimy zdefiniować obszar, który stanowi rzeczywistą kotwicę linku, namacalne obiekty możliwe do kliknięcia. W przykładowym linku poniżej podlinkowany jest tekst "Pasja informatyki" (to właśnie on jest tzw. anchorem):

<a href="http://pasja-informatyki.pl">Pasja informatyki</a>

A tak wygląda to w przeglądarce: Pasja informatyki

Atrybut href

Atrybut href to skrót od ang. hypertext reference – określamy tutaj adres dokumentu HTML, do którego hiperłącze ma prowadzić. Reference oznacza z ang. odniesienie – i rzeczywiście czasami tak określamy linki – mówimy, że to odnośniki do innych dokumentów. Co ważne – atrybut href nie jest wcale wymagany. Mogą istnieć znaczniki <a>, bez podania adresu linka – np. w menu głównym strony (w górnej belce witryny). Dochodzimy tutaj do wniosku, iż tak naprawdę hiperłączem możemy nazwać jedynie element <a>, który posiada określony wartością atrybut href – sam element <a> nie prowadzi przecież pod żaden adres.

Atrybut target

Hiperłącze może także posiadać atrybut target (ang. cel), który określa gdzie docelowo w przeglądarce ma trafić podlinkowany dokument:

<a href="http://pasja-informatyki.pl" target="_blank">Pasja informatyki</a>

Możliwe wartości atrybutu target są następujące:

  • target="_self" – otwórz stronę w tej samej karcie/ramce , w której znajduje się link (ponieważ jest to zachowanie domyślne, można ten atrybut pominąć),
  • target="_blank" – otwórz witrynę w nowej, nieużywanej karcie przeglądarki (uwaga: nie należy nadużywać tego mechanizmu! Kieruj się empatią wobec internauty i otwieraj nowe karty tylko tam, gdzie rzeczywiście wydaje się to pożądane – w przeciwnym wypadku gość odwiedzający naszą stronę zirytuje się i natychmiast ją opuści),
  • target="_parent", target="_top" – otworzy adres hiperłącza w odpowiedniej ramce – jest to związane z tzw. framesetem (ang. zestaw ramek). Wartość _parent otworzy witrynę w ramce o jeden poziom wyższej we framesetowej hierarchii, a _top w nadrzędnej ramce. Jednak budowanie witryny na ramkach to relikt przeszłości. Są one fatalne zwłaszcza w kontekście SEO, jak również niewygodne dla internauty. W praktyce więc raczej nie zdarzy Ci się używać tych wartości atrybutu target.

Uwaga: domyślny styl linków to podkreślony tekst koloru niebieskiego (jeżeli ten link jeszcze nie był odwiedzony), albo podkreślony tekst koloru fioletowego (w przypadku adresu, który już odwiedziliśmy). Jeżeli chcesz dowiedzieć się, jak zmienić ten domyślny wygląd hiperłączy, to zajrzyj koniecznie do tego artykułu.

Zobacz także

Daj się zaskoczyć! Poniżej wylosowałem dla Ciebie pięć wpisów z całego archiwum bloga:

Komentarze

Disqus
Facebook
Pasja informatyki