Maintenant que nous savons comment mettre un site internet en ligne, revenons un petit peu sur le langage HTML et sur la réalisation proprement dite du site.

A la base d'un site web, il y a 2 points importants: la mise en page et la navigation (le passage d'une page à une autre).

La navigation se fait (généralement) en grande partie via un menu donnant accès à différentes pages correspondant à différentes sections du site. Selon un code similaire à:

<a href="page1.html">Page1</a><br /> <a href="page2.html">Page2</a><br /> <a href="page3.html">Page3</a><br />

Sans préjuger de la mise en page de votre site, il suffit de jeter un oeil sur le web pour constater que la plupart suivent un modèle classique: un ou plusieurs menus (généralement sur la partie supérieure ou les cotés gauches et droites) et des zones (ou cadres) de contenu. Ce à quoi, nous pouvons ajouter un bandeau supérieur, un pied de page.

Une façon classique d'aboutir à ce type de mise en page consiste à utiliser la balise HTML table. Cela donne un code du genre:

<table> <tr> <td colspan="2">Entête</td> </tr> <tr> <td>Menu gauche</td> <td>Contenu</td> </tr> <tr> <td colspan="2">Pied de page</td> </tr> </table>

Pour des raisons de lisibilité, nous ne présentons ici que le contenu du bloc "body" (en omettant les balises html, head, body et entête). Ce code n'est donc pas, en l'état, conforme à la norme HTML. Ceci dit, les navigateurs ayant été conçus (depuis l'arrivée d'internet d'explorer sur le marché) pour être permissifs, le code sera tout de même parfaitement interprété par votre navigateur. L'utilisation de la balise "table" pour ce type de mise en page à l'avantage d'être simple (à mettre en place et à comprendre) mais ne constitue pas forcément la solution la plus "moderne".

L'entête contiendra probablement le nom du site, le logo, etc. Le pied de page pourra inclure un copyright. Peu importe... La partie "menu gauche" de l'exemple devra être remplacée par un bout de code similaire à celui présenté dans le chapitre navigation.

Chacune des pages désignées par le menu aura probablement la même mise en page (le même entête, le même menu, le même pied de page).

Avec ce type de mise en page, réalisée avec du code HTML "basic", nous sommes amenés à recopier énormement de code d'une page à l'autre (le code de mise en page -i.e. table-, l'entête, le pied de page, le menu). Ainsi toute modification à apporter à l'un de ces éléments (ex: entête) doit être reporté dans toutes les pages (i.e. tous les fichiers html).

Ceci n'est pas très satisfaisant et nous allons vous montrer d'autres façons faire permettant d'éviter cet inconvénient.