Sunteți pe pagina 1din 30

HTML

Hypertext Markup Language

Este un limbaj de marcare utilizat pentru crearea paginilor web ce pot fi afiate ntr-un browser (sau navigator).

Un limbaj de marcare combin text i informaii suplimentare despre acel text. Informaiile suplimentare (de exemplu despre structura sau prezentarea textului) sunt exprimate utiliznd marcatori (sau instruciuni de marcare).

Caracteristici HTML
independena fa de platform
un document poate fi afisat in mod asemanator de computere diferite

structurarea formatrii
permite convertirea acestora dintr-un format in altul

legturile hipertext
orice cuvnt, fraza, imagine poate face referin la un alt document

Formatul ASCII al HTML-ului


Fiierele HTML trebuie salvate ntr-un format text standard, adesea cunoscut drept formatul ASCII.

Acest lucru se face cel mai simplu ntr-un program de tip notepad
Dac preferai s folosii un procesor precum Microsoft Word pentru a scrie codul html, putei face acest lucru dar trebuie s salvai fiierul ca text sau text only Dac folosii un procesor word i uitai s l salvai ca text atunci vei vedea doar nite date inutilizabile cnd ncercai s deschidei pagina ntr+un browser web.

Gsirea unei gazde pentru site


Propriul dumneavoastr server web
-scump i complicat

Free Hosts
-spaiu limitat (20MB) -limitarea numrului de vizitatori ntr-o lun -ads i pop-up windows -Ex. www.geocities.com

Domain hosts
- 5-10$/ lun spaiu pn la 20 GB

Scrierea documentelor HTML


Dupa ce v-ati gsit un host pentru a va plasa site-ul sau pagina web, putei ncepe crearea paginilor.
Este indicat de a avea 2 copii a documentului.

O copie trebuie s fie pe spaiul alocat de host iar a doua pe hard


Se recomand crearea unui director pe hard disk pentru a pune in el documentele HTML, imaginile , sunetele care doriti sa apar pe site. Uploadul fiierelor pe site prin ftp.

Index.html

Pagina principala trebuie denumita "index.html", majoritatea serverelor fiind setate sa recunoasca pagina principala dupa aceasta denumire.

Structura unui document .html


Orice document HTML incepe cu notaia <html> si se termina cu notaia </html>. TAG Prin conventie, toate informatiile HTML incep cu o paranteza unghiulara deschisa "<" si se termina cu o paranteza unghiulara inchisa ">". Tag-urile intre aceste paranteze transmit comenzi catre browser pentru a afisa pagina intr-un anumit mod. Intre cele doua marcaje <html> si </html> vom introduce doua sectiuni: - sectiunea de antet <head>...</head> - corpul documentului <body>...</body>. Blocul <body>...</body> cuprinde continutul propriu-zis al paginii HTML, adic ceea ce va fi afisat in ferastra browser-ului. Un tag poate fi scris atat cu litere mici, cat si cu litere mari. <HTML> = <HtmL> = <html>. Caracterul "spaiu" ce apare ntre etichete este ignorat de catre browser.

Structura unui document .html


<html> <head> <title>Aceasta este prima mea pagina de Web</title> </head> <body> Bine ati venit in pagina mea de Web! </body> </html>

<html> <head> <title>Aceasta este prima mea pagina de Web</title> </head> <body> Bine ati venit in pagina mea de Web! </body> </html> Dup o modificare n notepad: Save, apoi Refresh web page

Heading-uri
Heading-uri... Heading-urile sunt unele dintre cele mai importante taguri din continutul (body) al unui document HTML.

Tagul de deschidere pentru heading este <hn> si cel de inchidere fiind </hn> unde "n" reprezinta marimea heading-ului; acesta variand de la 1 la 6 (1 fiind cel mai mare iar 6 cel mai mic).

Heading-uri

Linii orizontale
Liniile orizontale sunt folosite pentru a separa diferite arii intr-o pagina web. Tagul pentru linie orizontala este <hr>, nu are tag de inchidere. I se pot adauga acestui tag diferite atribute, width=n (pentru lungimea liniei) width=n% (pentru lungimea liniei raportate la toata lungimea ecranului) size=n (pentru linie ingrosata dar transparenta) noshade (pentru linie ingrosta plina).

Linii orizontale
<hr width=50>

<hr width=40%>

<hr size=8> <hr noshade>

Se pot folosi mai multe atribute intr-un tag.

<hr width=60% size=12 noshade>

Paragrafe
Tagul de deschidere pentru paragraf este <p>, iar cel de inchidere este </p>. Tagul de inchidere pentru paragraf nu este intotdeauna necesar dar se recomanda folosirea lui.
<p> Primele specificatiile de baza ale Web-ului au fost HTML, HTTP si URL. HTML a fost dezvoltat initial de Tim Berners-Lee la CERN in 1989.</p> <p> HTML a fost vazut ca o posibilitate pentru fizicienii care utilizeaza computere diferite si schimbe intre ei informatie utilizind Internetul. .</p>

Formatarea textului
O pagina web fr un format anume al textului va arta plictisitoare. De aceea se folosesc aceste taguri pentru text (bold, italice, subliniat). Cteva taguri cunoscute pentru formatul textului sunt <b> si </b> pentru bold, <i> si </i> pentru italice, <u> si </u> pentru subliniat. Pentru dimensiunea textului se folosesc tagurile <font size=n> si </font>.
<b>Microsoft Office</b> <i>este</i> <u>un software</u> <font size=+2>foarte util.</font>

Atribute de aliniere in pagin


Multe taguri suport atribute de aliniere n pagin; aliniere la stnga, n centru, la dreapta. Atributul align se ataseaza tagului de deschidere inaintea semnului >.
<h2 align=left>Aliniere stanga</h2> <h2 align=center>Aliniere centru</h2: <h2 align=right>Aliniere dreapta</h2>

Sfritul rndului
Tagul pentru sfrit de rnd este <br>. Acest tag nu are un altul pentru nchidere.
Exemplu fara tag de sfarsit de rand: Un elev. Doi elevi. Trei elevi. Sursa: Un elev. Doi elevi. Trei elevi.
Exemplu cu tag de sfarsit de rand: Un elev. Doi elevi. Trei elevi. Sursa: Un elev.<br> Doi elevi.<br> Trei elevi.<br>

Culoarea de fond
O culoare poate fi precizata in doua moduri:
Printr-un nume de culoare. Sunt disponibile cel putin 16 nume de culori: aqua, black, fuchsia, gray, green lime, maroon, navy, olive, purple, red, silver, teal, white si yellow.

Prin constructia " #rrggbb " unde r (red), g (green), sau b (blue) sunt cifre hexazecimale si pot lua valorile

Codul hexadecimal
#FFFFFF alb, #000000 negru.

Fiecare cod hexadecimal este impartit in 3 grupe: - #XXxxxx - Tenta de rosu - #xxXXxx - Tenta de verde - #xxxxXX - Tenta de albastru
. Sistemul de culori hexadecimal consta in unitatile 0 1 2 3 4 5 6 7 8 9 A B C D E F, 0 fiind valoare nula, iar F valoarea cea mai mare.

Culoarea de fond
Culoarea unei pagini se precizeaza prin intermediul unui atribut al etichetei <body>.

Culoarea fondului paginii web se stabileste cu atributul bgcolor al etichetei <body>, de exemplu: <body bgcolor = culoare>.

Culoarea textului
Acest lucru se face prin intermediul atributului text al etichetei <body> dupa sintaxa <body text=culoare>. sau utiliznd atributul font color= <html> <head> <title>culoare textului </title> </head> <body text=red> Un text de culoare rosie. </body> </html>

<html> <head> <title>culoare de fond </title> </head> <body bgcolor=gray> O pagina Web cu fondul GRI! </body> </html>

Linkuri
Link-urile sunt esenta webului, fara acestea paginile unui sit nu ar avea legatura intre ele. Pentru a adauga un link se foloseste tagul de deschidere <a href="locatie"> si tagul de inchidere </a>.

Tot ce va aparea intre aceste doua taguri va fi subliniat si colorat, iar in momentul click-ului pe acel text, browser-ul va fi trimis spre locatia data.

Linkuri
<html> <head> <title>Aceasta este prima mea pagina de Web</title> </head> <body> <h2> Viziteaza <a href="http://www.uaic.ro/">Universitatea Alexandru Ioan Cuza</a> </h2> </body> </html>

Linkuri
Link-urile pot fi folosite si pentru trimiterea e-mail-urilor. Exemplu: Daca intimpinati probleme cu privire la limbajul HTML trimitetimi un e-mail! Sursa: Daca intimpinati probleme cu privire la limbajul HTML trimitetimi un <a href="cristian.enachescu@uaic.ro">e-mail</a>!

Referinte pentru studiu suplimentar


http://www.worklance.com/htmltutorial/ (limba romana)

http://www.davesite.com/webstation/html/ (limba engleza)