nous abordons aujourd?hui notre premier volet sur l?optimisation du code html. avant d?entrer dans le vif du sujet, nous devons faire quelques rappels à propos du langage html.

html, le minimum

ces rappels représentent le minimum de connaissances nécessaires en html sans lesquelles il est vain d?espérer pouvoir optimiser vos pages web. ceux qui sont familiers du html n?y apprendront rien de nouveau et y trouveront même quelques approximations à portée purement pédagogique.

html, kezako ?

a chaque page web, que vous visitez sur internet, est associé un fichier au format html que votre navigateur (internet explorer, opera, firefox ou autre) reçoit et a la charge d’afficher. ce fichier au format texte (donc humainement lisible) décrit l’apparence que doit avoir la page web correspondante (texte, images, mise en forme, etc …).

par exemple, en vous rendant sur la page d?accueil du journal du net, vous pouvez afficher le fichier qu?a reçu votre navigateur (clic droit + afficher la source dans internet explorer). dans un éditeur de texte s?affiche alors le texte suivant (code html) de la page d?accueil du journal du net.

cette description est faîte en html. le html (hyper text markup language) est un langage standard qui repose sur des balises (de mise en forme, en général). il existe des balises pour afficher du texte, pour le mettre en gras, pour insérer des images, etc ? les balises ou tags (en anglais) sont toujours présentées entre chevrons <nom de la balise>. le texte mis en forme est la plupart du temps encadré par une balise ouvrante et une balise fermante.

par exemple,
pour afficher en gras le texte baladeur mp3, on utilise la balise b (pour bold, gras en anglais) comme suit,

structure d?une page html

une page html est divisée en deux sections : un entête (head) et un corps (body). on trouve dans l?entête des balises spécifiques d?entête qui fournissent des informations d’ordre général sur le document à afficher. et on trouve dans le corps le document à afficher et ses mises en forme par des balises spécifiques de corps.

voici comment s?organise une page html,

aller plus loin

les connaissances qui précèdent sont succinctes et sont le minimum nécessaire à la compréhension des prochains articles sur l?optimisation du code html de vos pages web. davantage de connaissances en html est néanmoins préférable.

vous trouverez sur le site du zéro un excellent tutorial sur le xhtml, un « html amélioré » (compris par les moteurs de recherche). vous devriez en peu de temps faire d?immenses progrès.

pour aller encore plus loin, il peut être intéressant de consulter les standards html 4.01 et xhtml 1.1.