online: 7; azi: 934; total: 51389 Webdesign - Html - 16

De la HTML la XHTML

Explicatiile din acest tutorial sunt pentru cei care cunosc deja limbajul HTML, prezentat detaliat in lectiile si tutorialele precedente din acest curs.
XHTML (eXtensible HyperText Markup Language) are acelasi rol si capacitati ca HTML, fiind o varianta avansata a acestuia, dar cu o sintaxa putin diferita, mai stricta.
XHTML este un inlocuitor modern al HTML-ului, o combinatie intre HTML si XML, fiind aproape identic cu HTML 4.01.
Principala diferenta ce trebuie avuta in vedere la XHTML fata de HTML este la sintaxa acestuia.
Daca stiti deja limbajul HTML, respectand regulile de sintaxa XHTML, prezentate mai jos, se poate spune ca stiti si XHTML.

Reguli de sintaxa XHTML

1. - Pentru ca un document XHTML sa fie considerat valid, acesta trebuie sa aibe la inceput (prima linie) o declaratie !DOCTYPE, un DTD (Document Type Definitions) ce contine regulile standard ale elementelor din pagina.
Sunt 3 tipuri de DTD ce pot fi folosite: Strict, Transitional si Frameset. Iata cod-ul specifc fiecaruia, ce trebuie sccris in prima linie din pagina:
  • Strict - folosit pentru o sinntaxa stricta, fara vreun element ce nu e specific XHTML.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>

  • Transitional - este tipul cel mai comun si indicat. Acesta permite in pagina si elemente HTML ce nu sunt stricte XHTML.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

  • Frameset - mai putin folosit, acest tip e pentru cazuri cand in pagina se folosesc frame-uri.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd";>

Dupa una din aceste declaratii se adauga codul pentru structura documentului XHTML, cum se vede in urmatorul exemplu (structura standard ce trebuie sa o aibe o pagina de site XHTML):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ro">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Titlul paginii</title>
<meta name="description" content="Descrierea paginii" />
<meta name="keywords" content="cuvinte, principale, din, pagina" />
</head>
<body>
Continutul paginii, care apare in fereastra navigatorului web.
</body>
</html>

2. - Toate elementele si atributele trebuie scrise cu litera mica.
  • Corect: <div>     Incorect: <DIV>
  • Corect: <tag atribut="valoare">     Incorect: <tag Atribut="valoare">

3. - Valorile tuturor atributelor trebuie scrise intre ghilimele.
  • Corect: <tag width="80">
  • Incorect: <tag width=80>

4. - Spre deosebire de HTML, in care elementele sunt inchise cu un al doilea tag (identic) de inchidere, iar unele nici nu trebuie sa aibe inchidere, in XHTML toate elementele trebuie inchise si exista tag-uri specifice care au inchidere singulara, in acelasi tag.
In XHTMLIn HTML
<meta ... /><meta ...>
<br /><br>
<hr /><hr>
<input /><input>
<img ... /><img ...>
- Celelalte, precum <p> </p>, <div> </div>, <span> </span>, ... etc. sunt la fel.

5. - La inchiderea tag-urilor trebuie sa se respecte ordinea simetrica de deschidere.
  • Corect: <b>Ceva <i>altceva</i></b>
  • Incorect: <b>Ceva <i>altceva</b></i>

6. - Toate atributele trebuie sa fie insotite de o valoare. In HTML fiind atribute, precum "checked", care sunt scrise fara vreo valoare. Iata cateva din cele mai folosite:
In XHTMLIn HTML
checked="checked"checked
declare="declare"declare
readonly="readonly"readonly
disabled="disabled"disabled
selected="selected"selected
nowrap="nowrap"nowrap
noresize="noresize"noresize

7. - Atributul name din tag-urile <a> si <map> a fost inlocuit cu id.