Ce face <a>
Tagul <a> (anchor) este fundamentul întregului Web: leagă paginile între ele prin hyperlinkuri. Atributul obligatoriu pentru funcționarea unui link este href (hypertext reference).
Poate deschide o pagină nouă în alt tab cu target="_blank" (caz în care este obligatoriu să adaugi rel="noopener noreferrer" din motive de securitate), poate trimite un email (href="mailto:..."), poate iniția un apel telefonic (href="tel:...") sau poate derula pagina la un element cu un anumit ID (ancoră: href="#id").
Atribute
| Atribut | Descriere |
|---|---|
href |
Destinația linkului: URL complet, cale relativă, ancoră (#id), mailto: sau tel:. |
target |
Unde se deschide linkul: „_blank” (filă nouă), „_self” (în aceeași pagină, implicit). |
rel |
Relația cu pagina destinație: „noopener”, „noreferrer”, „nofollow”. |
download |
Instruiește browserul să descarce fișierul țintă în loc să îl deschidă. |
Exemple
Exemplul 1: Link intern, link extern și link de email
Textele dintre taguri devin albastre și subliniate în mod implicit.
<p>Citește <a href="/invata/html/">ghidul complet HTML</a>.</p>
<p>Deschide <a href="https://google.com" target="_blank" rel="noopener noreferrer">Google într-o filă nouă</a>.</p>
<p>Scrie-ne la <a href="mailto:contact@exemplu.ro">contact@exemplu.ro</a>.</p>Ce afișează browserul
Citește ghidul complet HTML (link albastru).
Deschide Google într-o filă nouă.
Scrie-ne la contact@exemplu.ro.Greșeli frecvente
- Folosirea de texte vagi pentru link, cum ar fi click aici sau citește mai mult. Textul linkului trebuie să descrie clar destinația, atât pentru utilizatori, cât și pentru SEO.
- Deschiderea linkurilor externe cu target=”_blank” fără atributul rel=”noopener noreferrer”, ceea ce creează o vulnerabilitate de securitate (tabnapping).
- Folosirea pe post de buton; pentru acțiuni din JavaScript se folosește tagul
Comenzi înrudite
<link>: Leagă documentul curent de resurse externe: fișiere CSS, pictograme (favicon), fonturi web sau versiuni canonice.<button>: Element clicabil pentru declanșarea trimiterii formularelor sau a unor acțiuni JavaScript în pagină.<nav>: Marchează o secțiune dedicată navigației principale pe site sau a unui cuprins de capitole.