|
ntroduction
au Extensible Hypertext Markup Language
Le
XHTML 1.0 est la derni�re recommandation du W3C, ce nouveau standard
d�fini le 26 janvier 2000 par le World Wide Web Consortium est
avant tout une fa�on de pr�senter un document XML tous en gardant
le HTML conventionnel. Donc transitoire entre le HTML 4.01 et
le XML 1.0. Grande surprise, il n'y aura pas de HTML 5.0! La diff�rence
est avant tout le " DOCTYPE " ou le DTD " Document Type Definition
" qui permet de d�finir le HTML contenu dans votre document XML,
exactement comme un document XSL. Convertir vos pages HTML 4.01
en XHTML 1.0 n'entra�ne aucun probl�me de compatibilit� notable
avec les navigateurs actuel, et il convient bien s�r � tous dans
la mesure ou vos pages seront conforme aux prochaines recommandations.
Le XHTML est selon moi la meilleure fa�on de suivre efficacement
le d�veloppement des standards Web sans trop souffrir le martyre.
Si
vous �tiez comme moi un programmeur d'exp�rience avant de voir
un code HTML, votre r�action n'a t'elle pas �t� de vous demander
" mais qu'est-ce que c'est que ce langage ! ". La premi�re
chose qui frappe c'est qu'un navigateur ignore tout simplement
ce qu'il ne reconna�t pas. Il peut m�me estimer et r�agir, en
fonction de diff�rente situation. Chose inhabituelle pour les
programmeurs et quel mauvais pli � prendre pour les nouveaux.
Le poids des navigateurs est le prix � payer pour cette technologie,
20Mo, 30Mo� Le XHTML palis � cette lacune en instaurant des r�gles
de programmation beaucoup plus stricte.
Imaginez un secr�taire donnant un document que le patron doit
corriger avant d'autoriser ! Cette nouvelle recommandation nous
ram�ne � la base. Le principe est simple, plus strict, il faut
dire ce qu'il y a � dire dans l'art et dans l'ordre des choses.
Plusieurs r�gles � suivre mais un code remmen� � sa plus simple
expression.
Le secret c'est le fichier DTD.
Je ne m'�terniserai pas sur ce fichier car le W3C recommande fortement
d'utiliser les DTDs install�s sur leur propre serveur. Vous n'avez
donc qu'une r�f�rence � ajouter sans m�me conna�tre le contenu
de ce fichier. Mais c'est toujours pratique, question d'avoir
un coup d'�il d'ensemble sur les balises et attributs disponibles!
Le type de document ou le DTD " Document Type
Definition " est un fichier qui contient une collection
de d�claration XML, les " namespaces
" qui d�finissent la structure, les �l�ments et les attributs
utilis�s dans le document. Un " namespaces " ou " espace
de nom ", identifie une balise d�crivant un objet particulier.
Voici un exemple d'un document DTD transitionnel, il s'agit du
" namespaces " de la balise <body> :
<!ELEMENT
body %Flow;>
<!ATTLIST body
%attrs;
onload %Script; #IMPLIED
onunload %Script; #IMPLIED
background %URI; #IMPLIED
bgcolor %Color; #IMPLIED
text %Color; #IMPLIED
link %Color; #IMPLIED
vlink %Color; #IMPLIED
alink %Color; #IMPLIED
>
Il
y a trois fichiers DTD, pour l'instant :
- Strict
: Toutes les balises doivent �tre d�finies dans un " namespaces
" du DTD. Fait � noter, plusieurs balises HTML 4.01 ne sont
plus reconnues, comme <center> par exemple.
XHTML-1.0-Strict : http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Strict//FR" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
- Transitional
: La grande majorit� des balises HTML 4.01 sont disponibles
et vous pouvez utiliser des balises qui ne sont pas d�finit
dans le DTD.
XHTML-1.0-Transitional : http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Transitional//FR" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- Frameset
: Parce que c'est une m�ta structure, le W3C � d�cid� de retirer
ce format du standard XHTML et d'en faire une d�claration propre
aux pages avec cadre " frameset "
XHTML-1.0-Frameset : http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Frameset//FR" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Voil�
pour l'identification de votre document. Maintenant il faut que
son contenu respecte les r�gles. Les r�gles qui vont faire en
sorte que votre code HTML respecte les nouvelles normes. Le navigateur
ne s'en portera que mieux et le programmeur rassur� ;-0.
1.
Vous devez utiliser les balises du HTML 4.01. Pour plus d'information
sur les sp�cifications, les balises et les arguments du HTML 4.01,
voir : "Index
of Elements" et "Index
of Attributes".
2.
Le XML �tant sensible aux majuscules/minuscules,
toutes les balises du XHTML doivent �tre en minuscule.
3.
Toujours pour respecter les normes du XML, toutes les balises
doivent �tre ferm�es <li>...</li>,
<td>...</td> etc.. Remarquer que les balises
qui n'affectent pas un bloc, comme un saut de ligne ou une images,
doivent aussi �tre ferm�es directement dans son ouverture.
Mauvais
<p>bonjour
<p>le monde...
Bon
<p>Bonjour</p>
<p>le monde...</p>
Mauvais
Bonjour<br>
Le monde...<br>
Bon
Bonjour<br />
le monde<br />
Mauvais
<img src="logo.png" alt="logo">
Bon
<img src="logo.png" alt="logo" />
L'utilisation
d'une seconde balise doit �tre la norme : <br></br>
mais les navigateurs pourraient �tre confus, c'est pourquoi <br
/> est conseill�. Pour les balises m�ta c'est la m�me
chose:
<meta
http-equiv="content-language" content="fr-ca"
/>
4.
Les images doivent avoir un texte alternatif. M�me les tables
ou tableaux doivent avec un texte, le summary.
Mauvais
<table width="100%" border="0">
<tr><td>
<img src="logo.png" />
</td></tr>
</table>
Bon
<table width="100%" border="0" summary="Mon
logo">
<tr><td>
<img src="logo.png" alt="logo"
/>
</td></tr>
</table>
5.
Tous les attributs doivent avoir un argument et �tre entre guillemets.
Mauvais
<img src=logo.png alt="">
Bon
<img src="logo.png" alt="logo"
/>
Un attribut qui n'a pas d'expression ou une constante:
Mauvais
<option name="nom" selected>
Bon
<option name="nom" selected="selected">
Mauvais
<textarea name="text" rows="10"
cols="50" readonly>
Bon
<textarea name="text" rows="10" cols="50" readonly="readonly">
6.
La structure ne permet plus les imbrications illogiques comme
:
<b><i>a
test</b></i>
mais plut�t
<b><i>Texte</i></b>
7.
L'ordre est aussi important, ainsi une balise m�ta ne peut se
retrouver � l'int�rieur du " body ".
Un en-t�te H2 ne peut �tre � l'int�rieur
d'une H1 ou m�me Un H1
ne peut �tre apr�s un H2.
8.
En terminant, il faut prendre l'habitude d'indiquer l'attribut
" ID " d�j� utilis� par le DHTML. Par exemple, cette
balise pour indiquer l'ancre d'un hyperlien dans une m�me page.
Noter que cette balise ne peut plus se retrouver dans le vide
en haut d'une page par exemple, elle doit �tre dans un bloc, un
paragraphe ou une table etc.
<a
id="identificateur" name="identificateur ">Ancre</a>
9.
Les scripts
Attention au script. Les �l�ments de script et de style sont d�clar�s
comment ayant des contenus #PCDATA.
En cons�quence, les symboles " < " et
" & " seront interpr�t�s comme s'ils
�taient le premier caract�re d'une balise, l'ouverture d'une balise
quoi, et des items comme " <
" et " & " seront reconnus en
tant que r�f�rences par le processeur XML aux symboles " <
" et " & " respectivement. En cr�ant
une section recouvrant ces �l�ments de script ou de style qui
soit une section marqu�e CDATA,
�vite l'interpr�tation de ces �l�ments.
<script;>
<![CDATA[
... Script ...
]]>
</script>
Une
alternative est de d�clarer les �l�ments de script et de style
dans un fichier externe.
Vous
pouvez maintenant cr�er votre premier document XHTML
Suite : Votre
premi�re page XHTML 1.0
XHTML
1.0 (W3C) : http://www.w3.org/TR/xhtml1/
Lire
la 2ème Partie >>
Django Blais
Directeur de Recherche et D�veloppement
http://www.trucsweb.com
Tous
droits réservés - Reproduction même partielle interdite sans
autorisation préalable
|