Toate sunt conectate atunci cand vorbesti de internet, iar viteza cu care este transmisa informatia si cantitatea acesteia creste pe zi ce trece tocmai ca urmare a conectivitatii. Nu ne mai mira de ce internetului i se mai spune si web (panza).
Am facut textele in html. Urmeaza acum sa le link-uim.
Un tag <a> defineste un hyperlink (sau pur si simplu link). Un link este un cuvant, un grup de cuvinte sau o imagine pe care poti da click pentru a ajunge la un alt document sau la o parte anume a aceluiasi document.
Cel mai important atribut al elementului <a></a> este href, cel care face totul posibil. Prin urmare, daca vrei sa realizezi un link scrii in felul urmator:
<p><a href="http://avenir.ro/formatarea-textului-elementele-de-text-importante/">Link catre lectia 3</a> a tutorialului HTML.</p>Codul va fi afisat in felul urmator:
Link catre lectia 3 a tutorialului HTML.
In principiu, orice element poate fi folosit pentru a link-ui. Asadar, de ce nu am folosi imaginile:
<a href="pagina.html"><img src="imagineamea.jpg" /></a>Mailto: sau cum ceri unui vizitator sa iti scrie…
Linkurile pot invita vizitatorii chiar si sa iti scrie. Presupunand ca vizitatorul site-ului tau are un client de mail prin care sa iti poata trimite un mesaj, poti sa il inviti sa iti scrie folosind urmatorul cod:
<a href="mailto:adresamea@avenir.ro?Subject=Salutare">Scrie-mi</a>Astfel, ca valoare a “mailto:” ai adresa ta de mail. De asemenea, poti pune un subiect al mailului. Este foarte important ca variabila “Subject”, care urmeaza dupa adresa de mail sa fie precedata de semnul de intrebare, acesta atentionand browserul ca s-a terminat adresa de mail si ca urmeaza o serie de variabile. De asemenea, daca in “Subject” aveti mai multe cuvinte, le puteti desparti prin echivalentul hexa al spatiului gol “%20” Alte variabile care ar mai putea fi mentionate intr-un link de tip mailto sunt:
<a href="mailto:adresamea@avenir.ro?cc=altaadresa@altsite.ro,alta@altul.com&bcc=ultima@ultimul.ro&subject=Mailul%20meu&body=body-ul%20mailului">Scrie-mi</a>Alte tipuri de link-uri: tel, geo
Ei bine, intram in era conectivitatii. Si pentru asta avem nevoie de elemente noi in limbajul HTML. De aceea, link-urile pot accepta ca valoare si numere de telefon, dar si coordonate geografice. Astfel, atunci cand cineva va da click pe acele linkuri, fie va putea sa sune numarul respectiv, fie linkul ii va deschide un software GPS prin intermediul caruia va putea fi indrumat spre destinatia din link:
<p><a href="tel:0742144112">Telefon: 0742144112</a><br />
<a href="geo:44.4325,26.103889">Vizitati Bucurestiul</a></p>Target sau tinta catre care trimite un link
Atributul “target” specifica locul in care vrei sa deschizi un documentul.
Astfel, in momentul in care realizezi un link catre o alta pagina internet (document), poti sa deschizi pagina respectiva in aceeasi fereastra a browser-ului sau in alta fereastra:
Target-ul poate fi: _self, atunci cand vrei ca linkul sa deschida documentul in aceeasi fereastra;
_blank, in momentul in care vrei ca acesta sa se deschida in acelasi frame in care s-a aflat si linkul; _parent deschide documentul in frame-ul parinte; _top, deschide documentul linkuit in fereastra in care se afla linkul.
Atentie: Frame-ul nu este o fereastra, ci este o parte dintr-o fereastra, definita ca atare. De ceva vreme nu mai folosesc frame-uri. De aceea, din perspectiva proprie va recomand sa tineti minte doar atributul target care are ca valori _blank sau _self.
Linkuirea catre o parte din pagina
La fel ca la carti, exista momente cand titlurile sunt afisate chiar in mijlocul paginii, nelasandu-se pagina goala pentru a pune titlul pe o pagina noua.
Asadar, daca in interiorul aceluiasi document vei avea un heading catre care stii ca vei face un link, va trebui ca acest heading sa il incluzi intr-un tag care are un atribut “id”.
<a id="subtitlufrumos"><h4>Subtitlu frumos</h4></a>Atentie (1): Este foarte important ca acest “bookmark” (semn de carte) din interiorul paginii html sa cuprinda elementul. Am observat ca, din ratiuni legate de design semnul de carte nu cuprinde niciun element (<a id=”subtitlufrumos”></a><h4>Subtitlu frumos</h4>). Din pacate, aceasta practica pe langa faptul ca nu este logica, nu este nici interpretata cum trebuie de Internet Explorer, browser-ul neluand in considerare acest element in acest caz.
Atentie (2): Pana la aparitia HTML5, putea fi folosit atributul “name”, dar acesta a fost scos intr-un final din specificatie.
Linkuirea catre un element din interiorul unei pagini se va face astfel:
<a href="http://www.avenir.ro/pagina.html#subtitlufrumos">Link</a>In cazul in care elementul se regaseste in interiorul aceleiasi pagini, linkul se poate face si simplificat:
<a href="#subtitlufrumos">Link in interiorul paginii</a>Cand o persoana va da click pe link, pagina va avansa automat pana la elementul din pagina la care se refera linkul.
Titlul linkului
Este important ca atunci cand link-uim documente sa ne gandim si la persoanele care nu pot vedea exact tot ce se intampla in pagina.
Desi multa lume nu da atentie atributului title (atentie, nu vorbesc aici despre elementul <title></title>), acesta este foarte important, deoarece spune mult mai multe despre linkul respectiv.
Informatia pe care o transmiti in atributul title, poate fi rostita (la propriu) de un browser pentru persoanele care nu pot vedea, dar in acelasi timp ajuta si motoarele de cautare sa inteleaga despre ce este vorba in acel link.
Astfel, daca avem o secventa de text de genul…
<p>Ia te uita ce am aici - <a href="http://avenir.ro/category/html/">link</a></p>…ce vrem sa transmitem? Ca in pagina exista un link catre un “http://avenir.ro/category/html/”? Nu. Am dori sa transmitem ca daca da click pe acel link va gasi lucruri incredibile!
Asadar, ii scriem:
<p>Ia te uita ce am aici - <a href="http://avenir.ro/category/html/" title="Un link catre o pagina in care afli multe lucruri despre HTML">link</a></p>Iar cand cineva va sta cu mouse-ul pe acel link, va afla prin intermediul unui tooltip despre ce este vorba in acel link:
Ia te uita ce am aici – link
Sperand ca nu am ratat nicio informatie importanta despre linkuri, va invit sa imi scrieti si pregatesc urmatoarea lectie.
