Documente Academic
Documente Profesional
Documente Cultură
NOTIUNI GENERALE
- INTERNET
- HTML
- JAVA
- URL
PROGRAMARE HTML, XML
- 6-
PROGRAMARE HTML, XML
CAPITOLUL I
NOTIUNI GENERALE [13, 28, 78, 77]
1.1 INTERNET
- 7-
PROGRAMARE HTML, XML
Internet este reŃeaua publică ajunsă la scară planetară. Este alcătuit dintr-
un conglomerat de reŃele de diverse complexităŃi, de la cele multinaŃionale la
cele regionale sau zonale, toate vorbind o aceeaşi limbă, statuată de familia
de protocoale TC/IP.
Internet-ul a crescut extrem de rapid. Dacă in 1981 erau doar 213 calcula-
toare gazdă în cadrul reŃelei, prin 1990, avea cca 320 000 calculatoare
gazdă, ajungând în 1993 la cca 2,1 milioane. Acum, numărul calculatoarelor
gazdă a explodat practic, în plină eră a sistemului Web.
Principiul director care a făcut reteaua publică Internet atât de populară este
cel al adoptării unor standarde deschise.
Pe lânga stiva TCP/IP obligatorie, în memoria staŃiei de lucru, vor mai fi
programe sau “servicii TCP/IP” ca de exemplu: e-mail, ftp, telnet, archie, go-
pher, WAIS, finger, WWW, etc.
Internet poate fi definit astfel:
Numele propriu Internet (scris cu majusculă) se referă la reteaua
mondială unică de calculatoare interconectate prin protocoalele
(regulile) de comunicare Transmission Control Protocol şi Internet
Protocol, numite pe scurt TCP/IP. Cuvântul "Internet" provine din îm-
preunarea artificială şi parŃială a două cuvinte englezeşti: intercon-
nected = interconectat şi network = reŃea [wiki].
Naşterea, în martie 1989 şi creşterea sistemului World Wide Web a schim-
bat practic felul de comunicare al majorităŃi utilizatorilor planetei. Tim
Barners-Lee, s-a gândit să uşureze modul de comunicare al celor neiniŃiaŃi,
si in 1992 a proiectat şi implementat un sistem care să permită legături şi
asocieri multiple între documente. Sistemul constă dintr-un program interac-
tiv numit browser care ajută la “răsfoirea” acestui păienjeniş de documente,
utilizând legăturile dintre ele (links).
In ianuarie 1993, existau aproximativ 50 de servere Web sau Web sites.
Toate foloseau acelaşi protocol pentru hipertexte, cunoscut sub acronimul
- 8-
PROGRAMARE HTML, XML
1.2 HTML
- 9-
PROGRAMARE HTML, XML
1.3 JAVA
Java [77] este un limbaj orientat spre obiecte creat de Sun Microsystem,
destinat mediului de reŃea, robust, care oferă un acces securizat la infor-
maŃie, neutru din punct de vedere architectural, portabil, prevăzut şi cu me-
canismul de multi threading. Cu el se obtin aplicaŃii, denumite în engleză ap-
plets. Orice browser existent azi ştie să interpreteze programe Java, în sen-
sul că printre componentele sale suplimentare (plug-ins), conŃine şi acest
interpretor al codului intermediar sub care “circula” applet-urile. Java conferă
interactiviate Web-ului ca şi JavaScript. Java economiseşte munca de scri-
ere a programului. Întocmai ca munca unui stilist care creează modele în in-
dustria textilă şi în programare găsim obiecte şi clase gata făcute de pro-
gram, pe care le includem în programele realizate cu Java. Fară să avem
cunostinte de programare putem interacŃiona cu mediul şi astfel impresiona
pe cei ce vizitează pagina utilizînd o serie de efecte de animaŃie sau sonore.
Java este primul limbaj de programare dezvoltat pentru mediul de reŃea, un
limbaj de nivel înalt, precum C++. Limbajul contine o colecŃie de rutine pen-
tru protocoalele TCP/IP cum ar fi HTTP sau FTP. Applet-ul Java poate înle-
sni accesul oriunde în Internet, prin sistemul URL (Universe Resource Loca-
tor). Compilatorul Java va genera un aşa-zis cod neutru, de fapt un fişier
obiect, care nu conŃine instructiuni maşină. Din această cauză se spune că
este arhitecture-neutral , adică independent de arhitectură. Cel care face
- 10 -
PROGRAMARE HTML, XML
translaŃia din acest cod intermediar în codul maşină propriu platformei este
aşa numitul just-in-time compiler, un program de interpretare a codului in-
termediar. Pentru fiecare dintre platforme, acesta va genera instrucŃiunile
maşină specifice, chiar la momentul încarcarii aplicaŃiei compilate cu Java,
adică applet-ului.
Pentru a putea lucra cu HTML, Java sau JavaScript, trebuie să ştim ce este
un URL.
1.4 URL
- 11 -
PROGRAMARE HTML, XML
- 12 -
PROGRAMARE HTML, XML
CAPITOLUL II
MARCAJE DE FORMATARE
A DOCUMENTULUI HTML [13, 28, 30, 32]
- 13 -
PROGRAMARE HTML, XML
- 14 -
PROGRAMARE HTML, XML
Pentru a nu uita sa inchizi toate tag-urile pe care le-ai deschis este indicat sa
scrii dupa fiecare tag deschis si tag-ul de incheiere (in cazul in care tag-urile
sunt pereche), si apoi sa completezi informatiile din interiorul acestora.
Salvarea fisierului HTML creat se face
astfel:
- meniul File
- comanda Save As,
- se da nume documentului si se pune
extensia htm.
- Apoi butonul Save.
Marcajele pot avea diferite atribute sau proprietati, care se scriu numai in
tag-ul de inceput. Atributele au valori implicite si daca nu se specifica nimic
de catre proiectantul paginii web, brauser-ul va utiliza automat valorile im-
plicite Daca un tag nu are nici un atribut, atunci browser-ul va lua in consid-
erare valorile implicite ale tag-ului respectiv.
Exemplu de atribut al marcajului <BODY></BODY>:
- 15 -
PROGRAMARE HTML, XML
Implicit alinierea textului pentru paragraful nou creat este la stanga. Marca-
jul <p> poate contine si atribute de aliniere, astfel:
- <p align=”right”> va alinia textul la dreapta
- <p align=”center”> va centra textul
- <p align=”justify”> va aseza centrul dintr-o margine in cealalta a paginii
web .
In exemplul urmator textul va fi centrat.
- 16 -
PROGRAMARE HTML, XML
Marcajul <BR> este utizat pentru trecerea la linie nouă (break). Deosebirea
dintre marcajul <BR> si marcajul <P> este ca prin utilizarea lui <BR> se
trece pe urmatorul rand, iar prin utilizarea lui <P> se ltrece la urmatorul rand
si se lasa un rand liber intre texte.
Sa revenim la primulexemplu de la marcajul <P>. Se vor folosi ambele tag-
uri, <BR> si <P>, pentru a se vedea diferenta dinre ele.
Ca orice marcaj, <BR> poate apărea oriunde în text, inclusiv la sfârşitul liniei
ce urmeaza a fi întrerupta. Deoarece marcajele HTML nu Ńin seama de lite-
rele mari sau mici, înseamnă că <BR> şi <br> sau chiar <bR> sunt exact la
fel.
- 17 -
PROGRAMARE HTML, XML
- 18 -
PROGRAMARE HTML, XML
- 19 -
PROGRAMARE HTML, XML
Pentru ca pagina de
Web să arate mai elevat
ii putem da un titlu
adecvat, folosind marca-
jul <TITLE>. Titlul apare
de obicei pe bara de sus
a ferestrei afişate de
calculator. Marcajul <TITLE> permite definirea titlului documentului. Este un
marcaj pereche şi apare în cadrul blocului de informaŃii <HEAD> </HEAD>,
ca in exemplul
urmator:
<HEAD>
<TITLE></TITLE>
</HEAD>
Textul din
<TITLE> este
folosit şi ca
informaŃie de legătură atunci când utilizatorul salvează un document Web
într-o listă de pagini (bookmark) sau listă favorită. Astfel, un <TITLE> semni-
ficativ pentru fiecare pagină creată poate fi de un real ajutor. In exemplu
apare si marcajul <PRE></PRE> care in acest caz nu are un rol anume dar
prezenta lui dupa cum se observa nu supara interpretorul.
- 20 -
PROGRAMARE HTML, XML
InformaŃiile de formatare
discutate până acum permit
crearea de documente
atractive. Dacă pagina trebuie
organizată în secŃiuni sau
- 21 -
PROGRAMARE HTML, XML
- 22 -
PROGRAMARE HTML, XML
- 23 -
PROGRAMARE HTML, XML
- 24 -
PROGRAMARE HTML, XML
CAPITOLUL III
MARCAJE DE FORMATARE A TEXTULUI
[13, 28, 32, 88, 77]
- 26 -
PROGRAMARE HTML, XML
Indicii superiori (superscript) sunt definiŃi prin <SUP> şi </SUP>, iar cei infe-
riori (subscript) prin <SUB> şi </SUB>.
- 27 -
PROGRAMARE HTML, XML
- 28 -
PROGRAMARE HTML, XML
- 29 -
PROGRAMARE HTML, XML
cunoscute stiluri logice sunt <EM> </EM> pentru evidenŃiere text cu stil cur-
siv şi <STRONG> </STRONG> pentru evidenŃiere puternică cu stil aldin .
In exemplul urmator este prezentat stilul logic <EM></EM>.
În standardul HTML sunt specificate multe alte marcaje logice, mai rar
folosite , printre care:
<CITE> </CITE> Citare bibliografică (afisarea in stil cursv a unei
referinte)
<CODE> </CODE> Listing de program
<DFN> </DFN> DefiniŃie de cuvânt
<KBD> </KBD> Text de la tastatură
<SAMP> </SAMP> Exemplu de date introduse de utilizator
<VAR> </VAR> Program sau variabilă.
Marcajele HTML corespunzătoare acestei secŃiuni se află în Anexă.
- 30 -
PROGRAMARE HTML, XML
- 31 -
PROGRAMARE HTML, XML
Marcaje de bază
Marcaj Marcaj de SemnificaŃie
HTML închidere
<ADDRESS> </ADDRESS> InformaŃii despre adresă şi despre autor
<BODY> </BODY> Corpul paginii HTML
<BR> Linie nouă
<HEAD> </HEAD> InformaŃie de formatare HTML
<Hn> </Hn> Nivelul de subtitlu al documentului (n= 1-6)
<HR> Riglă orizontală
<HTML> </HTML> Defineşte un fişier în format Web
<P> Paragraf nou
<PRE> </PRE> InformaŃie preformatată
Marcaje logice
Marcaj Marcaj de SemnificaŃie
HTML închidere
<CITE> </CITE> Citare bibliografică
<CODE> </CODE> Listing de program
<DFN> </DFN> DefiniŃie de cuvânt
<KBD> </KBD> Text de la tastatură
<SAMP> </SAMP> Exemplu de date introduse de utilizator
<VAR> </VAR> Program sau variabilă
- 32 -
PROGRAMARE HTML, XML
HTML închidere
<B> </B> Afişează text îngroşat
<I> </I> Afişează text înclinat
<U> </U> Afişează text subliniat
<TT> </TT> Text cu font monospaŃiu
<CITE> </CITE> Citare bibliografică
<CODE> </CODE> Listing de program
<DFN> </DFN> DefiniŃie de cuvânt
<EM> </EM> Stil logic de evidenŃiere
<KBD> </KBD> Text de la tastatură
<SAMP> </SAMP> Exemplu de date introduse de utilizator
<STRONG> </STRONG> EvidenŃiere logică puternică
<VAR> </VAR> Program sau variabilă
<BASEFONT Specifică dimensiunea implicită a fontului din
pagină
<FONT> </FONT> Specifică atribute ale textului încadrat
Dimensiunea textului este 1:7, cu 7 cea mai
SIZE=n mare
Specifică fontul: a, dacă este disponibil, sau b
FACE=″a,b″
Culoarea textului: fie un nume de culoare, fie
COLOR=s o valoare RGB
- 33 -
PROGRAMARE HTML, XML
- 34 -
PROGRAMARE HTML, XML
- 35 -
PROGRAMARE HTML, XML
- 36 -
PROGRAMARE HTML, XML
- 37 -
PROGRAMARE HTML, XML
- 38 -
PROGRAMARE HTML, XML
″.″)
ALIGN=justify Aliniază atât marginea din
stânga, cât şi din dreapta a unui
tabel
<COLGROUP> </COLGROUP> Specifică un număr de definiŃii
de coloane raelizate cu ajutorul
marcajelo COL
<COL Defineşte o anumită lăŃime de
coloană
WIDTH=x LăŃimea unei coloane
<THEAD> </THEAD> Organizarea tabelelor: acest
marcaj defineşte titlul tabelului
<TBODY> </TBODY> Defineşte corpul tabelului
<FRAMESET
BORDER=x Specifică starea ″on″ sau ″off″
pentru chenarul cadrului (1 sau
0)
FRAMEBORDER=x Specifică mărimea chenarului
FARMESPACING=x Mărimea spaŃiului dintre două
cadre adiacente
<FRAME
MARGINHEIGHT=x SpaŃiul suplimentar de deasupra
şi de dedesubtul unui anumit
cadru
MARGINWIDTH=x SpaŃiul suplimentar de la stânga
şi la dreapta unui anumit cadru
<IFRAME Cadru intern
SRC=url Sursa cadrului
NAME=s Numele ferestrei
- 39 -
PROGRAMARE HTML, XML
- 40 -
PROGRAMARE HTML, XML
- 41 -
PROGRAMARE HTML, XML
- 42 -
PROGRAMARE HTML, XML
- 43 -
PROGRAMARE HTML, XML
ANEXA 2
Culoare Nume culoare Cod culoare
AliceBlue #F0F8FF
AntiqueWhite #FAEBD7
Aqua #00FFFF
Aquamarine #7FFFD4
Azure #F0FFFF
Beige #F5F5DC
Bisque #FFE4C4
Black #000000
BlanchedAlmond #FFEBCD
Blue #0000FF
BlueViolet #8A2BE2
Brown #A52A2A
BurlyWood #DEB887
CadetBlue #5F9EA0
Chartreuse #7FFF00
Chocolate #D2691E
Coral #FF7F50
CornflowerBlue #6495ED
Cornsilk #FFF8DC
Crimson #DC143C
Cyan #00FFFF
DarkBlue #00008B
DarkCyan #008B8B
DarkGoldenRod #B8860B
DarkGray #A9A9A9
- 44 -
PROGRAMARE HTML, XML
DarkGreen #006400
DarkKhaki #BDB76B
DarkMagenta #8B008B
DarkOliveGreen #556B2F
Darkorange #FF8C00
DarkOrchid #9932CC
DarkRed #8B0000
DarkSalmon #E9967A
DarkSeaGreen #8FBC8F
DarkSlateBlue #483D8B
DarkSlateGray #2F4F4F
DarkTurquoise #00CED1
DarkViolet #9400D3
DeepPink #FF1493
DeepSkyBlue #00BFFF
DimGray #696969
DodgerBlue #1E90FF
Feldspar #D19275
FireBrick #B22222
FloralWhite #FFFAF0
ForestGreen #228B22
Fuchsia #FF00FF
Gainsboro #DCDCDC
GhostWhite #F8F8FF
Gold #FFD700
GoldenRod #DAA520
Gray #808080
- 45 -
PROGRAMARE HTML, XML
Green #008000
GreenYellow #ADFF2F
HoneyDew #F0FFF0
HotPink #FF69B4
IndianRed #CD5C5C
Indigo #4B0082
Ivory #FFFFF0
Khaki #F0E68C
Lavender #E6E6FA
LavenderBlush #FFF0F5
LawnGreen #7CFC00
LemonChiffon #FFFACD
LightBlue #ADD8E6
LightCoral #F08080
LightCyan #E0FFFF
LightGoldenRodYellow #FAFAD2
LightGrey #D3D3D3
LightGreen #90EE90
LightPink #FFB6C1
LightSalmon #FFA07A
LightSeaGreen #20B2AA
LightSkyBlue #87CEFA
LightSlateBlue #8470FF
LightSlateGray #778899
LightSteelBlue #B0C4DE
LightYellow #FFFFE0
Lime #00FF00
- 46 -
PROGRAMARE HTML, XML
LimeGreen #32CD32
Linen #FAF0E6
Magenta #FF00FF
Maroon #800000
MediumAquaMarine #66CDAA
MediumBlue #0000CD
MediumOrchid #BA55D3
MediumPurple #9370D8
MediumSeaGreen #3CB371
MediumSlateBlue #7B68EE
MediumSpringGreen #00FA9A
MediumTurquoise #48D1CC
MediumVioletRed #C71585
MidnightBlue #191970
MintCream #F5FFFA
MistyRose #FFE4E1
Moccasin #FFE4B5
NavajoWhite #FFDEAD
Navy #000080
OldLace #FDF5E6
Olive #808000
OliveDrab #6B8E23
Orange #FFA500
OrangeRed #FF4500
Orchid #DA70D6
PaleGoldenRod #EEE8AA
PaleGreen #98FB98
- 47 -
PROGRAMARE HTML, XML
PaleTurquoise #AFEEEE
PaleVioletRed #D87093
PapayaWhip #FFEFD5
PeachPuff #FFDAB9
Peru #CD853F
Pink #FFC0CB
Plum #DDA0DD
PowderBlue #B0E0E6
Purple #800080
Red #FF0000
RosyBrown #BC8F8F
RoyalBlue #4169E1
SaddleBrown #8B4513
Salmon #FA8072
SandyBrown #F4A460
SeaGreen #2E8B57
SeaShell #FFF5EE
Sienna #A0522D
Silver #C0C0C0
SkyBlue #87CEEB
SlateBlue #6A5ACD
SlateGray #708090
Snow #FFFAFA
SpringGreen #00FF7F
SteelBlue #4682B4
Tan #D2B48C
Teal #008080
- 48 -
PROGRAMARE HTML, XML
Thistle #D8BFD8
Tomato #FF6347
Turquoise #40E0D0
Violet #EE82EE
VioletRed #D02090
Wheat #F5DEB3
White #FFFFFF
WhiteSmoke #F5F5F5
Yellow #FFFF00
YellowGreen #9ACD32
- 49 -
PROGRAMARE HTML, XML
- 50 -