HTML/XHTML

Introducere

Dacă ați navigat pe Internet pentru câteva minute, mai mult ca sigur că ați auzit de HTML.

Unelte

În cazul cel mai simplu, unica unealtă de care aveți nevoie - excepție făcând calculatorul - este un editor de text și un Browser Web. Dacă folosiți unul din următoarele sisteme de operare

Windows - se poate utiliza Notepad sau Wordpad
Mac - se poate utiliza SimpleText sau BBEdit
Linux - aici gama fiind foarte larga, cateva fiind VI, Emacs, GEdit (TextPad, PFE - Programmer's File Editor, HomeSuite ?).

Pentru începători însă, sau dacă doriți să aveți spor, este recomandat sa folosiți un editor HTML grafic. Dintre acestea, unele sunt gratuite sau cu cod sursă liberă (de exemplu NVU/Kompozer sau editorul integrat al suitei Mozilla sau Netscape) iar altele sunt oferte comerciale care pot costa sume frumoase (probabil unul dintre cele mai cunoscute/renumite fiind DreamWeaver)

De menționat sunt:

Notepad++ - [1]
Macromedia Homesite
Dreamweaver
Nvu sau Kompozer

Primul exemplu

Pentru a crea primul dumneavoastră fișier HTML trebuie sa urmăriți pașii descriși în cele ce urmează:

deschide un editor de texte
copiaza sau scrie codul de dedesubt
salvează fișierul cu extensie htm sau html
lanseaza un Browser și deschide fișierul proaspăt creat/salvat

<html>
<head>
<title>Titlu paginii!</title>
</head>
<body>
<H1>Primul exemplu</H1>
Aceasta este prima mea pagină. <b>Acesta este un text îngroșat.</b>
</body>
</html>

Cuvintele "etichetă" ajuta la organizarea si prezentarea conținutului documentului. Daca ne uităm la exemplul de mai sus:

- eticheta <html> ne atrage atenția că avem de a face cu un fișier de tip html, care va trebui citit folosind un "browser"

- prima secțiune a fișierului este marcată de eticheta <head> (sau "antet", in românește). In aceasta secțiune, avem o etichetă care declară titlul documentului (de obicei acesta apare în bara de sus a browser-ului, deasupra meniului). In exemplul nostru, pagina este intitulata "Titlu paginii!". Tot in antet, de obicei mai apar programe script sau declarații css (cascade style sheet). Nu avem însă așa ceva în acest prim exemplu.

- antetul se termină cu o etichetă aproape identică cu eticheta cu care a început: </head>

- conținutul propriu zis care va apare în fereastra principală este delimitat de etichetele <body> și respectiv </body>

- ultima eticheta </html> ne informează că fișierul se termină.

La o examinare mai atentă a conținutului din exemplul nostru (textul delimitat între etichetele <body> .. </body>) descoperim o eticheta gen "header" care accentueaza textul din interior ( "Primul exemplu" apare mare și îngroșat !). Singura altă etichetă folosită este <b> .. </b> (din engleză, de la bold = text îngroșat) și este ușor de ghicit pentru ce este folosită.