cursul pagweb 2
DESCRIPTION
HTML versus XHTMLTRANSCRIPT
TEHNOLOGIITEHNOLOGII WEB WEB
CURSUL CURSUL 2 2
HTML versus XHTMLHTML versus XHTML
- continuare -- continuare -
2204/18/2304/18/23 Tehnologii WEBTehnologii WEB
C2 – C2 – HTML versus XHTMLHTML versus XHTML - continuare- continuare
1. Regulile de aur ale paginilor Web – s3
2. HTML - Structura unui document HTML4 strict – s4
3. XHTML - Structura unui document XHTML 1.0 – s9
4. Conversie HTML în XHTML – s18
3304/18/2304/18/23 Tehnologii WEBTehnologii WEB
1. Regulile de aur ale paginilor Web
Pagina de primirePagina de primire este prima pagină a unui siteeste prima pagină a unui site numiţi pagina de primire numiţi pagina de primire index.htmindex.htm sau sau index.htmlindex.html ea trebuie să conţină un rezumat succint al site-ului ea trebuie să conţină un rezumat succint al site-ului
Alte paginiAlte pagini fiecare pagină trebuie să înceapă cu informaţii importante, fiecare pagină trebuie să înceapă cu informaţii importante,
esenesenţţialeiale NUNU publicaţi o pagină în curs de realizare publicaţi o pagină în curs de realizare ! ! AActualizaţi în mod regulat paginilectualizaţi în mod regulat paginile ! ! utilizaţi utilizaţi fişiere de dimensiune minimalăfişiere de dimensiune minimală pentru ca vizitatorul să nu pentru ca vizitatorul să nu
aştepte minute în şir apariţia întregii pagini pe ecranaştepte minute în şir apariţia întregii pagini pe ecranTextulTextul
structuraţi textul utilizând structuraţi textul utilizând titluri de nivele diferitetitluri de nivele diferite pentru a garanta o pentru a garanta o bună lizibilitatebună lizibilitate, utilizaţi cel mult două sau trei , utilizaţi cel mult două sau trei
fonturifonturi verificaţi verificaţi corectitudinea informaţiilorcorectitudinea informaţiilor
Privilegiaţi interactivitateaPrivilegiaţi interactivitatea evitaţi instrucţiunile specifice unui anumit tip de navigator evitaţi instrucţiunile specifice unui anumit tip de navigator
((universaluniversalitate)itate) creaţi o legătură (link) de tip mailtocreaţi o legătură (link) de tip mailto prevedeţi un FAQ (Frequently Asked Questions)prevedeţi un FAQ (Frequently Asked Questions), , nu va trebui să nu va trebui să
răspundeţi de mai multe ori la întrebări puse frecvent.răspundeţi de mai multe ori la întrebări puse frecvent.
4404/18/2304/18/23 Tehnologii WEBTehnologii WEB
2. HTML - Structura unui document HTML4 strict
O pagină Web validă este alcătuită din trei părţi:O pagină Web validă este alcătuită din trei părţi: tipul documentuluitipul documentului secţiunea de antetsecţiunea de antet corpul paginii Webcorpul paginii Web
Exemplu:Exemplu:
5504/18/2304/18/23 Tehnologii WEBTehnologii WEB
2. HTML - Structura unui document HTML4 strict
Declaraţia Declaraţia DOCTYPEDOCTYPE precizează precizează tipul de documenttipul de document consorţiului W3C a definit trei consorţiului W3C a definit trei DTDDTD-uri (Document Type Definition)-uri (Document Type Definition)::
DTD HTML 4.01 strictDTD HTML 4.01 strict, care defineşte versiunea cea mai , care defineşte versiunea cea mai corectă a limbajului HTML 4corectă a limbajului HTML 4
DTD HTML 4.01 framesetDTD HTML 4.01 frameset, care permite în plus crearea , care permite în plus crearea cadrelorcadrelor
DTD HTML 4.01 transitionalDTD HTML 4.01 transitional, care, în plus faţă de elementele , care, în plus faţă de elementele DTD-ului strict, suportă încă elemente nerecomandate ale DTD-ului strict, suportă încă elemente nerecomandate ale versiunii 3.2versiunii 3.2
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">"http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">"http://www.w3.org/TR/html4/frameset.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">"http://www.w3.org/TR/html4/loose.dtd">
6604/18/2304/18/23 Tehnologii WEBTehnologii WEB
2. HTML - Structura unui document HTML4 strict
Elementul <HTML>Elementul <HTML>numit element rădăcină în terminologia XMLnumit element rădăcină în terminologia XML
<HTML> are 2 secţiuni<HTML> are 2 secţiuni <HEAD><HEAD> şişi <BODY><BODY>:: antetul documentului, introdus prin tag-urile antetul documentului, introdus prin tag-urile <HEAD> <HEAD> şi şi </HEAD></HEAD> corpul documentului, introdus prin tag-urile corpul documentului, introdus prin tag-urile <BODY> <BODY> şişi </BODY> </BODY>
secţiunea de antet poate conţine următoarele elemente:secţiunea de antet poate conţine următoarele elemente:<BASE>, <LINK>, <BASE>, <LINK>, <META>, <SCRIPT>, <STYLES> şi <META>, <SCRIPT>, <STYLES> şi <TITLE><TITLE>, ultimul fiind obligatoriu, ultimul fiind obligatoriu
tag-ul tag-ul <META><META> preciz precizeeaazăză cuvintele cheie ale paginii cuvintele cheie ale paginii, poate fi definit în două , poate fi definit în două moduri diferite, cu atributele:moduri diferite, cu atributele:
nnameame - d - diferite valori ale atributului sunt cuvinte cheie utilizate de motoarele de iferite valori ale atributului sunt cuvinte cheie utilizate de motoarele de căutare pentru indexarea paginilor Web căutare pentru indexarea paginilor Web
http-equivhttp-equiv – permite adăugarea de perechi nume/valoare în antetul documentului – permite adăugarea de perechi nume/valoare în antetul documentului transmis prin servertransmis prin server
elementul elementul <<titletitle>> conţine titlul paginii şi esteconţine titlul paginii şi este a afişat în fişat în bara de titlu a bara de titlu a navigatoruluinavigatorului
ttag-urile de comentariiag-urile de comentarii:: sintaxa:sintaxa: <!--<!--comentariucomentariu --> --> vvă ajute în înţelegerea codului (el nu va fi interpretat de navigator dacă ă ajute în înţelegerea codului (el nu va fi interpretat de navigator dacă
conţine tag-uri HTMLconţine tag-uri HTML ccomentariile joacă un rol particular în cadrul stilurilor. Ele permit vechilor omentariile joacă un rol particular în cadrul stilurilor. Ele permit vechilor
navigatoare să nu afişeze definiţia stilurilor, script-urile utilizate etc.navigatoare să nu afişeze definiţia stilurilor, script-urile utilizate etc.
7704/18/2304/18/23 Tehnologii WEBTehnologii WEB
2. HTML - Structura unui document HTML4 strict
ttag-urile ag-urile <BODY> <BODY> şişi </BODY> </BODY> definesc corpul documentului definesc corpul documentului
ttoate tag-urile (de nivel 1) imbricate în elementul <BODY> trebuie oate tag-urile (de nivel 1) imbricate în elementul <BODY> trebuie să fie conforme cu DTD HTML 4 strictsă fie conforme cu DTD HTML 4 strict
ValidaValidarearea documentel documenteloror HTML 4 strict HTML 4 strict
sserviciul de validareerviciul de validare:: verificărverificărăă pagin paginaa semnalsemnaleazăează eventualelor erori generate eventualelor erori generate (indicând (indicând numărul de linie şi numărul de linie şi
tipul de eroaretipul de eroare)) se afişează în pagină eticheta de validare se afişează în pagină eticheta de validare instrument de validare: aplicaţia open source instrument de validare: aplicaţia open source W3C Validator, W3C Validator,
disponibilă disponibilă pe site-ul: pe site-ul: http://validator.w3.orghttp://validator.w3.org
8804/18/2304/18/23 Tehnologii WEBTehnologii WEB
2. HTML - Structura unui document HTML4 strict
în urma validării se obţine în urma validării se obţine eticheta de validareeticheta de validare, generată de codul următor:, generată de codul următor:
Atribute HTML comuneAtribute HTML comune
<p> <a href="http://validator.w3.org/check?uri=referer"> <img src="http://www.w3.org/Icons/valid-html401" alt="Valid HTML 4.01 Strict" height="31" width="88"></a></p>
="nume"
Atribuie un nume unic unui element din interiorul documentului. Când un element conţine de asemenea un atribut name este de dorit să utilizăm simultan cele două atribute (id şi name) atribuindu-le aceeaşi valoare.
Exemplu: <P id="p1"> Text paragraf </P>.
class="nume"Atribuie o clasa sau un element de clasa unui element. Acest atribut este frecvent
utilizat cu foile de stiluri CSS.Exemplu: <P class="avantaje"> Text paragraf </P>.
style="stil"Permite crearea unui stil local.Exemplu: <P style="background-color: red"> Text paragraf </P>.
title="text"Se aplica numai unui element dedicat şi nu întregului document.Exemplu: <P title="cititi paragraful"> Text paragraf </P>.
lang="cod"Precizează codul ISO al limbii.
Exemplu: <P lang="fr"> Text paragraf </P>.
dir="ltr\rtl" Precizeaza sensul de citire (left to right\ right to left) al unui text.
onclick, ondblclick, onkeydown, onkeypress, onkeyup,
onmousedown, onmousemove,onmouseout, onmouseover, Onmouseup
Atribute pentru gestionarea evenimentelor.
9904/18/2304/18/23 Tehnologii WEBTehnologii WEB
3. XHTML - Structura unui document XHTML 1.0
XHTMLXHTML = reformulare a lui HTML 4.0 în termenii limbajului XML= reformulare a lui HTML 4.0 în termenii limbajului XML utilizează la fel ca şi HTML-ul marcaje (tag-uri)utilizează la fel ca şi HTML-ul marcaje (tag-uri) prima versiune apare în ianuarie 2000, revizuită în august 2000prima versiune apare în ianuarie 2000, revizuită în august 2000 e specificat în trei variante, ce definesc trei tipuri de documente e specificat în trei variante, ce definesc trei tipuri de documente DTDDTD::
XHTML 1.0 StrictXHTML 1.0 Strict – documente de acest tip nu conţin elemente sau atribute – documente de acest tip nu conţin elemente sau atribute considerate demodateconsiderate demodate
XHTML 1.0 TransitionalXHTML 1.0 Transitional – documente de acest tip pot conţine elemente – documente de acest tip pot conţine elemente HTML considerate demodateHTML considerate demodate
XHTML 1.0 FramesetXHTML 1.0 Frameset – documente de acest tip sunt folosite în situaţia în – documente de acest tip sunt folosite în situaţia în care se doreşte utilizarea cadrelor (frames)care se doreşte utilizarea cadrelor (frames)
101004/18/2304/18/23 Tehnologii WEBTehnologii WEB
3. XHTML - Structura unui document XHTML 1.0
Exemplu:Exemplu:
111104/18/2304/18/23 Tehnologii WEBTehnologii WEB
3. XHTML - Structura unui document XHTML 1.0
Declaraţia Declaraţia DOCTYPEDOCTYPE precizează precizează tipul de documenttipul de document consorţiului W3C a definit trei consorţiului W3C a definit trei DTDDTD-uri (Document Type Definition)-uri (Document Type Definition)::
DTD DTD XXHTML 1HTML 1.0.0 strict strict, care defineşte versiunea , care defineşte versiunea curată acurată a limbajului limbajului XXHTMLHTML, nu acceptă CSS, nu acceptă CSS
sau versiunea prescurtată:sau versiunea prescurtată:
DTD DTD XXHTML 1HTML 1.0.0 transitionaltransitional, care permite , care permite elemente CSSelemente CSS
DTD HTML 1DTD HTML 1.0.0 framesetframeset, , acceptă cadreacceptă cadre
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1-strict.dtd">"http://www.w3.org/TR/xhtml1-strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transational//EN"<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transational//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Frameset//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""DTD/xhtml1-strict.dtd">"DTD/xhtml1-strict.dtd">
121204/18/2304/18/23 Tehnologii WEBTehnologii WEB
3. XHTML - Structura unui document XHTML 1.0
Elementul <HTML>Elementul <HTML>
identifică documentul ca pe un document HTML sau XHTMLidentifică documentul ca pe un document HTML sau XHTML
ppentru a preciza că documentul este un document XHTML, va entru a preciza că documentul este un document XHTML, va trebui să adăugaţi un spaţiu de nume XHTMLtrebui să adăugaţi un spaţiu de nume XHTML
<html xmlns="http://www.w3.org/1999/xhtml"><html xmlns="http://www.w3.org/1999/xhtml">
<HTML> are 2 secţiuni<HTML> are 2 secţiuni <HEAD><HEAD> şişi <BODY><BODY>:: antetul documentului, introdus prin tag-urile antetul documentului, introdus prin tag-urile <HEAD> <HEAD> şi şi
</HEAD></HEAD> corpul documentului, introdus prin tag-urile corpul documentului, introdus prin tag-urile <BODY> <BODY> şişi
</BODY></BODY>
secţiunea de antet poate conţine următoarele elemente: secţiunea de antet poate conţine următoarele elemente: script, style, link, isindexscript, style, link, isindex (este înlocuit de elementul input), (este înlocuit de elementul input), basebase
131304/18/2304/18/23 Tehnologii WEBTehnologii WEB
3. XHTML - Structura unui document XHTML 1.0
tag-ul tag-ul <META><META> este un fiu al elementului head, fiind un este un fiu al elementului head, fiind un element vid:element vid:
<meta http-equiv="Content-Type" <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />content="text/html;charset=UTF-8" />
elementul elementul <<titletitle>> conţine titlul paginii şi esteconţine titlul paginii şi este a afişat în fişat în bara bara de titlu a navigatoruluide titlu a navigatorului şi este obligatoriu ! şi este obligatoriu !
ttag-urile de comentariiag-urile de comentarii: (la fel ca şi la HTML): (la fel ca şi la HTML) sintaxa:sintaxa: <!--<!--comentariucomentariu --> --> vvă ajute în înţelegerea codului (el nu va fi interpretat de ă ajute în înţelegerea codului (el nu va fi interpretat de
navigator dacă conţine tag-uri HTMLnavigator dacă conţine tag-uri HTML ccomentariile joacă un rol particular în cadrul stilurilor. Ele omentariile joacă un rol particular în cadrul stilurilor. Ele
permit vechilor navigatoare să nu afişeze definiţia stilurilor, permit vechilor navigatoare să nu afişeze definiţia stilurilor, script-urile utilizate etc.script-urile utilizate etc.
141404/18/2304/18/23 Tehnologii WEBTehnologii WEB
3. XHTML - Structura unui document XHTML 1.0
ttag-urile ag-urile <BODY> <BODY> şişi </BODY> </BODY> definesc corpul documentului definesc corpul documentuluittoate tag-urile (de nivel 1) imbricate în elementul <BODY> trebuie să fie oate tag-urile (de nivel 1) imbricate în elementul <BODY> trebuie să fie conforme cu DTD HTML conforme cu DTD HTML 1.0 strict1.0 strict
Atribute XHTML1 comuneAtribute XHTML1 comunecca şi în HTML, atributele:a şi în HTML, atributele:
id, style, class, lang, dir, title, onclick, ondblclick, onkeydown, onkeypress, id, style, class, lang, dir, title, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseuponmouseup
sunt comune şi elementelor XHTMLsunt comune şi elementelor XHTML
Observaţii:Observaţii:atributul atributul stylestyle NU poate fi utilizat cu elementele: <html>, <head>, <title>, NU poate fi utilizat cu elementele: <html>, <head>, <title>, <meta>, <style>, <script>, <param>, <base> şi <basefont><meta>, <style>, <script>, <param>, <base> şi <basefont>atributul atributul titletitle NU poate fi utilizat cu elementele: <html>, <head>, NU poate fi utilizat cu elementele: <html>, <head>, <meta>, <title>, <script>, <param>, <base> şi <basefont><meta>, <title>, <script>, <param>, <base> şi <basefont>
</head></head> <!--Corpul documentului--><!--Corpul documentului--> <body><body> <h1>Prima mea pagina <h1>Prima mea pagina Web</h1>Web</h1> </body></body></html></html>
151504/18/2304/18/23 Tehnologii WEBTehnologii WEB
3. XHTML - Structura unui document XHTML 1.0
Elemente HTML depăşite în versiunea XHTML1Elemente HTML depăşite în versiunea XHTML1
Obiectiv principal al XHTML-ului:Obiectiv principal al XHTML-ului: separarea structurii documentului de forma sa de prezenataresepararea structurii documentului de forma sa de prezenatare
elemente HTML, care sunt depăşite în versiunea XHTML1, dar elemente HTML, care sunt depăşite în versiunea XHTML1, dar mereu utilizatemereu utilizate::
appletapplet, înlocuit de elementul object;, înlocuit de elementul object; basefontbasefont, înlocuit de , înlocuit de CSSCSS;; centercenter, înlocuit de , înlocuit de CSSCSS;; dirdir, înlocuit de elementul , înlocuit de elementul ulul;; fontfont, înlocuit de , înlocuit de CSSCSS;; isindexisindex, înlocuit de elementul , înlocuit de elementul inputinput;; menumenu, înlocuit de elementul , înlocuit de elementul ulul;; ss sau sau strikestrike, înlocuit de , înlocuit de CSSCSS;; uu, înlocuit de , înlocuit de CSSCSS
161604/18/2304/18/23 Tehnologii WEBTehnologii WEB
3. XHTML - Structura unui document XHTML 1.0
ValidaValidarearea documentel documenteloror XXHTML HTML 11 strict strict (analog cu HMTL)(analog cu HMTL)
sserviciul de validareerviciul de validare:: verificărverificărăă pagin paginaa semnalsemnaleazăează eventualelor erori generate eventualelor erori generate (indicând (indicând numărul de linie şi numărul de linie şi
tipul de eroaretipul de eroare)) se afişează în pagină eticheta de validare se afişează în pagină eticheta de validare instrument de validare: aplicaţia open source instrument de validare: aplicaţia open source W3C Validator, W3C Validator,
disponibilă disponibilă pe site-ul: pe site-ul: http://validator.w3.orghttp://validator.w3.org
171704/18/2304/18/23 Tehnologii WEBTehnologii WEB
3. XHTML - Structura unui document XHTML 1.0
în urma validării se obţine în urma validării se obţine eticheta de validareeticheta de validare, generată de codul următor:, generată de codul următor:
<p><a href="http://validator.w3.org/check?uri=referer"><img src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0 Strict" height="31" width="88“ /></a></p>
181804/18/2304/18/23 Tehnologii WEBTehnologii WEB
4. Conversie HTML în XHTML
De ce trebuie să convertiţi documentele HTML?De ce trebuie să convertiţi documentele HTML?
XHTML XHTML == aplicaţie XML, un procesor XML poate prelucra XHTML; aplicaţie XML, un procesor XML poate prelucra XHTML;
XHTML poate fi extins pentru a integra alte modele de documente XHTML poate fi extins pentru a integra alte modele de documente (vocabulare) ca de exemplu(vocabulare) ca de exemplu::
SVG (Scalable Vector Graphics)SVG (Scalable Vector Graphics) SMIL (Synchronized Multimedia Integration Language)SMIL (Synchronized Multimedia Integration Language) MathML (Mathematic Markup Language)MathML (Mathematic Markup Language) propriul vocabular XMLpropriul vocabular XML
XHTML încurajează separarea stilului (documentului) de structura XHTML încurajează separarea stilului (documentului) de structura documentului;documentului;
XHTML oferă un cod mai clar, mai uşor de citit atât pentru procesor cât XHTML oferă un cod mai clar, mai uşor de citit atât pentru procesor cât şi pentru ochiul uman;şi pentru ochiul uman;
furnizorii de telefoane mobile au ales XHTML ca limbaj privilegiat;furnizorii de telefoane mobile au ales XHTML ca limbaj privilegiat;
conexiunea XHTML-XML a demonstrat costuri reduse în materie de conexiunea XHTML-XML a demonstrat costuri reduse în materie de copyright, de mentenanţă şi de dezvoltarecopyright, de mentenanţă şi de dezvoltare
W3C nu va mai dezvolta HTML, decât sub formă de noi versiuni XHTML.W3C nu va mai dezvolta HTML, decât sub formă de noi versiuni XHTML.
191904/18/2304/18/23 Tehnologii WEBTehnologii WEB
4. Conversie HTML în XHTML
Conversia este Conversia este posibilposibilăă în două moduri: în două moduri: convertire în mod manualconvertire în mod manual convertire în mod automat, utilizând aplicaţia convertire în mod automat, utilizând aplicaţia HTML TidyHTML Tidy
Convertiţi manual documentele HTMLConvertiţi manual documentele HTML
metodă mai puţin utilizatămetodă mai puţin utilizată
rreguli de convertire manualăeguli de convertire manuală
atunci când utilizaţi sintaxa elementului vid XML, atunci când utilizaţi sintaxa elementului vid XML, inseraţi un spaţiu inseraţi un spaţiu înaintea barei obliceînaintea barei oblice (/); exemplu: <br (/); exemplu: <br / />;>;
utilizaţi o utilizaţi o foaie de stiluri externăfoaie de stiluri externă sau documente de script în loc de sau documente de script în loc de a le imbrica între <head> şi </head> ale documentului XHTML;a le imbrica între <head> şi </head> ale documentului XHTML;
convertiţi toate numele de elemente şi atribute (şi valorile convertiţi toate numele de elemente şi atribute (şi valorile atributelor) care sunt scrise cu majuscule, în atributelor) care sunt scrise cu majuscule, în minusculeminuscule;;
202004/18/2304/18/23 Tehnologii WEBTehnologii WEB
4. Conversie HTML în XHTML
nu utilizaţi rupturi de linienu utilizaţi rupturi de linie pentru a mări lizibilitatea documentului; pentru a mări lizibilitatea documentului; inseraţi un spaţiu alb numai între elemente;inseraţi un spaţiu alb numai între elemente;
utilizaţi împreună atributele utilizaţi împreună atributele name name şişi id id pentru a asigura o pentru a asigura o compatibilitate perfectăcompatibilitate perfectă cu navigatoarele! Exemplu: cu navigatoarele! Exemplu: <a <a name=”unu” id=”unu”> … </a>name=”unu” id=”unu”> … </a>;;
pentru a asigura o pentru a asigura o compatibilitate totalăcompatibilitate totală utilizaţi în acelaşi timp utilizaţi în acelaşi timp atributele atributele langlang şi şi xmlxml;;
închideţi toate elementeleînchideţi toate elementele, inclusiv elementele vide;, inclusiv elementele vide; plasaţi între plasaţi între ghilimeleghilimele toate toate valorile atributelorvalorile atributelor;; atribuiţi atribuiţi valori tuturor atributelorvalori tuturor atributelor. Exemplu: . Exemplu: <input <input
type=”checkbox” checked=”checked” >type=”checkbox” checked=”checked” >;; imbricaţi corectimbricaţi corect elementele; elementele; utilizaţi declaraţia utilizaţi declaraţia DOCTYPE corespunzătoareDOCTYPE corespunzătoare;; introduceţi în tag-ul de deschidere <html> spaţiul de nume introduceţi în tag-ul de deschidere <html> spaţiul de nume
XHTML:XHTML:
<html xmlns=”http://www.w3.org/1999/xhtml”><html xmlns=”http://www.w3.org/1999/xhtml”>
212104/18/2304/18/23 Tehnologii WEBTehnologii WEB
4. Conversie HTML în XHTML
Convertiţi (automat) documentele HTML cu HTML TidyConvertiţi (automat) documentele HTML cu HTML Tidy
HTML TidyHTML Tidy instrument conceput de instrument conceput de David RagettDavid Ragett
eeste de un mare ajutor pentru toţi creatorii Webste de un mare ajutor pentru toţi creatorii Web
ddisponibil pe platformele Windows şi Macisponibil pe platformele Windows şi Mac
converteşte converteşte precis şi rapid precis şi rapid documentele HTML în XHTMLdocumentele HTML în XHTML
ddestinat la început curăţării codului HTML el a sfârşit prin a fi estinat la început curăţării codului HTML el a sfârşit prin a fi integrat ca plugin în cea mai mare parte a editoarelor HTMLintegrat ca plugin în cea mai mare parte a editoarelor HTML
posedă şi o versiune grafică, posedă şi o versiune grafică, Tidy GuiTidy Gui
222204/18/2304/18/23 Tehnologii WEBTehnologii WEB
4. Conversie HTML în XHTML
Avantaje HTML Tidy
corectează tag-urile finale desperecheatecorectează tag-urile finale desperecheate
corectează erorile de imbricarecorectează erorile de imbricare
localizează elementele prost plasate (exemplu: elementul td localizează elementele prost plasate (exemplu: elementul td este este plasat în interiorul elementului form) în interiorul elementului form)
modifică în mod automat toate numele de elemente şi atribute modifică în mod automat toate numele de elemente şi atribute care au fost scrise cu majusculecare au fost scrise cu majuscule
adaugă ghilimele (simple sau duble) valorilor atributeloradaugă ghilimele (simple sau duble) valorilor atributelor
232304/18/2304/18/23 Tehnologii WEBTehnologii WEB
4. Conversie HTML în XHTML
Modul de lucru cu HTML TidyModul de lucru cu HTML Tidy îîncărcaţi HTML-Kit de pe site-ul www.chami.com/html-kitncărcaţi HTML-Kit de pe site-ul www.chami.com/html-kit// iidentificaţi documentul dentificaţi documentul inceput.htminceput.htm ddeschideţi fişierul (File - Open).eschideţi fişierul (File - Open).
242404/18/2304/18/23 Tehnologii WEBTehnologii WEB
4. Conversie HTML în XHTML
îîn HTML-Kit selectaţi n HTML-Kit selectaţi Actions/ Actions/ Tools / HTML Tidy / Convert Tools / HTML Tidy / Convert to XHTMLto XHTML
înlocuiînlocuirearea vechiul document vechiul document ((inceput.htminceput.htm) HTML cu noul ) HTML cu noul document XHTMLdocument XHTML
folosiţi tab-ul folosiţi tab-ul OutputOutput
apoi apoi Edit / Copy Output to Edit / Copy Output to Editor Editor din aplicaţia utilitară din aplicaţia utilitară HTML KitHTML Kit
sselectaţi electaţi File – Save AsFile – Save As din din tab-ul tab-ul EditorEditor pentru a salva pentru a salva fişierul fişierul inceput.htminceput.htm versiunea HTML4 în XHTML 1 versiunea HTML4 în XHTML 1 sub denumirea sub denumirea inceput inceput modificat XHTML.htmmodificat XHTML.htm