HTML poveznice (linkovi) su temelj Interneta. Bez poveznica ne bi imali mogućnost (kako i ime kaže) povezivanja različitih web stranica. Element poveznice je <a> (engl. anchor – sidro). On je paran, linijski element.
HTML poveznica mora "znati" adresu web stranicu s kojom nas ona povezuje. Adresu dodjelite svojstvu href.
svojstvo hrefSvojstvu href možemo dodijeliti relativnu adresu u odnosu na izvorišnu mapu (u kojoj se nalazi html datoteka) ili u odnosu na korijensku (engl. root) mapu na istom web sjedištu. Također možemo dodijeliti apsolutnu ili URL adresu koja pokazuje na bilo koje web sjedište na Internetu.
Između početne i završne oznake poveznice <a>, treba umetnuti tekst ili sliku. Klikom na njih, web preglednik će otvoriti web stranicu čija je adresa pohranjena u svojstvu href.
U slijedećem primjeru, koristimo tekst Otvori tražilicu kao poveznicu na web stranicu Google tražilice.
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Poveznice ili linkovi</title>
</head>
<body>
<h1>Poveznice</h1>
<a href="https://www.google.hr">Otvori tražilicu</a>
</body>
</html>
U sljedećim primjerima koristit ćemo sliku barol.png. Možete je preuzeti na donjoj poveznici. Slika je veličine 1250px s 540px.
Osim teksta i slika može poslužiti kao poveznica.
slika kao poveznicaSlika mora uvijek imati svojstva src i alt. Ako se slika nalazi u istoj mapi kao i web stranica svojstvo src ne treba sadržavati putanju, nego treba samo navesti ime slike i nastavak (engl. extension).
U slijedećem primjeru umjesto teksta, koristimo sliku bartol.png kao poveznicu:
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Slika kao poveznica</title>
</head>
<body>
<h1>Slika kao poveznica</h1>
<a href="https://www.google.hr">
<img src="bartol.png" alt="Bartol plus" />
</a>
</body>
</html>
Pomoću svojstva href određujemo web stranicu odredišta. Ona može biti:
Unutar te stranice.
U istom web sjedištu.
Bilo gdje na Internetu.
U slijedećem primjeru koristimo poveznicu kako bi povezali kraj web stranice s početkom iste web stranice. Treba napraviti dvoje:
1. Html elementu koji je sidrište, postavite vrijednost identifikatora, npr. id="top".
2. Tu vrijednost identifikatora (top), umetnite kao vrijednost svojstva href poveznice
iza znaka ljestve #. Vrijednost svojstva href je "#top".
Nakon što preuzmete i pokrenete primjer, dođite na kraj web stranice gdje se nalazi tekst poveznice na vrh stranice.
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Poveznica na isti dokument</title>
</head>
<body>
<h1 id="top">S ovim elementom ćemo se povezati</h1>
<!-- Oznake <br /> umetnuli smo kako bi simulirali
sadržaj web stranice i vidjeli pomak -->
<br /><br /><b r /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<a href="#top">Povratak na vrh web stranice</a>
</body>
</html>
Kada se web stranica nalazi u istoj mapi i na istom web sjedištu, svojstvu href dodjeljujemo samo naziv html dokumenta, npr. href="pismo.html".
Ako se web stranica na koju poveznica pokazuje ne nalazi u istoj mapi, prije naziva html dokumenta, treba umetnuti putanju do tog dokumenta, npr. href="rasprava/pismo.html".
Putanja može biti relativna u odnosu na mapu u kojoj se nalazi html datoteka ili relativno u odnosu na korijensku (engl. root) mapu. Više o tome pročitajte u članku:
Kada se odredište poveznice nalazi izvan web sjedišta, potrebno je svojstvu href dodijeliti puni URL (engl. Uniform Resource Location), tj. adresu web sjedišta.
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Odredište poveznice na Internetu</title>
</head>
<body>
<h1>Odredište na Internetu</h1>
<a href="https://www.google.hr">Otvori tražilicu</a>
</body>
</html>
Želimo li pomoću poveznice, otvoriti html dokument na novoj kartici web preglednika, trebamo html elementu poveznice dodati svojstvo target="_blank".
Slijedeći primjer će vam pomoći:
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Poveznica na novoj kartici</title>
</head>
<body>
<h1>Poveznica na novoj kartici</h1>
<a href="https://www.google.hr" target="_blank">Otvori tražilicu</a>
</body>
</html>
Izaberi najbolje
CDN pohrana slika i videa.
AI povećanje slika.
Pretvorba formata slika: webp...
25Gb podataka.
Zašto ne sada?