XHTML: Suflul schimbării
XHTML este o reeditare a „bătrânului” HTML. Articolulul se vrea o mică introducere în acest limbaj (pentru începători), și un ghid de migrare HTML - XHTML (pentru cei care sunt ceva mai „versați”).
Autor: M. Sunny
Cu toții știm ce amploare a luat astăzi Internetul. Pornită de la o mică rețea academică sub tutela ARPA, această „rețea a rețelelor” a ajuns practic o „media” care nu mai poate fi ignorată. Un mare aport la acest imens „boom” l-a avut HTML, limbajul de descriere a paginilor Web.
Începuturile
Internetul a devenit o necesitate
Limbajul HTML este un subset al SGML[1]. Față de SGML, HTML este mult simplificat și adaptat pentru afișarea pe ecran. Elementul de noutate l-au constituit hyperlink-urile[2]. Dacă ați navigat măcar o dată printr-o pagină WWW, știți foarte bine cât de utile sunt acele link-uri.
Limbajul inițial a fost creat pentru scopuri academice. În afară de introducerea de hyperlink-uri nu avea prea multe facilități. Însă în momentul în care companiile comerciale au început să activeze în această rețea, a devenit repede clar că HTML trebuie să evolueze.
A urmat o perioadă de dezvoltare destul de haotică. Practic fiecare producător de browsere (programele pe care le folosiți pentru a vizualiza paginile de Internet) introducea în HTML facilitățile de care avea nevoie. Web designerii se aflau deseori în poziția ingrată de a construi pagina pentru a fi vizualizată într-un anumit browser. În paginile construite prin 1996 apăreau adesea bannere care recomandau folosirea lui Netscape Navigator sau Internet Explorer (două dintre browserele rivale).
W3C intervine
W3C, organizația responsabilă cu standardizarea HTML (și a altor limbaje legate de WWW), a dus o luptă pe două fronturi. A încercat să convingă atât producătorii de browsere cât și web designerii să suporte standardele W3C, și să nu mai folosească elemente specifice doar unui anumit browser.
XHTML este ultimul produs al acestor eforturi de standardizare. Spre deosebire de HTML (care este bazat pe SGML), XHTML se bazează pe XML. XML se aseamănă foarte mult cu SGML, dar este mai strict. Un program care proceseaza documente XML trebuie (teoretic) să se oprească în momentul în care descoperă faptul că documentul nu este valid. Evident, browserele din ziua de astăzi nu se comportă așa, pentru că comunitatea WWW așteaptă compatibilitate inversă cu HTML. Din această strictețe, derivă avantajul XML: este mai ușor de procesat, chiar în condiții „vitrege” (memorie puțină și capacitate redusă de procesare). XML are și un alt avantaj: este extrem de popular. Marile companii din industria software (Microsoft, Sun etc) au depus eforturi pentru a asigura larga acceptare a acestui standard.
Limbajul
XHTML folosește tag-uri[3] pentru a structura documentul. Deosebirile față de HTML (deosebiri care derivă din faptul că XHTML este bazat pe XML) sunt următoarele:
Tag-urile (și atributele lor) se scriu cu litere mici (XML este case-sensitive)
Toate tag-urile trebuie închise
Valorile atributelor trebuie închise în ghilimele
Pentru lămurire cred că este foarte nimerit un mic exemplu.
Exemplul 1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Acesta este titlul documentului</title>
</head>
<body>
<h1>Acesta este titlul documentului</h1>
<p>Acesta este un paragraf de text <img src="bullet.gif" alt="Bullet" /></p>
</body>
</html>Să analizăm puțin acest exemplu.
Primele două linii (de fapt se pot scrie pe o singură linie, dar eu nu am avut suficient spațiu), reprezintă o declarație ce informează browser-ul că urmează un document XHTML 1.0 Strict. Probabil vi se pare că declarația arată destul de feroce, dar practic nu trebuie decât să o scrieți la începutul documentului (copy/paste) fără să vă bateți prea tare capul în legătură cu semnificația ei. Scrierea acestei declarații este totuși necesară. Dacă o omiteți este posibil ca documentul să nu fie afișat corect.
Urmează apoi documentul propriu-zis cuprins în tag-ul <html>. Observați la sfârșitul documentului </html>. Acela este marcajul de închidere. Documentul este structurat în două mari părți: head și body.
Header-ul documentului (<head> … </head>) conține diverse declarații. Observați de exemplu elementul title care conține titlul ce va fi afișat în titlebar-ul browser-ului. Tot aici se pot include stiluri, scripturi, diverse meta tag-uri ce pot conține o descriere a paginii, informații despre autor, cuvinte cheie, etc.
Standardizarea
Pentru mulți web designeri scrierea de documente conforme cu standardele este o bătaie de cap inutilă. În cazul paginilor nestandard browserele care rulează pe PC-uri își permit să încerce să „ghicească” ce a vrut de fapt autorul să scrie (din cauza asta de multe ori rezultatul apare diferit în browsere diferite).
Închipuiți-vă însă un browser Opera care rulează pe un telefon. Un asemenea browser (care are resurse limitate) nu tolerează foarte bine „scăpările” autorului, și pot apărea surprize.
Cea mai importantă secțiune este însă <body>, care conține informațiile ce vor fi afișate practic în fereastra browser-ului. În exemplul 1 acestă secțiune cuprinde un heading de nivel 1 (h1), și un paragraf (p). Heading-urile sunt titluri. Nivelul lor specifica importanța. De exemplu puteți folosi h1 pentru titluri și h2 pentru subtitluri (heading-urile merg până la h6). Tag-ul <p> conține atât text, cât și un tag care pare ceva mai „ciudat” (este vorba de tag-ul <img>). Acest tag are două atribute: src – imaginea ce va fi afișată (în cazul nostru bullet.gif), și alt – un text ce este afișat de browserele care nu pot afișa imagini (ex: browserele în mod text); acest text este afișat și de browserele grafice dacă dintr-un motiv sau altul nu pot afișa bullet.gif. Cum acest tag nu conține nici un text, tag-ul de sfârșit (</img>) lipsește. Spuneam totuși mai sus că în XHTML toate tag-urile trebuie închise. Tag-urile care nu conțin text (și nu conțin nici alte tag-uri) se închid prin includerea unui slash înainte de a doua paranteză unghiulară: <img />.
Limbajul XHTML conține un set destul de mare de tag-uri, dar scopul acestui articol nu este prezentarea lor detaliată. Dacă doriți să învățați XHTML mai în profunzime, parcurgeți tutorialele de pe pagina W3Schools.
Accesibilitate
Accesibilitatea se referă (printre altele) la structurarea documentelor în așa fel încât browsere mai „speciale” să le poată folosi. Și când spun asta mă refer mai ales la browserele în mod text (de exemplu lynx), și la voice browsere (genul de programe pe care le folosesc persoanele cu deficiențe vizuale, programe care citesc conținutul paginii). Să luăm două exemple.
Exemplul 2
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Acesta este titlul documentului</title>
</head>
<body>
<h1>Titlu</h1>
<p>Acesta este un paragraf de text</p>
<h2>Subtitlu</h2>
<p>Un alt paragraf</p>
</body>
</html>Exemplul 3
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Acesta este titlul documentului</title>
</head>
<body>
<div style="font-size: 2em; font-weight: bolder; margin: .67em 0">Titlu</div>
<div style="margin: 1.12em 0">Acesta este un paragraf de text</div>
<div style="font-size: 1.5em; font-weight: bold; margin: .75em 0">Subtitlu</div>
<div style="margin: 1.12em 0">Un alt paragraf</div>
</body>
</html>Ambele documente sunt perfect valide (și arată aproximativ la fel în browsere), dar exemplul 2 are ceva ce exemplului 3 îi lipsește cu desăvârșire: structura. Dacă ne uităm la exemplul 2 observăm că avem un heading 1 (deci un titlu), urmat de un paragraf, urmat apoi de un heading 2 și de un alt paragraf. Un voice browser ar putea pronunța heading-urile intr-un anume fel, pentru ca ascultătorul să-si dea seama că este vorba de titluri. La fel, browserele în mod text ar putea scrie titlul cu majuscule, cu spații între caractere etc. Exemplul 3 în schimb conține niște text pe care sunt aplicate efecte tipografice. Un voice browser sau un browser text nu prea are ce face cu informații de genul „caracterele sunt de două ori mai înalte decât normal, și sunt aldine”. Aceste informații vor fi probabil ignorate, iar utilizatorul nu va avea habar despre modul în care este structurat documentul.
Utilizatorii Internetului vor în primul rând să ajungă la informație rapid și ușor
Tim Berners-Lee, W3CAceastă observație se extinde și asupra tag-urilor de formatare. Un tag <b> (bold) de exemplu nu spune nimic unui voice browser. Un browser grafic înțelege că trebuie să folosească corp de literă aldin, dar acest concept nu există atunci când „pronunți” cuvinte. Tag-ul <strong> este mult mai sugestiv și este recomandat. Aceeași poveste și pentru tagurile <i> (italic) și <em> (emphasis). Tag-urile <b> și <i> sunt folosite din ce în ce mai puțin, și probabil vor dispărea cu desăvârșire.
Curățenie generală
XHTML continuă tendința de renunțare la anumite tag-uri și atribute în favoarea CSS. Din acest punct de vedere, XHTML 1.0 Strict și XHTML 1.1 sunt cele mai „afectate”. Sunt vizate în special două categorii de tag-uri:
tag-urile care nu au nici o valoare semantică, și folosesc doar pentru formatarea textului. Exemple de astfel de tag-uri sunt <i>, <strike> etc.
tag-urile „duplicat”. De exemplu, se renunță la tag-ul <applet> în favoarea tag-ului <object> (chiar și clasicul <img> este amenințat de acesta).
Prin aceste modificări se urmărește revenirea XHTML la un limbaj care definește structura documentului, layout-ul și formatarea textului fiind lăsate în seama CSS (care este mult mai potrivit pentru așa ceva). Avantajele utilizării CSS vor fi prezentate într-un articol viitor.
Acasa 
Ultimele imagini 
Subiect: XHTML: Suflul schimbării 
Mier Aug 27, 2008 2:10 am
