Atesta

t
Japonia-Tara Soarelui Sus Rasare

Capraru Adriana Raluca 12C

HTML- Hypertext Markup Language

-notiuni introductive si tutorial

Ce este HTML ?

Unul din primele elemente fundamentale ale WWW ( World Wide Web )
este HTML ( Hypertext Markup Language ), care descrie formatul primar in
care documentele sunt distribuite si vzute pe Web. Multe din trasaturile lui,
cum ar fi independenta fata de platforma, structurarea formatrii si legaturile
hypertext, fac din el un foarte bun format pentru documentele Internet si
Web.
Primele specificaiile de baza ale Web-ului au fost HTML, HTTP si URL.
HTML a fost dezvoltat initial de Tim Berners-Lee la CERN in 1989. HTML a fost
vazut ca o posibilitate pentru fizicienii care utilizeaza computere diferite si
schimbe ntre ei informaie utilizind Internetul. Erau prin urmare necesare
citeva trasaturi: independenta de platforma, posibiliti hypertext si
structurarea documentelor.Independenta de platforma nseamn ca un
document poate fi afiat in mod asemntor de computere diferite ( deci cu
fonte, grafica si culori diferite ), lucru vital pentru o audienta att de variata.
Hipertext nseamn ca orice cuvnt, fraza, imagine sau alt element al
documentului vzut de un utilizator ( client ) poate face referina la un alt
document, ceea ce uureaz mult navigarea intre multiple documente sau
chiar in interiorul unui aceluiasi document. Structurarea riguroasa a
documentelor permite convertirea acestora dintr-un format in altul precum si
interogarea unor baze de date formate din aceste documente.
Standardul oficial HTML este World Wide Web Consortium (W3C), care este
afiliat la Internet Engineering Task Force (IETF). W3C a enunat cteva
versiuni ale specificaiei HTML, printre care si HTML 2.0, HTML 3.0,HTML 3.2,
HTML 4.0 si, cel mai recent, HTML 4.01. In acelai timp, autorii de browsere,
cum ar fi Netscape si Microsoft, au dezvoltat adesea propriile "extensii" HTML
in afara procesului standard si le-au incorporat in browserele lor. In unele
cazuri, cum ar fi tagul Netscape , aceste extensii au devenit standarde de
facto adoptate de autorii de browsere.
HTML 2.0, elaborat in Iunie 1994, este standardul pe care ar trebui sa-l
suporte toate browserele curente -- inclusiv cele mod text. HTML 2.0 reflecta
concepia originala a HTML ca un limbaj de marcare independent de
obiectele existente pentru aezarea lor in pagina, in loc de a specifica exact
cum ar trebui sa arate acestea. Dac dorii sa fii siguri ca toi vizitatorii vor
vedea paginile aa cum trebuie, folosii tagurile HTML 2.0.

Specificaia HTML 3.0, Enunata in 1995, a ncercat sa dezvolte HTML 2.0 prin
adugarea unor faciliti precum tabelele si un mai mare control asupra
textului din jurul imaginilor. Dei unele din noutile HTML 3.0 erau deja
folosite de autorii de browsere, multe nu erau nc. In unele cazuri, taguri
asemntoare implementate de autorii de browsere au devenit mai
rspndite dect tagurile "oficiale". Specificaia HTML 3.0 acum a expirat,
deci nu mai este un standard oficial.
In Mai 1996, W3C a scos pe piaa specificaia HTML 3.2, care era proiectata
sa reflecte si sa standardizeze practicile acceptate la scara larga. Deci, HTML
3.2 include tagurile HTML 3.0 ce erau adoptate de autorii de browsere ca
Netscape si Microsoft plus extensii HTML rspndite. In Bilanul asupra HTML,
W3C recomanda ca providerii de informaii sa utilizeze specificaia HTML
3.2.Versiunile curente ale majoritii browserelor ar trebui sa suporte toate,
sau aproape toate aceste taguri.
De asemenea exista extensii Netscape si Microsoft care nu fac parte din
specificaia HTML 3.2, ori pentru ca sunt mai puin utilizate, ori au fost
omologate dup apariia HTML 3.2. Pentru ca navigatorul Netscape a fost
printre primele browsere care suporta anumite taguri HTML 3.0, iar Netscape
deine in jur de 70% din piaa de browsere, muli au crezut eronat ca toate
extensiile Netscape (incluznd taguri ca si facilitai ca ferestrele) fac parte
din HTML 3.0 sau HTML 3.2.
La momentul aparitiei acestui tutorial, HTML 4.0 este larg utilizat si au fost
deja publicate specificatiile HTML 4.01.
Documentele HTML sint documente in format ASCII si prin urmare pot fi
create cu orice editor de texte. Au fost insa dezvoltate editoare specializate
care permit editarea intr-un fel de WYSIWYG desi nu se poate vorbi de
WYSIWYG atita vreme cit navigatoarele afieaz acelasi document oarecum
diferit, in functie de platforma pe care ruleaza. Au fost de asemenea
dezvoltate convertoare care permit formatarea HTML a documentelor
generate ( si formatate ) cu alte editoare. Evident conversiile nu pot patra
decit partial formatarile anterioare deoarece limbajul HTML este inca
incomplet.

Structura documentului HTML.

Orice document HTML ncepe cu notaia <html> si se termina cu

notaia </html>. Aceste "chestii" se numesc in literatura de specialitate
"TAG-uri".Prin convenie, toate informaiile HTML ncep cu o paranteza
unghiulara deschisa " < " si se termina cu o paranteza unghiulara nchisa "
> ".
Tag-urile intre aceste paranteze transmit comenzi ctre browser pentru a

afia pagina intr-un anumit mod. Unele blocuri prezint delimitator de sfrit
de bloc, in timp ce pentru alte blocuri acest delimitator este opional sau
chiar interzis.
Intre cele doua marcaje <html> si </html> vom introduce doua seciuni:
- sectiunea de antet <head>...</head> si - corpul
documentului <body>...</body>. Blocul <body>...</body> cuprinde
coninutul propriu-zis al paginii HTML, adic ceea ce va fi afiat in fereastra
browser-ului.
O eticheta poate fi scris att cu litere mici, cat si cu litere
mari.Adic <html> = <HTML> = <Html>. Caracterele "spaiu" si "CR/LF"
ce apar intre etichete sunt ignorate de ctre browser.Deci un prim document
HTML ar fi ceva de genul asta:

Aa arata primul document HTML. Copiai-l folosind Copy/Paste ntr-un fiier

nou i salvai-l ca PRIM.HTM sau PRIM.HTML. Apoi pornii Internet Explorer
sau Google Crome, dai CTRL-O si introducei calea spre fiier. Dai OK si ...
nimic.
S nu disperam ... vom aduga primele elemente la pagina noastr. n primul
rnd, titlul unei pagini se obine insernd n seciunea<head>...</head> a
urmtoarei linii:
<title>Aceasta este prima mea pagina de Web</title>
n plus, n seciunea <body>...</body> putem scrie texte ct dorim. Daca
nu ntlnim nici un marcaj < sau > atunci interpretorul HTML le va lua ca
texte simple si le va afia pe ecran. Sa vedem o noua versiune a paginii
noastre:

Coninutul blocului <title>...</title> va

aprea in bara de titlu a ferestrei browserului.
Daca acest bloc lipsete ntr-o pagina HTML,
atunci n bara de titlu a ferestrei browser-ului

va aprea numele fiierului.

Daca introducem mai multe linii intr-o pagina browser-ul va afia intr-un
singur rnd, ntruct caracterele " CR/LF " sunt ignorate de browser. Trecerea
pe o linie noua se face la o comanda explicita, care trebuie sa apar n
pagina html.
Aceasta comand este marcajul <br> ( de la " line break " ntrerupere de linie ).
Folosind aceleai operaii ca mai sus, vizualizai noua pagina! Vei vedea
textul ce apare n fereastra navigatorului. n plus, pagina dvs. va avea un
titlu nou, cel introdus de dvs.

Blocuri preformatate
Pentru ca browser-ul s interpreteze corect caracterele " spaiu ", " tab " si "
CR/LF " ce apar n cadrul unui text, acest text trebuie inclus intr-un
bloc <pre>...</pre>.

Culoarea de fond
O culoare poate fi precizata n dou moduri:

Printr-un nume de culoare. Sunt disponibile cel puin 16 nume de

culori: aqua, black, fuchsia, gray, green lime, maroon, navy, olive,
purple, red, silver, teal, white si yellow.

Prin construcia " #rrggbb " unde r (red), g (green), sau b (blue) sunt
cifre hexazecimale si pot lua valorile: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, a, A, b,
B, c, C, d, D, e, E, f, F; se pot defini astfel 65536 de culori.

Culoarea unei pagini se precizeaz prin intermediul unui atribut al

etichetei <body>.
Culoarea fondului paginii Web se stabilete cu atributul bgcolor al
etichetei <body>, de exemplu: <body bgcolor = culoare>.
Urmtorul exemplu realizeaz o pagin cu fondul de culoare gri.

Culoarea textului
Acest lucru se face prin intermediul atributului text al
etichetei <body> dup sintaxa <body text=culoare>. n urmtorul exemplu
textul are culoarea roie.

O eticheta poate avea mai multe atribute. De exemplu , o eticheta cu trei

atribute arata astfel: <eticheta atribut1 = valoare1 atribut2 = valoare2
atribut3 = valoare3>. Urmtorul exemplu prezint o pagina cu fondul de
culoare albastra si textul de culoare galben.

Textul afiat este caracterizat de urmtoarele atribute: Mrime ( size),

Culoare ( color ), Font (style).
Acestea sunt atribute ale etichetei <basefont>.Este o eticheta singulara
(fr delimitator de sfrit de bloc).
<basefont size = numar color = culoare style = font>
unde:

numar - poate fi 1, 2, 3, 4, 5, 6 sau 7; ( 1 pentru fontul cel mai mic si 7

pentru fontul cel mai mare);

culoare - este o culoare precizata prin nume sau printr-o construcie

RGB;

font - poate fi un font generic ca " serif ", " san serif ", " cursive ", "
monospace ", "fantasy " sau un font specific instalat pe calculatorului
clientului, ca " Times New Roman ", " Helvetica " sau " Arial ".Se
accepta ca valoare si o lista de fonturi separate prin virgula, de
exemplu:
" Times New Roman, serif, monospace ".

Domeniul de valabilitate al caracteristicilor precizate de aceasta eticheta se

ntinde de la locul in care apare eticheta pana la sfaritul paginii sau pana la
urmtoarea eticheta <basefont>.
Daca acest atribut lipsete atunci textul din pagina Web are atribute
prestabilite sau atribute precizate de browser-ul utilizat.
Atributele prestabilite sunt: size = 3, color = black, i style = " Times New
Roman " .
Poziionarea coninutului paginii Web fata de marginile ferestrei browser-ului
se poate face cu ajutorul a dou atribute ale etichetei<body>:

leftmargin ( stabilete distanta dintre marginea stnga a ferestrei

browser-ului si marginea stng a coninutului paginii );

topmargin ( stabilete distanta dintre marginea de sus a ferestrei

browser-ului si marginea de sus a coninutului paginii );

Stiluri pentru blocurile de text

Pentru ca un bloc de text sa apar in pagina evideniat (cu caractere aldine),
trebuie inclus intre delimitatorii <b>...</b> ( b vine de la "bold" =
ndrzne).
Pentru ca un text sa fie scris cu caractere mai mari cu o unitate dect cele
curente acesta trebuie inclus intr-un bloc delimitat de
etichetele <big>...</big>.
Pentru ca un text sa fie scris cu caractere mai mici cu o unitate dect cele
curente acesta trebuie inclus intr-un bloc delimitat de
etichetele <small>...</small>.
Pentru ca un text sa fie scris cu caractere cursive acesta trebuie inclus intrun bloc delimitat de etichetele <i>...</i> ( i vine de la " italic ").
Pentru a insera secvene de text aliniate ca indice (sub-script) sau ca
exponent (super-script) , aceste fragmente trebuie delimitate de
etichetele _..., respectiv ^....
Pentru a insera un bloc de caractere subliniate se utilizeaz
etichetele <u>...</u> (u vine de la " underline ").
Pentru a insera un bloc de caractere tiate se utilizeaz
etichetele <strike>...</strike> sau <s>...</s>.
n exemplul urmtor vom utiliza toate etichetele menionate anterior.

Stiluri fizice si logice

Am prezentat deja 8 stiluri de scriere a caracterelor unui bloc de text, numite
si stiluri fizice intrucat nu s-a acordat nici o atentie semnificatiei informatiei
continute de aceste blocuri.
In continuare sunt prezentate stilurile utilizate la formatarea unui bloc.
Aceste stiluri tin cont de semnificatia pe care o are blocul in cadrul paginii
Web.

Pentru a pune in evidenta ( prin silul cursiv ) fragmente de text se utilizeaza

etichetele:

<cite>...</cite> ( " cite " inseamna citat);

<em>...</em> (em vine de la " emphasize " = a evidentia).

n locul lor se poate utiliza eticheta echivalenta <i>...</i>.

Urmatoarele etichete au efecte similare. Ele permit scrierea fragmentului de
text cu caractere monospatiate (de tipul celor folosite de o main de scris):

<code>...</code> ( " code " inseamna cod sau surs);

<kbd>...</kbd> ( kbd vine de la " keyboard " = tastatura);

<tt>...</tt> ( tt vine de la " teletype " = teleprinter).

Eticheta de tip bloc <blink>...</blink> delimiteaz fragmente de text

clipitoare. Aceasta eticheta funcioneaz numai in browser-ul Netscape
Communicator.

Exemplul urmtor ilustreaz c etichetele pot fi imbricate.

Un fragment de text poate fi scris cu aldine i cursive in acelai timp.
Pentru un fragment de text se pot folosi simultan stilurile subliniat, exponent,
mrit si cursiv.

Blocul <q>...</q> permite inserarea in-line a citatelor. Brouwser-ul afieaz

citatele n ghilimele.
" q " vine de la " in-line quotation " (citate inserate in-line).
i blocurile " q " pot fi imbricate.
Exemplu(de sine stttor).
&-consecutiviti
Simbolurile "<" i ">" sunt percepute de sistemele browser ca nceputuri i
sfrituri de HTML-taguri. Apare ntrebarea, cum sreprezentm aceste
simboluri pe ecran?
n limbajul HTML aceasta se poate realiza cu ajutorul &- consecutivitilor
(ele se mai numesc obiecte simbolice sau escapeconsecutiviti).
Exist mai multe consecutiviti de acest tip:
"<" - &lt;
">" - &gt;
"&" (ampersand) &amp;
Ghilimelele(") se codific - &quot;
Pentru escape-consecutiviti sunt dou restricii suplimentare:
1. Fiecare consecutivitate se scrie numai cu minuscule
2. Sfritul fiecrei consecutivit!i este marcat de
n general, asemenea consecutiviti exist pentru toate simbolurile cu
codurile ASCII mai mari dect 127. Motivul este c unele servere nu susin
transmiterea datelor cte 8 bii.

Exist mai multe metode de a include semnele diacritice romne n

documentele HTML. Cea mai simpl este codificarea direct a lor prin &consecutiviti:
- &#258;
- &#259;
- &Icirc;
- &icirc;
- &#350;
- &#351;
- &#354;
- &#355;
- &Acirc;
- &acirc;
Exemplu:

Comentarii
Sistemele browser ignor reproducerea oricrui text situat ntre <!-- i -->.
Este o opiune special pentru introducerea n textul documentului HTML a
unor comentarii, ce nu for fi afiate pe ecran.
<!--Acesta e un comentariu -->
2. Formatarea caracterelor, organizarea textului.
Un font este caracterizat de urmtoarele atribute:

culoare (stabilita prin atributul color);

tipul sau stilul (stabilit prin atributul face);

mrimea (definita prin atributul size);

mrimea in puncte tipografice (stabilita prin atributul point-size);

grosime (definita prin atributul weight).

Toate aceste atribute aparin etichetei <font>, care permite inserarea de

blocuri de texte personalizate.
Culori
O culoare poate fi precizata n dou moduri:

printr-un nume de culoare.

printr-o constant conform standardului de culoare RGB (Red, Green,

Blue). O astfel de constant se formeaz astfel: #rrggbb, unde r, g si b
sunt cifre hexazecimale.

Culoarea fontului
Pentru a scrie un fragment de text cu caractere de o anumit culoare se
ncadreaz acest fragment ntre delimitatorii <font>...</font>avnd stabilit
atributul color la valoarea necesara. De exemplu:
<font color=red>fragment de text de culoare rosie</font>
Familia fontului
Pentru a scrie un text intr-o pagin pot fi folosite mai multe fonturi (stiluri de
caractere). Exist cinci familii generice de fonturi care sunt de regul
disponibile pe toate calculatoarele utilizatorilor: serif, sans serif, cursive,
monospace i fantasy.
Tipul de font necesar poate fi stabilit prin atributul face al etichetei <font>.
Pot fi introduse mai multe fonturi separate prin virgula.
<font face = " Arial, serif, monospace ">
n acest caz browser-ul va utiliza primul font pe care l cunoate.

Mrimea fontului
Pentru a stabili mrimea unui font se utilizeaz atributul size al
etichetei <font>. Valorile acestui atribut pot fi:

1, 2, 3, 4, 5, 6, 7 ( 1 pentru cel mai mic font si 7 pentru cel mai mare);

+1, +2, etc. pentru a mari dimensiunea fontului cu 1, 2, etc. fata de

valoarea curenta;

-1, -2, etc. pentru a micora dimensiunea fontului cu 1, 2, etc. fata de

valoarea curenta.

Mrimea unui font poate fi stabilita exact cu ajutorul atributului point-size.

Valorile acceptate de acest atribut pot fi orice numere naturale pozitive.
Numrul astfel precizat reprezint mrimea fontului n puncte tipografice.
Acest atribut funcioneaz numai cu Netscape Communicator.

Grosimea unui font

Grosimea unui caracter poate fi definit cu ajutorul atributului weight al

etichetei <font>.
Valorile posibile pentru acest atribut sunt 100, 200, 300, 400, 500, 600, 700,
800 si 900 (100 pentru fontul cel mai subire si 900 pentru cel mai gros).

Blocuri de text
Aceste etichete nu se refera la particularitatiile caracterelor ce compun
textul, ci la functiile pe care le poate avea un bloc de text in cadrul paginii
Web.
Toate aceste etichete produc automat trecerea la un rand nou si adaugarea
unui spatiu suplimentar.
Inserarea unei adrese
Daca intr-o pagina web trebuie inclusa o adresa ,atunci putem utiliza
facilitatile oferite de o eticheta dedicata: <address>...</address>.
Indentarea unui bloc
Pentru ca un bloc de text sa fie indentat ( marginea din stanga a textului sa
fie deplasata la dreapta la o anumita distanta fata de marginea paginii ),
acesta trebuie inclus intre etichetele <blockquote>...</blockquote>.
Blocul preformatat
Intr-un bloc <pre>...</pre>, semnificatia marcajelor HTML se pastreaza.
Blocul <pre>...</pre> este indicat pentru a insera randuri vide ( spatiu
intre randurile succesive ). Caracterul " spatiu " poate fi luat in considerare
de browser daca este inserat explicit prin &nbsp;.

ntr-un fiier HTML, caracterele "<"i ">" au o semnificaie special pentru

browser. Ele incadreaza comenzile i atributele de afiare a elementelor intro pagina. Dac dorim ca un fragment de text s conin astfel de caractere,
acest fragment trebuie incadrat de una dintre perechile de etichete:

<xmp>...</xmp> ( 80 de caractere pe rand );

<listing>...</listing> ( 120 de caractere pe rand ).

Aceste marcaje interpreteaza corect caracterele " spatiu ", " eticheta "i
"CR/LF ". Textul afiat n pagina este monospaiat.

Blocuri paragraf
Cu ajutorul etichetei paragraf <p> este posibil trecerea la o linie noua si
permite:

inserarea unui spatiu suplimentar inainte de blocul paragraf;

inserarea unui spatiu suplimentar dupa blocul paragraf, daca se

foloseste delimitatorul </p> (acesta fiind optional);

alinierea textului cu ajutorul atributului align, avand valorile posibile "

left ", " center " sau " right ".

Blocuri de titlu
Intr-un text titlurile ( headers ) de capitole pot fi introduse cu ajutorul
etichetelor <h1>. <h2>, <h3>, <h4>, <h5>, <h6>.
Toate aceste etichete se refera la un bloc de text si trebuie insotite de o
eticheta de incheiere similara.
Aceste etichete accepta atributul align pentru alinierea titlului blocului de
text la stanga (in mod prestabilit ) , in centru si la dreapta. Tagul <h1> permite scrierea unui titlu cu caractere mai mari si aldine, pe
cand <h6> foloseste caracterele cele mai mici.

Linii orizontale
Intr-o pagina Web pot fi inserate linii orizontale.acest lucru se face cu ajutorul
etichetei <hr>. Pentru a configura o linie orizontala se utilizeaza urmatorele
atribute ale etichetei <hr>:

align permite alinierea liniei orizontala. Valorile posibile sunt " left " ,"
center " si " right ";

width permite alegerea lungimii liniei;

size permite alegerea grosimii liniei;

noshade cand este prezent defineste o linie fara umbra;

color permite definirea culorii liniei.

Blocuri <center>
Blocul introdus de etichetele <center>...</center> aliniaza centrat toate
elementele pe care le contine.

Blocuri <div>
Modalitatea cea mai eficienta de delimitare si de formatare a unui bloc de
text este folosirea delimitatorilor <div>...</div>. Un parametru foarte
foarte util pentru stabilirea caracteristicilor unui bloc <div> ( diviziune )
este align ( aliniere ).
Valorile posibile ale acestui parametru sunt:

left " ( aliniere la stanga );

center " ( aliniere centrala );

right " ( aliniere la dreapta ).

Un bloc <div>...</div> poate include alte subblocuri. In acest caz ,

alinierea precizata de atributul align al blocului are efect asupra tuturor
subblocurilor incluse in blocul <div>;
Un bloc <div>...</div> admite atributul " nowrap " care interzice
intreruperea randurilor de catre browser.

Liste. Noiuni i marcaje utilizate.

Unul din cele mai obinuite elemente din documentele cu mai multe pagini
este un set de definiii, referine sau indexuri. Glosarele sunt exemple clasice
n acest sens; cuvintele sunt listate n ordine alfabetic, urmate de definiii
ale termenilor respectivi. n HTML, ntreaga seciune a unui glosar va fi
gestionat printr-o lista de definiii, care este inclusa ntr-o pereche de
marcaje de lista de definiii: <dl>...</dl> (de la "definition list" = lista de
definiii).
Observaii:
- Un termen al listei este iniiat de eticheta <dt> (de la "definition term" =
termen definit);
- Definitia unui termen este iniiata de eticheta <dd> (de la "definition
description" = descrierea definiiei);
- Definitia unui termen ncepe pe o linie noua si este indentat;

Liste neordonate
O lista neordonata este un bloc de text delimitat de etichetele
corespondente <ul>...</ul> (" ul " vine de la " unordered list " = lista
neordonata). Fiecare element al listei este iniiat de eticheta <li> (list item).
Lista va fi intentata fata de restul paginii Web si fiecare element al listei
ncepe pe un rnd noua.

Tag-urile <ul> si <li> pot avea un atribut type care stabilete caracterul
afiat n faa fiecrui element al listei. Valorile posibile al acestui atribut sunt:

"circle" (cerc)

"disc" (disc plin) (valoarea prestabilita);

"square" (ptrat)

Liste ordonate
O list ordonat de elemente este un bloc de text delimitat de etichetele
corespondente <ol>...</ol> (" ol " vine de la " ordered list " = lista
ordonat). Fiecare element al listei este iniiat de eticheta <li> (list item).
Lista va fi identat fa de restul paginii Web i fiecare element al listei
ncepe pe un rnd nou.
Tag-urile <ol> si <li> pot avea un atribut type care stabilete tipul de
caractere utilizate pentru ordonarea listei. Valorile posibile sunt:

" A " pentru ordonare de tipul A , B , C , D etc. ( litere mari );

" a " pentru ordonare de tipul a , b , c , d etc. ( litere mici );

" I " pentru ordonare de tipul I , II , III , IV etc. ( cifre romane mari );

" i " pentru ordonare de tipul i , ii , iii , iv etc. ( cifre romane mici );

" 1 " pentru ordonare de tipul 1 , 2 , 3 , 4 etc. ( cifre arabe - opiune

prestabilita );

Tabele. Noiuni i marcaje utilizate.

Tabelele ne permit s cream o reea dreptunghiular de domenii, fiecare
domeniu avnd propriile opiuni pentru culoarea fondului, culoarea textului,
alinierea textului etc.
Pentru a insera un tabel se folosesc etichetele
corespondente <table>...</table>. Un tabel este format din rnduri.
Pentru a insera un rnd intr-un tabel se folosesc etichetele <tr>...</tr> ( de
la " table row "= rnd de tabel ).Folosirea etichetei de sfrit </tr> este
opional.
Un rnd este format din mai multe celule ce conin date.
O celula de date se introduce cu eticheta <td>..</td>, exemplu:

n mod prestabilit, un tabel nu are chenar. Pentru a aduga un chenar unui

tabel, se utilizeaz un atribut al etichetei <tabel> numitborder.
Acest atribut poate primi ca valoare orice numar ntreg ( inclusiv 0 ) si
reprezint grosimea n pixeli a chenarului tabelului.
Dac atributul border nu este urmat de o valoare atunci tabelul va avea o
grosime prestabilit egal cu 1 pixel, o valoare egal cu 0 a grosimii
semnific absenta chenarului.
Cnd atributul border are o valoare nenul chenarul unui tabel are un aspect
tridimensional, exemplu:

Alinierea tabelului
Pentru a alinia un tabel intr-o pagin Web se utilizeaz atributul align al
etichetei <table>, cu urmtoarele valori posibile:

"left " ( valoarea prestabilita );

"center ";

"right ".

Alinierea este important pentru textul ce nconjoar tabelul. Astfel :

daca tabelul este aliniat stanga ( <table align="left"> ), atunci textul

care urmeaz dup punctul de inserare al tabelului va fi dispus in
partea dreapta a tabelului.

daca tabelul este aliniat dreapta ( <table align="right"> ), atunci textul

care urmeaz dup punctul de inserare al tabelului va fi dispus in
partea stanga a tabelului.

daca tabelul este aliniat pe centru ( <table align="center"> ), atunci

textul care urmeaz dup punctul de inserare al tabelului va fi afiat pe
toata limea paginii, imediat sub tabel.

Distanta dintre tabel i celelalte elemente din pagina Web poate fi stabilit
cu ajutorul atributelor hspace si vspace al etichetei <table>. Valoarea
atributului hspace poate fi orice numar pozitiv, inclusiv 0, si reprezint
distanta pe orizontala dintre tabel si celelalte elemente ale paginii Web.
Valoarea atributului vspace poate fi orice numar pozitiv, inclusiv 0, si
reprezint distanta pe verticala dintre tabel si celelalte elemente ale paginii
Web.
Aceste atribute funcioneaz numai cu Netscape Communicator.
Definirea culorilor de fond pentru un tabel
Culoarea de fond se stabilete cu ajutorul atributului bgcolor, care poate fi
atasat ntregului tabel prin eticheta <table>, unei linii prin
eticheta <tr> sau celule de date prin eticheta <td>.
Valorile pe care le poate primi bgcolor sunt cele cunoscute pentru o culoare.
Dac n tabel sunt definite mai multe atribute bgcolor, atunci prioritatea este
urmtoarea: <td>, <tr>, <table>(cu prioritate cea mai mica).
Culoarea textului din fiecare celula se poate stabili cu ajutorul expresiei:
<font color="valoare">...</font>.
Dimensionarea celulei unui tabel
Distanta dintre doua celule vecine se definete cu ajutorul
atributului cellspacing al etichetei <table>. Valorile acestui atribut pot fi
numere ntregi pozitive, inclusiv 0, si reprezint distanta in pixeli dintre doua

celule vecine.
Valoarea prestabilita a atributului cellspacing este 2.
Distanta dintre marginea unei celule si coninutul ei poate fi definita cu
ajutorul atributului cellpadding al etichetei <table>. Valorile acestui atribut
pot fi numere ntregi pozitive, si reprezint distanta in pixeli dintre celule si
coninutul ei.
Valoarea prestabilita a atributului cellpadding este 1.
Alinierea coninutului unei celule
Alinierea pe orizontala a coninutului unei celule se face cu ajutorul
atributului align care poate lua valorile:

"left" ( la stanga );

"center" ( centrat , valoarea prestabilita );

"right" ( la dreapta );

"char" ( alinierea se face fata de un caracter ).

Alinierea pe verticala a coninutului unei celule se face cu ajutorul

atributului valign care poate lua valorile:

"baseline" ( la baza );

"bottom" ( jos );

"middle" ( la mijloc, valoarea prestabilita );

"top" ( sus ).

.Inserarea imaginilor
Folosirea imaginilor sporete atractivitatea i designul paginii, duce la o mai
bun inelegere a mesajului, dar trebuie luat n consideraie i faptul c
excesul de imagini va duce la ncrcarea greoaie a site-ului. Exist
numeroase formate grafice, dar cele mai rspndite sunt:

GIF (Graphics Interchange Format) introdus de Compuserve

JPEG (Joint Photographic Expert Group)

PNG (Portable Network Graphic Format Grafic portabil n reea)

Aceste formate sunt dependente de platform. Imaginile grafice sunt

construite din pixeli, care sunt puncte distincte de informaie de imagine.
Fiecare pixel necesit un bit de culoare. Principalele caracteristici ale
formatelor de imagine sunt: numrul de culori, compresia, transparena,
ntreeserea i animaia. Asemnrile i deosebirile dintre cele trei formate
grafice sunt:

Imaginile GIF pot utiliza doar 256 de culori, avnd nevoie de 8 bii, n
timp ce formatele JPEG i PNG pot utiliza milioane de culori, avnd 24
de bii de culoare, respectiv 32 de bii /pixeli de culoare. Ceea ce face
formatul GIF att de utilizat nu este numai paleta mic de culori (256),
dar i posibilitatea reducerii numrului de culori, astfel, dac este
nevoie doar de 2 culori, se utilizeaz numai un bit, ceea ce reduce
dimensiunea fiierului de 8 ori.

Toate aceste trei formate grafice pot comprima imaginea pentru a

reduce dimensiunile fiierelor. Comprimarea se poate face, n mod
diferit, pentru fiecare format, i, din aceste motive, ele pot avea
dimensiuni mai mici ntr-un format dect n altul.

Formatele GIF i PNG admit culoarea transparent, n timp ce formatul

JPEG nu admite transparena.

Formatele GIF i PNG admit animaia, n timp ce, cu formatul JPEG, nu

se poate obine animaie. De exemplu, pentru a obine animaie pentru
imagini GIF se poate folosi pentru Windows pachetul GIF Construction
Set, iar pentru Macintosh pachetul soft GIFBuilder.

Toate cele trei formate accept ntreeserea. De exemplu, cnd se

vizualizeaz o pagin web, se pot observa imaginile care apar linie cu
linie, de la forma brut pn la redarea final, aceasta reprezint
ntreeserea. Dei dimensiunea fiierelor crete cu pn la 10%, cu
ajutorul acestei ntreeseri, vizitatorul poate s-i fac o imagine
despre ceea ce se va descrca.

Avnd n vedere cele cinci caracteristici ale formatelor de imagine, acestea

pot fi recomandate:

GIF pentru majoritatea imaginilor din web, butoane, panouri

publicitare, desene etc., datorit dimensiunii mici a fiierelor.

JPEG pentru fotografii, cnd se dorete s se redea ct mai exact

culoarea real a imaginii.

PNG pentru desene complexe, dar i pentru fotografii, acesta fiind

formatul care mbin caracteristicile celor dou.

Imaginile pot fi descrcate de la adrese absolute sau relative. Adresele URL

(Uniform Resource Locator) reprezint standarde de identificare a resurselor
(de exemplu, fiiere) i pot fi adrese URL absolute i relative.
Adrese URL absolute
Adresele absolute identific locaia unui fiier imagine de pe Internet sau alte
calculatoare conectate la Internet i au
sintaxa:protocol/nume_calculator/cale/nume_fiier
Un exemplu de adres URL
absolut: http://ciobanu.cich.md/images/eu.jpg
unde:

htpp:// este protocolul Internet utilizat;

ciobanu.cich.md este numele calculatorului;

images este calea pn la fiierul imagine dorit;

eu.jpg este fiierul imagine C.A.

Adrese URL relative

O adres relativ identific locaia unei imagini, descriind o cale relativ la
directorul curent unde se afl fiierul imagine. Adresele relative se refer la
localizarea fiierului imagine de pe calculatorul personal i are
sintaxa: cale/nume_fiier.
Referirea la:
directorul printe se poate face prin ../
directorul rdcin se poate face prin /
Un exemplu de adres URL relativ: /../../../friend.jpg sau se mai poate
scrie c:/windows/web/wallpaper/friend.jpg
Toate imaginile cu care vom lucra vor avea adresa URL exprimat n funcie
de directorul ce conine documentul HTML care face referire la imagine,
adic adres relativ.

Imaginile se inseraez n pagini cu ajutorul tag-ului <img>, care este un

element inline, adic poate fi inserat oriunde n pagin. Sintaxa acestui
element este: <img atribute>.
n continuare este prezentat un exemplu de utilizare a elementului <img>:

Pentru ca acest exemplu s poat fi executat, trebuie ca

fiierul Taj_Mahal.jpg s fie n acelai folder cu pagina, deoarece nu s-a
indicat nicio adres.
Atributele elementului img
Atributele elementului <img> sunt: src, alt, align, border, height,
width,hspace, vspace.
n continuare vor fi descrise succint aceste atribute.
Atributul src
Atributul src este un atribut obligatoriu al elementului IMG, care identific
fiierul ce conine imaginea care se dorete a fi inserat. Fiierele imagine
pot avea extensia: .jpg, jpeg, png etc. Fiierul care conine imaginea se
gsete n directorul curent (ca n exemplul de mai sus), n alt folder din
calculatorul curent sau n reeaua web. n cazul n care fiierul se afl:

n alt locaie dect directorul curent, numele fiierului trebuie

precedat de calea relativ la directorul curent;

n reeaua web, trebuie dat adresa URL absolut, ca de

exemplu http://cich.md/galerie/img_1631.jpg.

Atributul alt
Exist posibilitatea ca imaginile s nu se poat ncrca din diferite motive,
situaie n care se folosete atributul alt al elementului <img>. Valoarea
acestui atribut este un text, care va fi afiat n locul imaginii.
Atributul align

Atributul align indic browser-ului cum va fi aliniat poza fa de text. n lipsa

unei opiuni, poza este plasat acolo unde este scris n cod (<img>este
element inline, iar textul ncepe de la baza pozei).Valorile atributului sunt:

left aliniere la stnga i textul curge pe lng imagine n dreapta ei,

ncepnd din partea superioar;

right aliniere la dreapta i textul curge pe lng imagine n stnga

ei, ncepnd din partea superioar ;

top textul este plasat n partea superioar a imaginii;

middle textul are plasat, la mijlocul imaginii, numai primul rnd,

restul continund sub imagine;

bottom textul este plasat n partea de jos a imaginii i continu sub

imagine.

Atributul border
Atunci cnd se insereaz o imagine, browser-ul o va afia fr chenar. Pentru
a aduga un chenar unei imagini se folosete atributulborder=nr_pixeli,
unde nr_pixeli reprezint grosimea chenarului n pixeli. Valoarea implicit
este 0. Dac n exemplul de mai sus se mai adaug acest atribut <img
src="Taj_Mahal.jpg" height ="150" width = "150" border = "4">
Atributele width i height
Imaginea este transferat de browser-e de la adresele URL la adresa de unde
se vizualizeaz pagina, la dimensiunile ei reale. Pentru a redimensiona o
imagine pe lime se folosete atributul width, iar pe nlime se folosete
atributul height. Redimensionarea unei imagini se face n mod absolut n
pixeli sau prin raportare la ecran, astfel c valorile acestor atribute pot fi
date n:

Numere naturale, ce reprezint dimensiunea n pixeli;

n procente, ce reprezint o fraciune din dimensiunea ferestrei.

Atributele hspace i vspace

Aceste atribute au acelai efect ca i atributele cu acelai nume ale

elementului <table>, i, anume, asigur distana de la imagine la celelalte
componente din pagin, pe orizontal (hspace) i pe vertical (vspace),
adic definesc spaii albe n jurul imaginilor.
Atributul clear al elementului BR
Dac se dorete a se terge textul din jurul unei imagini se folosete
elementul <br clear=valoare>, unde valoare poate fi:

all se terge tot textul din jurul imaginii

left se terge tot textul din stnga imaginii

right se terge tot textul din dreapta imaginii

none se las textul din jurul imaginii

Inserarea sunetelor si videoclipurilor

Multimedia se prezint ntr-o multitudine de formate, iar pe Internet vei gsi
multe dintre aceste elemente nglobate n pagini web. Browser-ele actuale
ofer suport pentru multe dintre aceste formate, dar nu pentru toate.
Suportul pentru sunete, animaii i video este tratat n mod diferit de
browsere diferite. Unele elemente pot fi manevrate intern, altele necesit
anumite plug-in-uri, n vreme ce altele pot solicita activarea anumitor
controale ActiveX.
n acest capitol vei afla despre diferitele formate multimedia i cum s le
folosii ntr-o pagin web.
Elementele multimedia (precum sunetele i video) sunt stocate n fiiere
media. Modalitatea cea mai simpl de a determina tipul unui fiier media
este de a analiza extensia fiierului respectiv .
Formatul fiierelor multimedia ce conin sunete.
Sunetele pot fi stocate n diferite formate de fiiere. Astfel deosebim:
a) Formatul MIDI
MIDI (Musical Instrument Digital Interface) este un format ce permite
transmiterea de informaii muzicale ntre dispozitive electronice muzicale

(precum sintetizatoare) i plcile de sunet ale calculatoarelor.Formatul MIDI a

fost implementat n 1982 de ctre industria muzical. Acest format este
foarte flexibil i poate fi folosit pentru (aproape) orice, de la crearea unor
sunete foarte simple, pn la crearea unora cu adevrat profesionale.
Fieierele MIDI nu conin sunete, ci un set de instruciuni digitale muzicale
(note muzicale) care pot fi interpretate de plcile de sunet ale
calculatoarelor.Dezavantajul la acest tip de fiiere const n faptul c nu pot
stoca muzic (n toat complexitatea ei), ci doar note muzicale.Avantajul l
constituie mrimea mic a acestor fiiere, prin urmare se pot ncrca uor
ntr-o pagin web, precum i faptul c acest format este suportat de
majoritatea sistemelor de operare i de cele mai populare browsere de
Internet. Fiierele de tip MIDI au extensia .mid sau .midi.
b) Formatul RealAudio
Formatul RealAudio a fost dezvoltat pentru Internet de ctre Real Media.
Acest format suport chiar i video.Formatul permite difuzarea de informaii
audio (muzic on-line, Internet radio) cu lime de band joas. Din cauza
acestei limi de band, calitatea este, de cele mai multe ori, slab.Fiierele
de tip RealAudio au extensia .rm sau .ram.
c)

Formatul AU

Acest formatul a fost dezvoltat de ctre Sun Microsystems i este suportat de

majoritatea sistemelor de operare.Aceste fiierele au extensia .au.
d) Formatul AIFF
AIFF (Audio Interchange File Format) a fost dezvoltat de ctre Apple. Acest tip
de fiiere nu sunt suportate de toate browser-ele.Aceste fiierele au
extensia .aif sau .aiff.
e) Formatul SND
SND (Sound) a fost dezvoltat, de asemenea, de ctre Apple i au acelai
dezavantaj, i anume c nu sunt suportate de toate browser-ele.Aceste
fiierele au extensia .snd.
f)

Formatul WAVE

WAVE (waveform) a fost dezvoltat de ctre IBM i Microsoft. Este un format

suportat de toate computerele pe care ruleaz Windows i este recunoscut
de majoritatea browsere-lor.Fiierele de tip WAVE au extensia .wav.

g) Formatul MP3
Fiierele MP3 sunt de fapt fiiere MPEG, dezvoltate iniial pentru video de
ctre Moving Pictures Experts Group. Se poate afirma c fiierele MP3
reprezint partea de sunet dintr-un fiiere video n format MPEG.MP3 este n
prezent unul dintre cele mai populare formate folosite la nregistrarea
muzicii. Sistemul de codificare MP3 combin o bun compresie (ce duce la
fiiere mici) cu calitate nalt. Este de ateptat ca pe viitor toate sistemele de
operare s ofere suport pentru acest tip de format.Fiierele de tip MP3 au
extensia .mp3 sau .mpga.
n funcie de scopul pentru care creai o pagin web multimedia va trebui s
v orientai i asupra unui anumit format de fiier. Astfel, dac dorii ca
sunetele nregistrate (muzic sau de alt tip) s poat fi asculatet de toi
vizitatorii paginii web, atunci trebuie s folosii fiiere n format WAV, ntruct
este cel mai popular format pe Internet i este suportat de majoritatea
browsere-lor. Dac pagina web este despre nregistrri muzicale, atunci
formatul cel mai potrivit este MP3.
Formatul fiierelor multimedia ce conin video
i imaginile video pot fi stocate n diferite formate de fiiere. Astfel
deosebim:
a) Formatul AVI
Formatul AVI (Audio Video Interleave) a fost dezvoltat de ctre Microsoft. Este
un format suportat de toate computerele pe care ruleaz Windows i este
recunoscut de majoritatea browsere-lor. Dei este un format des ntlnit pe
Internet, nu este ntotdeauna suportat de calculatoarele cu sisteme de
operare non-Windows.Fiierele de tip AVI au extensia .avi.
b) Formatul Windows Media
Acest formatul a fost dezvoltat de ctre Microsoft. i acest format este unul
suportat de toate computerele pe care ruleaz Windows, dar nu este
suportat de calculatoarele cu sisteme de operare non-Windows dect n urma
instalrii unor extra componente (playere specializate).Fiierele de tip
Windows Media au extensia .wmv.
c)

Formatul MPEG

Formatul MPEG (Moving Pictures Expert Group) este n prezent unul dintre
cele mai populare formate folosite pe Internet. Acest format este suportat de

majoritatea sistemelor de operare i de cele mai populare browsere de

Internet. Fiierele de tip MPEG au extensia .mpg sau .mpeg.
d) Formatul QuickTime
Formatul QuickTime a fost dezvoltat de ctre Apple i nu poate rula pe
platformele Windows fr instalarea unui player specializat. Fiierele de tip
QuickTime au extensia .mov sau .qtm.
e) Formatul RealVideo
Formatul RealVideo a fost dezvoltat pentru Internet de ctre Real
Media.Formatul permite difuzarea de informaii video (video on-line, Internet
video) cu lime de band joas. Din cauza acestei limi de band, calitatea
este, de cele mai multe ori, slab.Fiierele de tip RealVideo au extensia .rm
sau .ram.
f)

Formatul Shockwave (Flash)

Formatul Shockwave a fost dezvoltat de ctre Macromedia. Acest format

necesit instalarea unui player specializat pentru a putea rula. n prezent,
aceast component este oferit preinstalat de ultimele versiuni ale
browsere-lor Netscape i Internet Explorer. Fiierele de tip Shockwave au
extensia .swf.
Adugarea de informaii multimedia unei pagini web
Informaiile multimedia pot fi redate direct de browser sau prin intermediul
unui program ajuttor (un player specializat), n funcie de elementul HTML i
de formatul fiierului multimedia folosit.
Cea mai simpl cale de a realiza acest lucru este prin folosirea unei ancore
(link) care s duc la sursa elementului multimedia. Este cea mai
prietenoas metod ntruct ofer posibilitatea vizitatorilor de a alege ntre
a vedea o pagin web cu elemente multimedia sau fr acestea. n acest caz
pagina se ncarc mult mai repede nemaifiind nevoie s se ncarce toate
informaiile multimedia.
O metod specific, mai complex, ce are ca rezultat includerea n pagina
web (ca parte integrant din aceasta) a unor informaii multimedia, se
realizeaz prin intermediul elementului <OBJECT>.
Not: Dei, n funcie de browser-ul folosit, mai pot fi folosite i alte
elemente, cum ar fi <BGSOUND>, recunoscut de Internet Explorer,

i <EMBED>, recunoscut de Internet Explorer i Netscape,

consoriul W3C (World Wide Web Consortium) recomand utilizarea
elementului <OBJECT>.
<OBJECT TYPE="text/html" HEIGHT="..."
WIDTH="..." DATA="http://www.pagina_web.com">
</OBJECT>
Pentru a insera o animaie creat n Flash (n format .swf) se folosete
urmtoarea sintax:
<OBJECT WIDTH="..." HEIGHT="..." CLASSID="clsid:D27CDB6E-AE6D11cf-96B8444553540000"CODEBASE="http://download.macromedia.com/pub/s
hockwave/cabs/flash/swflash.cab#4,0,0,0">
<PARAM NAME="SRC" VALUE=" nume_fisier.swf">
</OBJECT>
Inserarea unui film QuickTime ntr-o pagin web
Formatul QuickTime a fost dezvoltat de ctre Apple i, dei este un format
des ntlnit pe Internet, nu poate rula pe platformele Windows fr instalarea
unui player specializat. Fiierele de tip QuickTime au extensia .mov sau .qtm.
Cu ajutorul elementului <OBJECT> poate fi uor adugat cod ntr-o pagin
web astfel nct un film QuickTime s poat fi inserat ntr-o pagin web.
Astfel, se poate seta instalarea automat a unui player QuickTime n cazul n
care nu este deja instalat.
Sintaxa folosit n mod uzual este de forma urmtoare:
<OBJECT WIDTH="240" HEIGHT="300" CLASSID="clsid:02BF25D58C17-4B23-BC80D3488ABDDC6B"CODEBASE="http://www.apple.com/qtactivex/qtplu
gin.cab">
<PARAM NAME="src" VALUE="sample.mov">
<PARAM NAME="autoplay" VALUE="true">
<PARAM NAME="controller" VALUE="true">
</OBJECT>
Atributele width i height trebuie setate astfel nct s corespund
dimensiunii fimului QuickTime (n pixeli).

Atributul classid identific n mod unic software-ul ce va rula filmul. Trebuie

setat "clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" astfel nct s
identifice controlul ActiveX ce trebuie instalat pe computer nainte ca filmul
s poat fi rulat. Dac utilizatorul nu are instalat respectivul control ActiveX,
browser-ul poate n mod automat s-l descarce i s-l instaleze.
Atributul codebase specific calea (URI-ul) n care se gsete clasa
obiectului specificat prin atributul clsid. Internet Explorer folosete acest
atribut pentru a specifica locaia de unde poate fi descrcat player-ul
corespunztor. n acest caz, trebuie setat
"http://www.apple.com/qtactivex/qtplugin.cab", aceasta fiind locaia unde se
gsete ultima variant a player-ului QuickTime.
Parametrul src trebuie s se orienteze asupra fiierului ce conine filmul.
Parametrul autoplay se seteaz "true" n cazul n care se dorete ca filmul
s nceap s ruleze automat.
La fel i parametrul controller se seteaz "true" n cazul n care se dorete
s fie afiat bara de control a player-ului.
Inserarea unui film Real Video ntr-o pagin web
Formatul RealVideo a fost dezvoltat pentru Internet de ctre Real Media.
Formatul permite difuzarea de informaii video (video on-line, Internet video)
cu lime de band joas. Din cauza acestei limi de band, calitatea este,
de cele mai multe ori, slab.Fiierele de tip RealVideo au extensia .rm sau
.ram. Cu ajutorul elementului <OBJECT> se introduce codul n pagina web
astfel nct filmele Real Video s poat fi inserate ntr-o pagin web. Spre
deosebire de formatul QuickTime, nu se poate seta instalarea automat a
player-ului corespunztor n cazul n care nu este deja instalat. Prin urmare,
nainte de a putea rula un film n format Real Video, este necesar instalarea
programului RealPlayer. Versiunea pentru Windows poate fi descrcat de la
adresa http://uk.real.com/?mode=rp .
Sintaxa folosit n mod uzual este de forma urmtoare:
<OBJECT WIDTH="320" HEIGHT="240" CLASSID="clsid:CFCDAA038BE4-11cf-B84B-0020AFBBCCFA">
<PARAM NAME="controls" VALUE="All">
<PARAM NAME="autostart" VALUE="true">
<PARAM NAME="src" VALUE="sample.rm">
</OBJECT>

Atributele width i height trebuie setate astfel nct s corespund

dimensiunii fimului Real Video (n pixeli).
Atributul classid identific n mod unic software-ul ce va rula filmul. Trebuie
setat "clsid: CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" astfel nct s
identifice controlul ActiveX ce trebuie instalat pe computer nainte ca filmul
s poat fi rulat.
Parametrul src trebuie s se orienteze asupra fiierului ce conine filmul.
Parametrul autostart se seteaz "true" n cazul n care se dorete ca filmul
s nceap s ruleze automat.
Parametrul controls se seteaz "All" n cazul n care se dorete s fie afiat
bara de control a player-ului sau "ImageWindow " n cazul n care NU se
dorete s fie afiat bara de control a player-ului.
Alte metode de inserare a unor sunete ntr-o pagin web
Aa cum am atras atenia anterior, pentru introducerea de sunete ntr-o
pagin web mai pot fi folosite i alte elemente, cum ar fi <BGSOUND>,
recunoscut de Internet Explorer, i <EMBED>, recunoscut de Internet
Explorer i Netscape.Elementul <BGSOUND> este folosit pentru a insera un
sunet pe fundalul unei pagini web. Fiierele suportate de acest element pot fi
n format WAV, AU sau MID
Sintaxa folosirii acestui element este foarte simpl:
<html>
<body>
<H2>Muzica in fundal </H2>
<BGSOUND SRC="http://ciobanu.cich.md/muz/town.mid">
</body>
</html>
Folosind codul de mai sus vei obine o pagin web pe fundalul crei se va
auzi o pies instrumental.Elementul <EMBED> este folosit pentru a insera
elemente multimedia ntr-o pagin web n cazul browsere-lor care nu suport
elementul <OBJECT>. Elementul <OBJECT> poate fi folosit cu browserele
mai noi, care suport controale ActiveX (Internet Explorer 5), n vreme ce
elementul <EMBED> este recomandat s fie folosit pentru browserele mai
vechi. Pentru compatibilitate, se recomand folosirea simultan a celor dou

elemente. n aceast situaie, un browser care recunoate elementul

<OBJECT> va ignora elementul <EMBED>.
mpreun cu elementul <EMBED> se recomand folosirea elementului
<NOEMBED> care ar trebui s conin informaii ce vor fi afiate n cazul n
care browser-ul nu suport elementul <EMBED>. Din nefericire, un browser
care suport elementul <EMBED> va ignora elementul <NOEMBED>, chiar
dac este incapabil s afieze obiectul introdus de elementul
<EMBED>.
Sintaxa recomandat pentru folosirea acestui element este urmtoarea:
<EMBED SRC="http://ciobanu.cich.md/cale/fiier_multimedia"
WIDTH="..." HEIGHT="..." >
<NOEMBED>
<P>Din pcate nu avei instalat plugin-ul corespunztor pentru a
vedea acest tip de fiier multimedia. Putei vedea n continuare o
imagine edificatoare.
<IMG SRC="http://ciobanu.cich.md/cale/fiier_imagine"
WIDTH="..." HEIGHT="..." ALT="o imagine edificatoare">
</NOEMBED>
Se poate folosi chiar i o combinaie ntre elementele <EMBED> i
<BGSOUND>, astfel nct, dac unul din elemente nu este suportat de
browser, s fie recunoscut cellalt.
Referine. Referine interne i externe.
Pn acum am nvat s crem documente HTML n care am ntrodus text i
imagini. n acest capitol vom arta cum putem accesa orice resurs Web,
Internet i intern cu ajutorul referinelor (legturi, link-uri, hiperlegturi).
Referinele au urmtoarele roluri:

Permit trecerea de la o pagin la alta de pe Web i revenire la pagina

iniial prin apsarea butonului Back al browser-ului;

Permit trecerea de la o pagin la alta de pe calculatorul propriu;

Permit trecerea la fiiere non web de pe Internet (ftp, telnet etc.);

Permit trecerea la fiiere non HTML (.txt, .jpg, .pdf etc.);

Permit vizitarea unei pagini ncepnd dintr-un anumit loc, renunnd la

barele de defilare;

Permit trimiterea unui e-mail.

7.1. Marcajul <a>

Pentru a crea o legtur se folosete marcajul <a> ancor, care are
sintaxa: <a atribute> coninut </a>
Coninutul dintre marcajele <a> i </a> poate fi text i/sau imagine, este
afiat de browser sub form de legtur (colorat i subliniat), i poate
accepta comenzi de la mouse (un clic) sau de la tastatur (ENTER). Cnd
este deasupra unei legturi, cursorul grafic ia forma unei mini, indicndu-ne
astfel c browser-ul este pregtit s descarce resursa Internet de la adresa
URL indicat. Dac un document are mai multe legturi ne putem deplasa
de la una la alta i cu mouse-ul i cu ajutorul tastei TAB, iar pentru a face o
legtur activ se execut clic cu butonul stng pe legtur sau se tasteaz
ENTER.
Atributele tag-ului <a> sunt:

href;

target;

title;

name;

Atributul href
Atributul href (referin hipertext) este obligatoriu pentru tag-ul legtur
(ca src pentru elementul <img>), are sintaxa href="adresa URL"i are
rolul de a identifica o adres URL absolut (de pe Internet) sau relativ
(local). n exemplul de mai jos dm o referin ctre un fiier local, flori.jpg,
i ctre pagina Colegiului de Informatic, de pe WEB:
Atributul target
Cnd utilizatorul activeaz o legtur, browser-ul nlocuiete fereastra care
conine legtura cu o nou fereastr, specificat de adresa URL din href.
Atributul target face s se schimbe aceast operaie implicit i el are
sintaxa target="nume", unde nume definete fereastra n care va fi

ncrcat noua pagin. Numele este orice ir de caractere sau valori

constante:

_blank pagina va fi ncrcat ntr-o nou fereastr;

_parent pagina va fi ncrcat n fereastra printe;

_top pagina va fi ncrcat n fereastra top a cadrului;

_self pagina va fi ncrcat n aceeai fereastr(implicit).

Atributul title Acest atribut are un caracter general i poate fi ataat la

majoritatea elementelor HTML. Sintaxa acestui element
este:title="valoare". Cnd mouse-ul este deasupra coninutului tagului <a> coninut </a> se transform ntr-o mn i va afia valoarea
atributului title, ntr-o sugestie de instrument (ntr-un cadru).
Referine ctre alte pagini Web
Dac se dorete accesarea unei pagini de pe alt site, valoarea
atributului href este o adres URL absolut. Amintim c o adresa URL
absolut are sintaxa: protocol /nume-calculator/cale/fiier unde protocol
poate fi, de exemplu, http.

Wix.com Ajax Crawling

In realizarea paginii web am uitilizat www.wix.com (online web designer)
ce utilizeaza Ajax Crawling pentru a permite vizualizarea site-urilor web de
pe orice tip de browser .Am decis sa aleg acest web designer deoarece
prezinta numeroase facilitatii, iar modul de operare si lucrul efectiv cu
ajutorul acestui site nu necesita cunostinte html avansate . In continuare voi
expune cateva informatii cu privire la aceasta metoda Ajax Crawlingprecum si metoda prin care poate fi extras codul sursa dintr-un astfel de
site.
AJAX Introducere

AJAX este despre actualizarea unor pri ale unei pagini web, fr a rencrca
ntreaga pagin.
Ce este AJAX?
AJAX = Asynchronous JavaScript i XML.

AJAX este un nume neltoare. Tu nu trebuie s neleag XML pentru a utiliza AJAX
AJAX este o tehnica pentru crearea de pagini web rapide i dinamice.
AJAX permite paginii web s fie actualizate asincron prin schimbul cantiti
mici de date cu serverul din spatele scenei. Acest lucru nseamn c este
posibil s se actualizeze pri ale unei pagini web, fr a rencrca ntreaga
pagin.
La paginile web clasice, (care nu utilizeaz AJAX) trebuie s rencrcai
ntreaga pagin n cazul n care coninutul ar trebui s se schimbe.
Exemple de aplicaii care utilizeaz AJAX: Google Maps, Gmail, YouTube i
Facebook.
Cum funcioneaz sistemul AJAX

AJAX se bazeaz pe standarde Internet

AJAX se bazeaz pe standarde pe internet, i utilizeaz o combinaie de:

obiect XMLHttpRequest (pentru a prelua date de la un server web)

JavaScript / DOM (pentru a afia / utiliza datele)

Obiectul XMLHttpRequest
Toate browserele moderne accept obiectul XMLHttpRequest.
Obiectul XMLHttpRequest este folosit pentru a face schimb de date cu un
server n spatele scenei. Acest lucru nseamn c este posibil s se
actualizeze pri ale unei pagini web, fr a rencrca ntreaga pagin.
Creai un obiect XMLHttpRequest
Toate browserele moderne (Chrome, IE7 +, Firefox, Safari i Opera) au un
obiect built-in XMLHttpRequest.
Sintaxa pentru crearea unui obiect XMLHttpRequest:
variable = new XMLHttpRequest();

Versiunile mai vechi de Internet Explorer (IE5 i IE6) utilizeaz un

obiect ActiveX:
variable = new ActiveXObject("Microsoft.XMLHTTP");
Trimite o cerere la un server
Pentru a trimite o cerere la un server, folosim deschis () i trimite () metode
ale obiectului XMLHttpRequest:
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();

GET sau POST?

GET este mai simplu i mai rapid dect POST, i poate fi folosit n cele mai
multe cazuri.
Cu toate acestea, utilizai ntotdeauna cereri POST atunci cnd:

Un fiier din memoria cache nu este o opiune (actualizai un fiier sau

baz de date de pe server).

Trimiterea de o cantitate mare de date ctre server (POST nu are limite

de dimensiune).

Se trimite datele introduse de utilizator (care pot conine caractere

necunoscute), POST este mai robust i sigur dect GET.

GET Cereri
xhttp.open("GET", "demo_get.asp", true);
xhttp.send();

Cereri POST
xhttp.open("POST", "demo_post.asp", true);
xhttp.send();
URL-ul - un fiier de pe un server
Parametrul URL-ul metodei deschise (), este o adres ntr-un fiier de pe un server:
xhttp.open("GET", "ajax_test.asp", true);
Fiierul poate fi orice tip de fiier, cum ar fi .txt i .xml, sau fiiere de server
scripting cum ar fi asp i .php (care se poate realiza aciuni pe server nainte de a
trimite napoi rspunsul).

Asincron - Adevrat sau fals?

Trimiterea de solicitri asincrone este o mare imbunatatire pentru dezvoltatorii
web. Multe dintre sarcinile ndeplinite pe server sunt consumatoare de timp. nainte
de a AJAX, aceast operaie poutea cauza aplicaiei s se blocheze sau s se
opreasc.
Cu AJAX, JavaScript nu trebuie s atepte rspunsul serverului, dar poate n schimb:

executa alte script-uri n timp ce ateapt rspuns server

lucreaza cu rspunsul atunci cnd rspunsul este pregtit

Async = true
Atunci cnd se utilizeaz = true async, specificai o funcie pentru a executa atunci
cnd rspunsul este pregtit n cazul onreadystatechange:
xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4 && xhttp.status == 200) {

document.getElementById("demo").innerHTML = xhttp.responseText;
}
};
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();

Async = false
Pentru a utiliza = false async, modificai al treilea parametru n metoda deschis ()
la false:
xhttp.open("GET", "ajax_info.txt", false);
Async = fals nu este recomandat, dar pentru cteva solicitri de mici, acest lucru
poate fi ok.
Amintii-v c JavaScript nu va continua s execute, pn cnd rspunsul server
este gata. Dac serverul este ocupat sau lent, aplicaia se va nchide sau opri.
xhttp.open("GET", "ajax_info.txt", false);
xhttp.send();
document.getElementById("demo").innerHTML = xhttp.responseText;

Japonia Tara Soarelui Sus Rasare

-Pagina webCodul efectiv al paginii :