U3 PDF

UNITATEA DE ÎNVĂȚARE NR.
3
Crearea legăturilor
Cuprins:
3.1 CREAREA LEGĂTURILOR ÎNTRE PAGINI WEB .............................. 37

3.2 ALEGEREA CULORILOR PENTRU LEGĂTURI ................................ 41
3.3 APLICAȚII .................................................................................................. 42
Obiective
Însuşirea noţiunilor generale despre inserarea imaginilor în pagini web.
Înțelegerea modalităților de amplasare și aliniere a imaginilor într-o
pagină web.
Utilizarea diferitelor formate de imagini și redimensionarea acestora.
Timp alocat:1 oră
3.1 Crearea legăturilor între pagini web
Legăturile (link-urile) reprezintă partea cea mai importanta a unei pagini

Web. Ele transformă un text obişnuit în hypertext sau hyperlegătură, care premite
trecerea rapidă de la o informaţie aflată pe un anumit server la altă informaţie
memorată pe un alt server aflat oriunde în lume.
Legăturile sunt zone active într-o pagină Web, adică zone de pe ecran
sensibile la apăsarea butonului stâng al mouse-ului.
Pentru a realiza o legătură hypertext se utilizează tag-ul ancoră: <A> …
</A>, care include şi atribute. Unul dintre aceste atribute este: HREF (Hypertext
REFerence), utilizat pentru a specifica URL-ul documentului ţintă. Sintaxa este:
<A HREF= “localizarea documentului”> text de legătură </A>
unde:
 HREF este un atribut având ca valoare “localizarea documentului”.
<A HREF= “localizarea documentului”> este tagul de început, </A> este tagul de
sfârşit, textul dintre taguri (,,text de legătură”) este textul pe care se apasă click,
afişat diferit.
Legăturile se pot realiza:
- intern, în acelaşi document;
- local, către un document situat pe acelaşi server;
- extern, către un document aflat pe alt server.
37
a) Legătura locală. Are următoarea sintaxă:
<A HREF=”fişier_local”> text de legătură </A>
unde
 “FIŞIER_LOCAL” reprezintă adresa fişierului local către care se
face legătura, acesta fiind încărcat. Fişierul local se precizează folosind:
- calea relativă, serverul va căuta documentul începând din acelaşi director
ca şi documentul de la care a fost apelată legătura;
- calea absolută, când documentul va fi identificat începând cu directorul
rădăcină.
b) Legătura internă se realizează între elemente ale aceluiaşi document sau către
un anumit punct ţintă al altui document. Aceasta implică:
b1) crearea unei ancore în punctul ţintă:
<A NAME=”cuvânt_cheie”> Paragraf ţintă </A>
Ancorele din punctul ţintă nu sunt afişate diferit faţă de restul

documentului.
b2) realizarea unei legături prin care se specifică numele fişierului (dacă
legătura se face într-un punct al altui fişier) şi paragraful:
<A HREF=”[nume fişier]#cuvânt_cheie”> text de legătură </A>
Se utilizează acest tip de legătură în cadrul unui document organizat pe

secţiuni. La începutul documentului poate fi prezentat conţinutul.
c) Legătura externă. Are următoarea sintaxă:
<A HREF= “http://www.yahoo.com”> text de legătură </A>
unde “http://www.yahoo.com” este URL-ul documentului.

Ţinta unei legături hypertext poate fi un fişier HTML, o imagine externă
(GIF, JPEG sau PostScript), un film sau text (căruia i s-a marcat o ancoră).
Este posibilă definirea unor legături către celelalte servicii Internet: FTP,
TELNET, NEWS, MAILTO, JavaScript. Spre exemplu, o legătură de forma:
mailto: adresă e-mail
va apela un program de scriere şi expediere a scrisorilor electronice, către

destinatarul a cărui adresă a fost specificată.
38
Pentru ca exemplul următor să funcţioneze trebuie ca:
 pe calculator să fie instalată o aplicaţie de expediere a mesajelor
electronice (Outlook Express pe calc. Windows , Pine pe calc. Unix);
 adresa să fie validă şi calculatorul să fie conectat la Internet.
<html>
<head>
<title> Expediere de mesaje electronice</title>
</head>
<body>
<h3>Expediere de mesaje electronice</h3> 
<a href="mailto:luminitaserbanescu@yahoo.com">
Mesaje catre autorul paginii
</body>
</html>
Figura 5.1 - Trimitere de mesaje electronice
Imaginile introduse într-o pagină de web pot avea doar un rol decorativ, de
îmbunătăţire a aspectului site-ului, sau pot conţine trimiteri către alte pagini sau
servicii web. Dacă se doreşte ca un link să conţină şi o imagine grafică, acest lucru
poate fi realizat prin includerea unei comenzi <IMG> între tag-ul de început şi cel
de sfârşit al comenzii <A>.
39
<A HREF = “pagina.html”> <IMG SRC = “fotografie.gif”> </A>
<html>
<HEAD>
<TITLE> Exemplu imagini cu link-uri </TITLE>
</HEAD>
<BODY>
Apasati pe imaginea de mai jos pentru a deschide o noua pagina:
<a href = "ex12.htm"> <img src ="img1.jpg"> </a>
</BODY>
</html>
Figura 5.2 - Imagini folosite ca legături
O pagină Web poate conţine legături către orice tip de fişiere aflate pe
orice servere din Internet. Pentru aceasta se utilizează eticheta <a> având valoarea
atributului href egală cu adresa URL a fişierului destinatie.
Atunci cand se efectueaza clic pe legătură. se deschide o casetă de dialog -
File download - care permite:
 să salvaţi pe discul local fişierul
 să lansaţi în execuţie aplicaţia capabilă să interpreteze corect fişierele
de tipul respectiv.
40
3.2 Alegerea culorilor pentru legături
In mod prestabilit se utilizează trei culori pentru legături:

 culoare pentru legăturile nevizitate (nu s-a efectuat nici un click pe
ele)
 culoare pentru legăturile vizitate (s-a efectuat cel puţin un click pe ele)
 culoare pentru legăturile active (deasupra cărora se află mouse-ul la un
moment dat).
Aceste atribute pot fi stabilite cu ajutorul a trei atribute ale etichetei
<BODY>:
 LINK pentru legăturile nevizitate;
 VLINK pentru legăturile vizitate;
 ALINK pentru legăturile active.
<html>
<head>
<title>Untitled Document</title>
</head>
<body>
<body link="blue" vlink="green" alink="red">
<h3>Setarea culorilor pentru link-uri: rosu pentru legaturi active, verde
pentru legaturi vizitate si albastru pentru legaturi nevizitate </h3>
<a href="leg_ex1.html">
Link catre pagina 1 
Link catre pagina 2 
Link catre pagina 3 </a>
</body>
</html>
41
Figura 5.1.1 Setarea culorilor pentru legături
3.3 Aplicații
1. Acest exemplu este format din patru fişiere cu legături între ele.
a. Sem5_1.html
<html>
<head>
<title> Legaturi </title>
</head>
<body BGCOLOR=YELLOW LINK="BLUE" VLINK="GREEN"
ALINK="RED">
<H2 ALIGN=CENTER>SEMINAR TEORETIC </H2>
<CENTER>
PAGINA1
<A HREF=SEM5_2.HTML> PAGINA2
<A HREF=SEM5_3.HTML> PAGINA 3
</A>
</CENTER>
 
 FONT DE DIMENSIUNE 4 SI
42
CULOARE ALBASTRU 
<A HREF=SEM5_4.HTML>
<img src="img1.jpg" align =RIGHT hspace=30 vspace=50 alt="Peisaj">
</A>
</BODY>
</HTML>
b. Sem5_2.html
<html>
<head>
</head>
<body BGCOLOR=PINK LINK="BLUE" VLINK="GREEN"
ALINK="RED">
<H1>SEMINAR TEORETIC </H1>
<CENTER>
<A HREF=SEM5_1.HTML> PAGINA1 </A>
PAGINA2
<A HREF=SEM5_3.HTML> PAGINA 3</A>
</CENTER>
 
 EXEMPLU 
</BODY>
</HTML>
43
c. Sem5_3.html
<html>
<head>
</head>
<body LINK="BLUE" VLINK="GREEN" ALINK="RED">
<CENTER><A HREF=SEM5_1.HTML> PAGINA1 </A>
<A HREF=SEM5_2.HTML> PAGINA 2</A>
PAGINA3</CENTER>
 TEXT 
</BODY>
</HTML>
44
d. Sem5_4.html
<html>
<head>
<title> Legaturi DIN IMAGINE </title>
</head>
<body BGCOLOR=”LIGHTYELLOW” LINK="BLUE" VLINK="GREEN"
ALINK="RED">
 PEISAJ 
 
<A HREF=SEM5_1.HTML> REVENIRE LA PAGINA1 </A>
</BODY>
</HTML>
45
2.
<html>
<head>
<title>Legaturi</title></head>
<body bgcolor="#FFFFCC">
<img src ="img1.jpg"width="200" height="200" align="left" hspace="30"
vspace="15"> 


 Peisaj 

Aceasta pagina contine o imagine
inserata, textul fiind scris in dreapta imaginii. De asemene se poate observa
ca la pozitionatre mouse-ului pe imagine este vizibil un text.
 

 Acesta este un text scris sub imagine.
<a href = "Informatii.html">
<img src = "i.bmp" alt="apasati pentru a afla mai multe despre turism">
</a>
</body>
</html>
46

U3 PDF

Încărcat de

Informații document

Titlu original

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

U3 PDF

Încărcat de

Drepturi de autor:

Formate disponibile

UNITATEA DE ÎNVĂȚARE NR.

3.1 CREAREA LEGĂTURILOR ÎNTRE PAGINI WEB .............................. 37

Timp alocat:1 oră

3.1 Crearea legăturilor între pagini web

Legăturile (link-urile) reprezintă partea cea mai importanta a unei pagini

<A HREF= “localizarea documentului”> text de legătură </A>

<A HREF=”fişier_local”> text de legătură </A>

b1) crearea unei ancore în punctul ţintă:

<A NAME=”cuvânt_cheie”> Paragraf ţintă </A>

Ancorele din punctul ţintă nu sunt afişate diferit faţă de restul

<A HREF=”[nume fişier]#cuvânt_cheie”> text de legătură </A>

Se utilizează acest tip de legătură în cadrul unui document organizat pe

c) Legătura externă. Are următoarea sintaxă:

<A HREF= “http://www.yahoo.com”> text de legătură </A>

unde “http://www.yahoo.com” este URL-ul documentului.

mailto: adresă e-mail

va apela un program de scriere şi expediere a scrisorilor electronice, către

Figura 5.1 - Trimitere de mesaje electronice

Figura 5.2 - Imagini folosite ca legături

In mod prestabilit se utilizează trei culori pentru legături:

S-ar putea să vă placă și