Linki są podstawowym elementem nawigacji w HTML. Pozwalają łączyć strony, sekcje strony oraz inne zasoby internetowe. Stanowią również bardzo ważny punkt optymalizacji stron internetowych w kontekście SEO. Wyróżniamy trzy główne typy linków: wewnętrzne, zewnętrzne i kotwice.
Linki wewnętrzne
Linki wewnętrzne pozwalają na nawigację między stronami w obrębie jednej witryny. Tworzymy je za pomocą atrybutuhref , gdzie podajemy ścieżkę do pliku docelowego wewnątrz naszej witryny.
Linki zewnętrzne prowadzą do innych witryn internetowych. Również tworzymy je za pomocą atrybutuhref, ale w ścieżce odsyłającej podajemy pełny adres URL strony docelowej. Dobrą praktyką jest otwieranie linków zewnętrznych na nowej karcie, aby to zrobić, dodajemy atrybut target="_blank".
Kotwice są linkami, które pozwalają na nawigację w obrębie jednej strony, przenosząc użytkownika do określonego elementu na stronie. W atrybucie href używamy znaku # wraz z identyfikatorem (ID) elementu docelowego. Następnie aby stworzyć element docelowy, musimy również dodać atrybut id do odpowiedniego tagu HTML.
Przykład użycia kotwic:
<a href="#sekcja1">Przejdź do sekcji 1</a>
<a href="#kontakt">Przejdź do formularza kontaktowego</a>
...
<div id="sekcja1">To jest sekcja 1.</div>
...
<section id="kontakt">
<h2>Formularz kontaktowy</h2>
<!-- Formularz kontaktowy -->
</section>
Kotwice wykorzystywane są najczęściej do tworzenia spisów treści lub w przypadku bardziej rozbudowanych serwisów do nawigacji po stronie, które zawierają dużo materiału.
Warto zapamiętać
Tworzenie linków w HTML jest kluczowe dla zapewnienia łatwej nawigacji i intuicyjnego doświadczenia użytkownika. Wiedza na temat tworzenia różnych typów linków pozwala twórcom stron na budowanie spójnej struktury witryny oraz umożliwia szybkie przemieszczanie się użytkownikom między poszczególnymi sekcjami i stronami.
Swoją przygodę z projektowaniem stron internetowych rozpocząłem z kursem od Komputer Świat wydanym w marcu 2003 roku w formie małej książeczki. Na przestrzeni 20 lat zaprojektowałem niezliczoną ilość witryn i aplikacji internetowych. Projektowałem dla małych i dużych firm takich jak Oriflame, Top Market, Bezpieczna Rodzina czy Helping Hand.