Odsyłacze w HTML – linki i atrybuty

Tworzenie linków, odsyłaczy do sekcji oraz atrybuty href, target, rel · INF.03

Podstawowy znacznik linku

Link tworzymy za pomocą znacznika odede><a> z atrybutem odede>href, który wskazuje adres URL lub lokalny odsyłacz.

<a href="https://example.com">Odwiedź przykład</a>

Atrybuty linków

  • href — adres docelowy linku (URL lub #id sekcji)
  • target — gdzie otworzyć link (_blank - nowa karta, _self - ta sama zakładka)
  • rel — relacje linku, np. nofollow, noopener, noreferrer

Odsyłacze do sekcji strony (kotwice)

Linki do elementów na tej samej stronie tworzymy przez odniesienie do identyfikatora sekcji:

<a href="#kontakt">Przejdź do kontaktu</a>

<section id="kontakt">
  <h2>Kontakt</h2>
  <p>Dane kontaktowe...</p>
</section>

Przykłady bardziej złożonych linków

<a href="https://przyklad.com" target="_blank" rel="noopener noreferrer">Zewnętrzna strona</a>

<a href="#top" title="Powrót na górę strony">Do góry</a>

Ćwiczenia praktyczne

Ćwiczenie 1 — Stwórz link do innej strony oraz link do sekcji na stronie. 
<a href="https://twojastrona.pl">Strona główna</a>
<a href="#kontakt">Kontakt</a>
Ćwiczenie 2 — Dodaj atrybut target="_blank" i rel="noopener" do linku zewnętrznego. 
<a href="https://example.com" target="_blank" rel="noopener">Otwórz w nowej karcie</a>

Quiz

<a href="https://example.com">
<link href="https://example.com">
Otwiera link w nowej karcie
Otwiera w obecnej zakładce
Za pomocą href="#id"
Za pomocą anchor

Podsumowanie

Tworzenie linków w HTML to podstawowa umiejętność. Znajomość atrybutów jak href, target i rel pozwala na kontrolę zachowania i bezpieczeństwa linków.

Odsyłacze do sekcji ułatwiają nawigację po stronie i poprawiają doświadczenia użytkownika.

Checklista

Materiały: INF.03 — Odsyłacze w HTML · Autor: Tomasz Puchała © 2025