9. 2. 3. Realizarea legaturilor (link-uri)

Gazduire site-uri web nelimitata ca spatiu si trafic lunar la doar 15 eur / an. Inregistrare domenii .ro .com .net .org .info .biz .com.ro .org.ro la preturi preferentiale. Pentru oferta detaliata accesati site-ul BluePink

Crearea legaturilor în cadrul aceleiasi pagini

Acest tip de legatura se foloseste pentru a permite saltul la începutul paginii, la sfârsit sau la un anumit titlu din pagina. Ea are drept “tinta” (target) un marcaj numit semn de carte (bookmark) sau ancora (anchor), care trebuie creat în prealabil. Se procedeaza astfel:

• Plasam cursorul la începutul liniei unde trebuie creata ancora, sau selectam un text.

• Selectam butonul Anchor

sau apelam meniul Insert – Named Anchor, aparând caseta de dialog Named Anchor Properties.

• Introducem numele ancorei (unic pentru fiecare ancora), din maxim 30 de caractere (daca folosim spatii, acestea vor fi convertite în underscore ( _ ). Daca am selectat un text la pasul 1, acesta este numele ancorei.

Pentru crearea legaturii folosita de utilizatori pentru a deschide pagina la pozitia ancorei:

• Apasam butonul Link sau apelam meniul Insert – Link, aparând caseta de dialog Link Properties.

Pentru testarea în browser a legaturii create, apasam butonul Browse

sau apelam meniul File – Browse Page, apoi selectam link-ul respectiv.

Crearea legaturilor catre alte pagini

Se pot crea legaturi catre pagini stocate local pe calculator sau în retea, sau catre pagini din Internet, astfel:

• Plasam cursorul în locul unde trebuie creata legatura, sau selectam textul sau imaginea din care va fi creata legatura.

• Completam textul (link text) care va fi afisat de legatura (daca am selectat un text la pasul 1, acesta apare deja completat).

• Introducem URL-ul paginii web, o adresa de e-mail sau calea catre fisierul local (apasam Choose File pentru a cauta acest fisier) care se vor deschide la accesarea link-ului, sau o ancora creata anterior, din lista derulanta (apasam butonul

Pentru testarea în browser a legaturii create, apasam butonul Browse

sau apelam meniul File – Browse Page, apoi selectam link-ul respectiv.

@ Putem copia rapid un link tragându-l din alta fereastra (de exemplu dintr-o pagina web) direct în fereastra Nvu. Alternativ, putem face clic dreapta pe un link dintr-o pagina web, alegem Copy Link Location, apoi “lipim” (paste) informatia obtinuta în câmpul Link Location din caseta de dialog Link Properties.

N Î nainte de crearea legaturilor catre alte pagini se recomanda salvarea paginii, astfelîincât Nvu sa completeze automat referintele pentru legaturile create.

Crearea unei legaturi pe o imagine

• Selectam imaginea si apasam butonul Link

din bara Standard, sau apelam meniul Insert – Link, aparând caseta Image properties, deschisa la tab-ul Link.

Eliminarea legaturilor

În afara stergerii definitive (selectam link-ul si tastam DEL ETE), putem anula rolul de hyperlink pentru textul sau imaginea respectiva, astfel:

• Pentru eliminarea totala a rolului de hyperlink: selectam textul sau imaginea respectiva, apoi apelam meniul Format – Remove Links.

• Pentru eliminarea partiala a rolului de hyperlink (astfel încât o anumita portiune din textul acesteia sa nu mai fie inclusa în link): plasam cursorul în locul unde dorim sa se termine link-ul, apoi apelam meniul Format – Discontinue Link.

Maparea unei imagini

O harta de imagini (image map) este o imagine ce contine zone predefinite numite puncte fierbinti (hot spots) cu rol de hyperlink. De exemplu, facând clic pe un hotel din harta unei statiuni, se deschide o pagina web cu informatii despre aceasta. Pentru crearea unei harti de imagini, procedam astfel:

1. Încarcam imaginea dorita într-un editor grafic (ex. Paint) si miscând mouse-ul deasupra imaginii, notam coordonatele punctelor care încadreaza hot-spot-ul. Ele vor fi de forma (x, y), unde x reprezinta coloana, iar y linia, sistemul de coordonate fiind relativ la coltul stânga-sus al imaginii. De exemplu, pentru hot spot-ul din imaginea alaturata, de forma dreptunghiulara, coordonatele colturilor stânga-sus si dreapta-jos ale dreptunghiului sunt (97, 97) si (129, 144).

2. Inseram imaginea în pagina, apoi activam tab-ul HTML Source din bara Mod de vizualizare. Pentru o imagine cu dimensiunile 254X306 pixeli, tag-ul HTML folosit este <IMG>, ca în exemplul de mai jos:

Atributele WIDTH, HEIGHT si SRC precizeaza latimea, înaltimea imaginii, respectiv calea sau URL-ul fisierului imagine (pentru simplitate, am presupus ca fisierul imagine venus.jpg este salvat în acelasi director cu pagina).

• Forma hot spot este una din urmatoarele: RECT (dreptunghi), CIRCLE (cerc) si POLY (poligon).

• Coordonate este o lista de numere ce defineste dimensiunile hot spot-ului. În functie de forma acestuia, lista contine:

• pentru RECT, perechile de coordonate ale colturilor stânga-sus si dreapta jos ale dreptunghiului.

4. Pentru a înstiinta browserul despre harta de imagini, adaugam atributul USEMAP (cu sintaxa USEMAP=”#NumeHarta”) în tag-ul <IMG>. În final, codul sursa HTML (numai pentru harta de imagini) va fi asemanator cu urmatorul:

unde fisierul hotel_vulturul.html , deschis la clic pe hot spot, este salvat în acelasi director cu pagina .

Pentru testarea hartii de imagini în browser, apasam butonul Browse

sau apelam meniul File – Browse Page.

@ Daca harta de imagini are mai multe hot spot-uri, tag-ul <AREA> se repeta în interiorul tag-ului <MAP> pentru fiecare din acestea.