Limbajul HTML utilizeaza hiperlegaturile pentru a realiza o conexiune cu un alt document de pe Web (Internet).
Aceste legaturi sunt utile deoarece ele permit o deplasare dirijata si usor de inteles prin documentele HTML (prin paginile HTML care constituie un site).
Exista trei tipuri de legaturi:
- interne = legaturi in interiorul unui document HTML (pagina Web). Aceste legaturi ajuta la deplasarea prin documente ce contin foarte multa informatie (text);
- locale = legaturi la alte pagini HTML de pe acelasi server Web;
- externe = legaturi la pagini HTML aflate pe alte servere Web.
D.1. Marcajul <a> si atributul "href".
Limbajul HTML utilizeaza marcajul ancora <a> (anchor = ancora) pentru a crea o legatura spre un alt document. Un marcaj ancora poate tinti (indica) orice resursa de pe Web: un document HTML, o imagine (fisier grafic), fisier sunet, film, etc.
Sintaxa care ne permite sa cream o ancora este urmatoarea:
<a href="URL">Text ce va fi afisat</a>
Marcajul <a> este utilizat pentru a crea ancora, iar atributul "href" stabileste adresa documentului de care se leaga ancora. Textul dintre marcajul de start <a> si marcajul final </a> va fi textul care va fi afisat ca hiperlegatura.
Pentru a exemplifica cele discutate anterior vom utiliza un document HTML care va contine o hiperlegatura catre motorul de cautare "Google" (www.google.com). Continutul documentului HTML va este oferit in continuare:
<html>
<body bgcolor="orange">
<a href="http://www.google.com/">GOOGLE!</a>
</body>
</html>
Daca vom da un click (butonul din stanga al mouse-ului) pe textul "GOOGLE", acesta va avea ca rezultat deplasarea la pagina de start a motorului de cautare "Google".
Urmatorul exemplu contine o legatura catre pagina HTML "d2a.html" (<a href="d2a.html">Legatura catre a doua pagina!</a>) si o legatura ce permite deschiderea automata a formularului de introducere a unui e-mail(<a href= "mailto:nume@yahoo.com">Trimite un e-mail!</a>).
Pagina HTML "d2a.html" contine o legatura (<a href="d2.html">Inapoi la prima pagina!</a>) care permite reantoarcerea la pagina HTML initiala (d2.html).
Continutul fisierului "d2.html":
<html>
<body bgcolor="orange">
<h1>Pagina 1</h1>
<a href="d2a.html">Legatura catre a doua pagina!</a>
<hr>
<a href="mailto:nume@yahoo.com">Trimite un e-mail!</a>
</body>
</html>
Continutul fisierului "d2a.html":
<html>
<body bgcolor="orange">
<h1>Pagina 2</h1>
<a href="d2.html">Inapoi la prima pagina!</a>
</body>
</html>
D.2. Atributul "target".
Atributul "target" ne permite sa definim unde va fi deschis documentul spre care ne trimite un marcaj ancora <a>.
Urmatorul fragment de cod sursa va deschide documentul (pagina de start a motorului de cautare Yahoo) intr-o noua fereastra a navigatorului:
<a href="http://www.yahoo.com/" target="_blank">Yahoo!</a>
In urmatorul tabel va sunt oferite valorile atributului "target" si o scurta descriere a scopului lor.
Valoare atribut "target" |
Scop |
target="_blank" |
Deschide (incarca) noul document intr-o fereastra noua. |
target="_self" |
Deschide (incarca) noul document in aceasi fereastra cu marcajul ancora (inlocuieste continutul ferestrei).
Este optiunea implicita, in cazul in care nu se utilizeaza atributul "target". |
target="_parent" |
Deschide (incarca) noul document in cadrul (frame) principal (parinte) in cazul utilizarii cadrelor (frames). |
target="_top" |
Deschide (incarca) noul document in intreaga fereastra a navigatorului, eliminand cadrele. |
D.3. Atributul "name".
Atributul "name" este utilizat pentru a atribui un nume unei ancore. Utilizarea unei ancore ce are atribuit un nume permite crearea unei legaturi ce ne va trimite direct la o anumita sectiune dintr-un document HTML (pagina HTML), eliminand deplasarea prin document pentru a gasi ceea ce cautam.
Sintaxa unei ancore ce are atribuit un nume este urmatoarea:
<a name="nume">Textul care se afiseaza</a>
Atributul "name" este utilizat pentru a crea o ancora cu nume. Numele atribuit unei ancore (marcaj ancora) poate fi orice nume doriti.
In continuare va este oferit un exemplu de declarare a unei ancore cu nume atribuit:
<a name="sfaturi">Sfaturi utile!</a>
Pentru a ne lega de o ancora ce are atribuit un nume vom adauga caracterul "#" si numele ancorei la sfarsitul adresei URL, dupa cum se poate observa in continuare:
<a href="www.pagina.com/pagina.html#sfaturi">Cititi sfaturile utile!</a>
Marcajul ancora anterior va trimite utilizatorul direct la textul din interiorul ancorei "<a name="sfaturi">Sfaturi utile! </a>" din documentul HTML "pagina.html" aflat la adresa "www.pagina.com".
O legatura din documentul HTML "pagina.html" catre o ancora din interiorul aceluiasi documentului are urmatoarea sintaxa:
<a href="#w2">Sfaturi utile Windows XP!</a>
|