HTML linkovi (poveznice) čine temelj cijelog Interneta. Web sjedišta su međusobno povezana linkovima (poveznicama).
Zašto ne sada?
CDN pohrana slika i videa.
Pretvorba formata slika: webp...
Vrhunsko AI povećanje slika!
25Gb podataka.
Zašto ne sada?
HTML linkovi (poveznice) čine temelj cijelog Interneta. Zapravo je sve međusobno povezano pomoću linkova. Element poveznice je <a> gdje slovo a dolazi od engleske riječi Anchor (sidro).
HTML poveznica nema funkciju ako ne odredimo kamo ona pokazuje. Kamo pokazuje umetanjem svojstva href kojem dodjeljujemo vrijednost adrese odredišta.
Primjer u kojem tekst "Googlanje" povezuje našu web stranicu s Google tražilicom:
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Tekst kao poveznica</title>
</head>
<body>
<h2>Tekst kao poveznica ili link</h2>
<a href="https://www.google.hr">Googlanje</a>
</body>
</html>
HTML poveznica može biti i slika. Ne zaboravite da putanja do slike mora biti navedena kao vrijednost svojstva src. Ako ne navedemo putanju slika se mora nalaziti u istoj mapi kao i html dokument.
U sljedećim primjerima koristit ćemo sliku mojwebdizajn.jpg. Možete je preuzeti na donjoj poveznici.
U slijedećem primjeru umjesto teksta koristimo sliku kao poveznicu:
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Slika kao poveznica</title>
</head>
<body>
<h2>Slika kao poveznica</h2>
<a href="https://www.google.hr">
<img src="mojwebdizajn.jpg" alt="Moj web dizajn" />
</a>
</body>
</html>
Svojstvo href pokazuje na odredište kamo poveznica vodi. Odredište može biti:
Na istoj web stranici
Na istom web sjedištu
Na bilo kojem web sjedištu
Ako se odredište poveznice nalazi na istoj web stranici potrebno je svojstvu href dodijeliti vrijednost identifikatora na koji poveznica vodi.
Svojstvo href="#vrh"
Ovaj primjer koristimo kada želimo staviti poveznicu koje će s jednog dijela stranice skočiti na drugo mjesto na web stranici. Dvije stvari treba napraviti. Prvo potrebno je u prvi html element na stranici staviti identifikator (svojstvo id) i dodijeliti mu vrijednost vrh. Npr.
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Poveznica na istu stranicu</title>
</head>
<body>
<h2 id="vrh">Mjesto na koje pokazuje poveznica</h2>
...
I drugo, na dnu stranice stavimo slijedeću poveznicu:
...
<a href="#vrh">Povratak na vrh web stranice</a>
Ako se odredište poveznice nalazi na istom web sjedištu potrebno je svojstvu href dodijeliti naziv i putanju web stranice na koju poveznica vodi.
Kada se web stranica nalazi u istoj mapi svojstvu href dodjeljujemo samo puni naziv html dokumenta: href="drugi.html".
Ako se web stranica nalazi u nekoj drugoj mapi uz ime potrebno je dodijeliti svojstvu href i relativnu putanju do toga html dokumenta (u ovom primjeru html dokument se nalazi u mapi blog).
Svojstvo href="blog/drugi.html"
Kada se odredište poveznice ne nalazi na istom web sjedištu potrebno je svojstvu href dodijeliti puni URL naziv web sjedišta.
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
</head>
<body>
<a href="https://www.google.hr">Googlanje</a>
</body>
</html>
Ponekad želimo ostaviti otvorenu web stranicu na kojoj se nalazi poveznica i web stranicu otvoriti u novom prozoru. Tada osim svojstva href, html elementu poveznice <a> moramo dodati svojstvo target="_blank".
Pogledajmo primjer:
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
</head>
<body>
<h2>Poveznica u novom prozoru</h2>
<a href="https://www.google.hr" target="_blank">
<img src="mojwebdizajn.jpg" alt="Moj web dizajn" />
</a>
</body>
</html>