Partea I HTML

Pagini Web e-Learning
PARTEA I LIMBAJUL HTML Capitolul 1 DESCRIERE GENERAL A LIMBAJULUI HTML 1.1 Ce este HTML?
HTML e un limbaj de marcare, introdus de Tim Berners-Lee (programator englez, inventator al World Wide Web-ului). HTML este un limbaj standardizat, aceasta nsemnnd c orice browser poate interpreta i afia corect un document Web. Sintaxa de baz a limbajului HTML este definit n versiunea HTML 3.2. Cu ajutorul limbajului HTML ( Hyper Text Markup Language) se pot construi pagini Web nu foarte pretenioase, el reprezentnd un nceput pentru realizarea site-urilor profesionale. Paginile Web sunt fiiere cu extensia .html sau .htm care se afl, de obicei, pe serverele de internet, dar care se pot afla i pe calculatorul personal. Paginile Web se vizualizeaz cu ajutorul unor programe speciale, numiten browsere (de ex. Internet Explorer, Firefox, etc.).
1.2 Crearea unei pagini Web simple

O pagin Web poate conine: text imagini fiiere audio fiiere video ntr-un fiier html, se pot include: programe n JavaScript scripturi CSS tag-uri care s seteze parametrii unui applet (program scris n Java).
1.2.1 Editarea unui document html

Un fiier html se poate realiza: manual, scriind tag dup tag n Notepad, Wordpad; folosind unui editor HTML. Acest tip de editoare dedicate ofer faciliti n scrierea codului, realizeaz corectarea documentului din punct de vedere sintactic i chiar scriu secvene de cod pentru anumite elemente pe care autorul doreste s le insereze n document. folosind un editor de tip WYSIWYG (What You See Is What You Get ), precum
Microsoft Frontpage, Macromedia Dreamweaver, Netscape Composer, Nvu 1.0.

Editoarele faciliteaza munca proiectantului, dar nu l nva pe un nceptor limbajul HTML. Editoarele HTML insereaz codul HTML n documentul propriu - de aceea nu este necesar cunoasterea codului HTML - i permit att adugarea, tergerea i modificarea textului, ct i inserarea imaginilor, tabelelor i intelor (targets), iar apoi publicarea paginii pe Internet.

HTML utilizeaz etichete, acestea fiind numite i balize, elemente sau tag-uri. Sintaxa unei etichete este: <tag atribut1="val" atribut2="val">Text</tag> n unele cazuri, atributele pot lipsi. n altele, poate lipsi eticheta de nchidere: </tag>. Etichetele HTML sunt de dou tipuri: etichete container etichete vide Etichetele container sunt de forma: <tag> </tag> unde: <tag> - marcheaz nceputul unui bloc </tag> - marcheaz sfritul blocului Ele sSpecific formatul n care va fi afiat textul coninut ntre eticheta de nceput i cea de final. Majoritatea etichetelor sunt de acest tip. O particularitate a etichetelor container este c, n cazul unora dintre ele, prezena etichetei de nchidere (</tag>) este opional. Etichetele vide au forma: <tag> Acest tip de etichete nu se refer la formatul textelor, ci la introducerea anumitor elemente, ca de exemplu: paragrafe, sfrit de linie, linii orizontale i altele, dau indicaii browserului despre ce element este vorba i despre cum s afieze acel element. Etichetele vide nu au etichet de nchidere. HTML-ul e independent de platform i nu e un limbaj case-sensitive, aa c putem scrie la fel de bine <TAG>, <tag>, <Tag> sau <tAg> etc., pentru c n HTML nu se face distincia ntre literele mari i cele mici.
1.2.2 Structura unui document html

Orice fiier ncepe cu eticheta <html> i se termin cu eticheta </html>. Fiierul e compus din: antet, inclus ntre etichetele <head> i </head> corp, inclus ntre etichetele <body> i </body> Antetul conine titlul documentului precum i alte informaii privind documentul. n antetul documentului se mai insereaz i anumite secvene de program (scripturi), care se execut la ncrcarea documentului n browser. Corpul delimiteaz coninutul propriu-zis al documentului i este inclus ntre etichetele <body> ... </body>. Prezentm semnificaia etichetelor menionate i care fac parte din structura oricrui document HTML: <html> ... </html> ntre aceste etichete este inclus ntregul document HTML. Ele comunic browserului unde ncepe i unde se termin documentul. <head> ... </head> ntre aceste etichete sunt incluse titlul, deja menionat, precum i alte informaii despre documentul HTML. <title> ... </title> Stabilete titlul documentului HTML, ntre acestea se va trece numele fiierului. Acest nume nu va fi afiat n fereastr, ci deasupra barei de meniuri. <body> ... </body> Conine descrierea textului i elementelor paginii. n corpul documentului se stabilesc, deci, aspectul i coninutul paginii Web. Elementele coninute n aceast seciune sunt vizibile n pagin.
Pagini Web e-Learning Exemplu: pagin Web care conine doar un simplu text, titlul documentului este stabilit cu
ajutorul etichetei <title>
Codul HTML Afiare n browser
<html> <head> <title>HTML</title> </head> <body> Acesta este o pagina Web. </body> </html>
1.2.3 Atribute
Etichetele HTML pot avea atribute. Atributele reprezint o caracteristic a unei etichete. Acestea furnizeaz informaii suplimentare despre elementele HTML din document (pagina HTML). Eticheta <body> definete elementul "body" al unei pagini HTML. Dac dorim ca fundalul paginii sa fie de culoare roie, vom utiliza atributul "bgcolor" pentru a transmite navigatorului s utilizeze aceast culoare pentru fundal. Acest lucru se realizeaza astfel: <body bgcolor="blue"> Eticheta <table> definete un tabel HTML. Dac dorim ca acest tabel sa nu aib borduri vom utiliza atributul border, dup cum se poate observa n continuare: <table border="0"> Acest atribut va transmite navigatorului c tabelul din pagina respectiv nu are borduri (are grosimea bordurii egal cu zero). Atributele sunt ntotdeauna formate dintr-o pereche "nume/valoare" de tipul nume="valoare" i sunt introduse mereu n eticheta de start al unui element HTML. ntotdeauna atributele trebuie nchise ntre ghilimele (bgcolor="red"). Ghilimelele duble (" ") sunt cel mai des utilizate, dar este permis i utilizarea ghilimelelor simple (' '). n unele cazuri (atunci cnd valoarea unui atribut conine ea nsi ghilimele, este necesar s utilizm ghilimelele simple, dup cum se poate observa n continuare: name='Vasile "Geo" Georgel'
1.2.4 Culori
Culoarea reprezint o caracteristic extrem de important a unei pagini Web. Utilizat cu grij i msur, ea poate mbunti substanial aspectul paginii, fcnd-o mai lizibil i mai atractiv, iar textul mai uor de parcurs. Pe de alt parte, utilizarea excesiv a culorilor poate transforma un text de calitate ntr-unul greu de urmrit, i care i va determina pe muli vizitatori s renune la a-l mai parcurge.

Culorile pot fi utilizate pentru a defini un fundal (background), culoarea textului sau culori ale unor obiecte din pagina Web. Culoarea poate fi definit prin: Nume culoare (n limba englez) fiind disponibile 16 culori standard: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow. Codul RGB (Red, Green, Blue). Conform acestui cod, o culoare poate fi obinut prin amestecarea a trei culori fundamentale: Red (rou), Green (verde) i Blue (albastru), specificndu-se cantitile de rou, verde i albastru din culoarea dorit. Cantitile pot fi specificate: Procentual de exemplu pentru culoarea roie avem codul: <font color= rgb (100%, 0%, 0%)>; Sub forma unui numr cuprins ntre 0 si 255; de exemplu, pentru aceeai culoare roie avem codul: <font color=rgb(255, 0, 0)> Hexazecimal, prin transformarea acestor valori n baza 16. Aceste valo ri se alipesc i li se adaug semnul #, adic vom avea construcia "#RRGGBB". Pentru culoarea roie, codul este <font color=#ff0000> unde: ff=255 (red), 00=0 (green) i 00=0 (blue). Tabelul 1.1 Codul hexazecimal
0 0
1 1
2 2
3 3
4 4
5 5
6 6
7 7
8 8
9 9
10 11 12 13 14 15 A B C D E F
Codul pentru verde pur este #00FF00 iar pentru albastru este #0000FF. Exist culori care vor fi afiate de majoritatea browserelor (culori sigure). Dac pentru fondul paginii Web ai folosit o anumit culoare, dar nu ai verificat dac aceasta face parte din culorile sigure, atunci exist posibilitatea ca unii dintre vizitatorii paginii Web s vad o cu totul alt culoare. Tabelul 1.2 Codul culorilor sigure
Color
Hexa
Color
Hex
Color
Hex
Color
Hex
aqua #00FFFF green #008000 navy #000080 silver #C0C0C0
black #000000
gray
#808080 olive #808000 teal
#008080
blue
#0000FF
lime
#00FF00 purple #800080 white #FFFFFF
fuchsia #FF00FF maroon #800000
red
#FF0000 yellow #FFFF00

Partea I HTML

Î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

Partea I HTML

Încărcat de

Drepturi de autor:

Formate disponibile

Pagini Web e-Learning

1.2 Crearea unei pagini Web simple

1.2.1 Editarea unui document html

Microsoft Frontpage, Macromedia Dreamweaver, Netscape Composer, Nvu 1.0.

Pagini Web e-Learning

1.2.2 Structura unui document html

Pagini Web e-Learning

aqua #00FFFF green #008000 navy #000080 silver #C0C0C0

#808080 olive #808000 teal

#00FF00 purple #800080 white #FFFFFF

fuchsia #FF00FF maroon #800000

#FF0000 yellow #FFFF00

Pagini Web e-Learning

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