Cap.7.

Legturi i referine
1. Referinte externe
n unele cri, atunci cnd autorul face referire la un citat sa o informaie dintr-o alt carte sau un dintr-un
alt document acesta nsereaz ntr-o paranteza numele lucrrii referite, eventual pagina sau seciunea referita.
Daca informaia respectiva prezint interes pentru utilizator, acesta nu are dect sa caute in rafturile bibliotecii
sale (n cazul cel mai fericit) sau ale altor biblioteci, materialul amintit.
Limbajul HTML rezolva aceasta problema prin introducerea noiunii de hipertext. Hipertextul difer de
textul obinuit prin introducere in interiorul documentului a unor elemente de legtura cu alte documente
existente in Web. Prin activarea acestor elemente cu ajutorul mouse-ului sau tastaturii se realizeaz trecerea
instantanee de la documentul iniial (documentul sursa) la cel vizat (documentul destinaie), fiind oricnd posibila
revenirea la documentul iniial. Orice legtura are dou capete numite ancore i un sens. Primul capt
(elementul care refera) este ancora sursa, iar al doilea capt (elementul referit) este ancora destinaie. Ancora
sursa se numete referina i ea poate fi externa sau intern, dup cum ancora destinaie se gsete in afara
sau in interiorul documentului care conine referina.
Prezenta unei referine n interiorul documentului se marcheaz cu ajutorul perechii de controale HTML
<A> si </A>. Pentru ca marcajul de referin s fie funcional, acesta trebuie sa conin atributul Href, numit
atribut de referin hipertext. Valoarea acestuia este un URL care localizeaz documentul referit.
Exemplu:

<A href = "http://www.msn.com/">Legatura cu..</A>

Legturile unui document nu sunt limitate la legturi cu alte documente. El poate sa conin legturi de
tip "mail" sau legturi ctre fiiere de tip "program" care vor fi executate atunci cnd utilizatorul activeaz
referina de legtura corespunztoare.

2. URL-uri relative
Daca informaia pe care o punei la dispoziia utilizatorilor n Web este alctuit din mai multe documente
corelate, ea trebuie structurata corespunztor ntr-o formula de directoare i subdirectoare care sa va ofere o
distribuire
ct
mai
logica
a
materialelor.
Aceasta
structura
formeaz
un
"site".
Sa presupunem ca directorul rdcina al site-ului se numete "Radacina". El conine directoarele
"Produse" si "Informatii" si documentul "index.html". n interiorul directorului "Produse" se gsesc documentele
"Carti.html" i "Muzica.html", iar n directorul "Informatii" se gaseste documentul "Preturi.html".
Un URL relativ este URL-ul n care nu se trece dect calea de la fiierul curent la fiierul destinaie.
Calculatorul va completa automat calea ctre documentul curent, construind astfel URL-ul complet. In cazul
trecerii ctre directorul printe se folosete expresia "..".
Exemplu: Daca fiierul curent este "index.html", pentru a referii documentul "Carti.html" se folosete
expresia "Produse/Carti.html".
Daca fiierul curent este "Carti.html", pentru a referi documentul "Muzica.html" de folosete expresia
"Muzica.html"
Daca fiierul curent este "Carti.html", pentru a referi documentul "index.html" de folosete expresia
"../index.html"
Daca fiierul curent este "Carti.html", pentru a referi documentul "Preturi.html" de folosete expresia
"../Informatii/Preturi.html"
Iat schema site-ului.
-----------| Radacina |
-------------|
---------------------------------------|
|
|
-------------------------------| index.html | | Produse |
| Informatii |
-------------------------------|
|
-----------------------|
|
| Preturi.html |
---------------------------------| Carti.html | | Muzica.html |
-----------------------

Folosirea URL-urilor relative este foarte convenabil deoarece, atunci cnd site-ul este publicat, locaia
sa pe server poate fi schimbat de ctre administratorul calculatorului, aceasta modificare afectnd doar calea
ctre rdcina site-ului, si nicidecum relaiile i legturile din interiorul site-ului. Exista posibilitatea de a fixa un

Cap. 7 - 1 -

URL de baza relativ la care sa se calculeze toate URL-urile relative intr-un document. Acest lucru este posibil prin
folosirea n seciunea de antet a documentului a controlului de marcaj <Base>, al crui atribut href fixeaz baza
de formare a documentului. De exemplu, daca n documentul "Carti.html" se fixeaz
<Base href = "http://www.CalculatorulMeu.com/Radacina/index.html">
nseamn ca toate URL-urile relative se calculeaz fa de documentul "index.html", o referin ctre documentul
"Preturi.html" avnd forma:
<A href = "Informatii/Preturi.html">Preturile</A> sunt urmtoarele...

3. napoi la referine
n interiorul documentului, textul elementului referin (interna sau externa) este scris de obicei cu
culoare albastra i subliniat. Pentru a alege culoarea de prezentare a referinelor intr-o pagina se folosesc
urmtoarele atribute ale elementului Body:
link - pentru culoare textului referinelor nevizitate
vlink - pentru culoarea textului referinelor care au fost deja vizitate
alink - pentru culoarea textului referinei in momentul in care aceasta care este activata.
n momentul in care activm o referin ctre un document HTML, acesta va fi afiat n fereastra
programului de explorare Web, n locul documentului iniial.
Daca vrem sa controlam fereastra in care va fi afiat noul document putem sa folosim atributul target a
elementului ancora. Valorile posibile ale acestui atribut sunt:
_self - pentru a afia documentul destinaie in fereastra documentului sursa (valoare implicita)
_blank - pentru a afia documentul destinaie intr-o noua fereastra deschisa de programul de explorare
_parent - folosita la cadre de ferestre
_top - folosita, de asemenea, la cadre de ferestre.
Exemplu 1: Exemplu de document cu setri de culoare si ferestre "inta" pentru legturi
<html>
<head>
<title>Setarea optiunilor pt. culorile si fereastra de afisare a legaturilor</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body alink="#FF00FF" link="#008000" vlink="#808000">
<h1>Bun venit in magazinul nostru virtual!</h1>
<p>La preturi care ucid orice urma de concurenta, noi va oferim cele mai tari, cele mai adevarate si cele mai
cautate produse din lumea <a href = "Produse/Carti2.html" target="_blank">cartilor</a> si a <a href =
"Produse/Muzica2.html" target="_blank">muzicii</a>. Pentru a vedea o oferta completa si uimitoare a ceea ce se
poate
achizitiona de la noi selectati una din urmatoarele optiuni:
<p><div align = "center">
<a href ="Produse/Carti2.html" target="_blank">Carti</a>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href = "Produse/Muzica2.html"
target="_blank">Muzica</a>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a title = "Preturile produselor"
href="Informatii/Preturi2.html" target = "_blank">Informatii</a>
</div>
<p>Pentru eventualele sugestii asteptam mesajele voastre la <a href = "mailto:cristianfb@xnet.ro">
posta vesela </a>.<br>
Va oferim spre delectare un fragment din <a href="../../Sunet/Spacemusic.au">muzica stelelor.</a>
</body>
</html>

4. Referine interne
Activarea unei referine ctre un document face ca acel document sa fie afiat n fereastra programului
de explorare. Dar dac apare situaia n care din documentul referit ne intereseaz un anumit element i vrem ca
acesta s fie afiat ncepnd cu prima linie a ferestrei? n acest caz trebuie sa definim n acel document o ancora
destinaie numit "inta".

Cap. 7 - 2 -

O inta se marcheaz cu ajutorul elementului ancora (A) cruia i se atribuie un nume de identificare cu
ajutorul atributului Name sau Id.

Exemplu:

<A name = "intro"><H2>Introducere</H2></A>

Pentru a crea n acelai document o referina ctre inta definit mai sus nu rmne dect sa scriem
corect atributul de referin hipertext.

Exemplu:

<A href = "#intro">Partea 1.Introducere </A>

Daca referina este creat n alt document ea trebuie sa conin URL-ul documentului care conine inta
i numele de identificare a intei.

Ex. <A href="www.Calculator.com/Documente/Document1.html#intro">Partea1.Introducere

</A>
Este foarte important ca numele de identificare a unei intei s fie unic n cadrul unui document. n caz
contrar destinaia referinei nu mai este valida.
Exemplu 2: Folosirea referinelor ctre inte interne
<html>
<head>
<title>Muzica</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
</head>
<body>
<p align = "center"><a href = "../index.html">Pagina
de
inceput</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbs
p;
<a href = "../Informatii/Preturi.html#PretMuzica"
>Informatii</a></p>
<h1>Bun venit in lumea muzicii!</h1>
Alegeti din lista interpretul sau formatia favorita si...
spor la cumparaturi!
<ul>
<li><a href = "#Cooper">Alice Cooper</a></li>
<li><a href = "#Beatles">The Beatles</a></li>
<li><a href = "#Clapton">Eric Clapton</a></li>
<li><a href = "#Cohen">Leonard Cohen</a></li>
<li><a href = "#Doors">The Doors</a></li>
<li><a href = "#Dylan">Bob Dylan</a></li>
</ul>
<hr>
<h2><a name = "Cooper">Alice Cooper</a></h2>
<ul>
<li>Easy Action (1970)</li>
<li>Killer (1971)</li>
<li>Billion Dollar Babies (1973)</li>
<li>From the Inside (1977)</li>
</ul>
<hr>
<h2><a name = "Beatles">The Beatles</a></h2>
<ul>
<li>Please, Please Me (1963)</li>
<li>With The Beatles (1963)</li>
<li>A Hard Day's Night (1964)</li>
<li>Beatles for Sale (1964)</li>
<li>Help (1965)</li>
<li>Rubber Soul (1966)</li>
<li>The Beatles (1968)</li>
<li>Let It Be (1970)</li>
</ul>

<hr>
<h2><a name = "Clapton">Eric Clapton</a></h2>
<ul>
<li>Eric Clapton (1970)</li>
<li>History of Eric Clapton (1972)</li>
<li>461 Ocean Boulevard (1974)</li>
<li>E.C. Was Here (1975)</li>
<li>Just One Night (1970)</li>
<li>Layla (1983)</li>
</ul>
<hr>
<h2><a name = "Cohen">Leonard Cohen
</a></h2>
<ul>
<li>Songs of Leonard Cohen (1967)</li>
<li>Songs From a Room (1969)</li>
<li>Songs of Love and Hate (1971)</li>
<li>New Skin For the Old Ceremony (1974)</li>
</ul>
<hr>
<h2><a name = "Doors">The Doors</a></h2>
<ul>
<li>The Doors (1967)</li>
<li>Strange Days (1967)</li>
<li>Waitting For the Sun (1968)</li>
<li>Soft Parade (1969)</li>
<li>Morrison Hotel (1970)</li>
</ul>
<hr>
<h2><a name="Dylan">Bob Dylan</a></h2>
<ul>
<li>Bob Dylan (1962)</li>
<li>Freewhelin' Bob Dylan (1963)</li>
<li>Times, They Are a Changin' (1964)</li>
<li>Another Side of B.D. (1964)</li>
<li>Hightway 61 Revisited (1965)</li>
</ul>
<hr>
<p align = "center"><a href = "../index.html">Pagina
de
inceput</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbs
p;
<a href = "../Informatii/Preturi.html#PretMuzica"
>Informatii</a></p>

Cap. 7 - 3 -

</body>
</html>

5. Specificare unei relaii ntre documente

Elementul LINK este folosit n antetul documentului pentru a specifica o relaie ntre documentul curent i
alte documente sau programe din Web. Elementul LINK nu are coninut i nu va fi afiat n interiorul
documentului, dar el este folosit de ctre programele de navigare Web n diverse scopuri, depinznd de valoarea
atributul rel, valoare ce definete relaia cu documentul referit. Iat cteva dintre valorile posibile ale acestui
atribut:
Alternate definete o alternativa la documentul curent si este folosit de obicei mpreun cu atributul hreflang
pentru a specifica limba n care este scris documentul. Exemplu:
<HEAD>
<TITLE>The manual in English</TITLE>
<LINK title="Manualul in limba engleza"
type="text/html"
rel="alternate"
hreflang="fr"
href="http://Calculator.com/manual/franceza.html">
Stylesheet definete o legtura cu un document de tip "foaie de stil"
Start definete primul document dintr-o colecie de documente
Next si Previous definesc care sunt urmtorul i respectiv, precedentul document ntr-o ordonare liniara a
colectiei de documente
Contents, Index, si Glosary definesc documente de tipul "Cuprins" , "Index" si "Glosar".
Exemplu:
<HEAD>
<TITLE>Capitolul 4</TITLE>
<LINK rel="Contents" href="../toc.html">
<LINK rel="Index" href="../index.html">
<LINK rel="Next" href="Capitolul5.html">
<LINK rel="Prev" href="Capitolul3.html">
</HEAD>
Modul n care informaia oferit de elementul Link este folosit, depinde foarte mult de programul de
navigare i motoarele de cutare n Web.

Cap. 7 - 4 -