Une page "simple" devrait avoir un look dans ce genre

Voici le code pour la reproduire, à copier dans un fichier avec un Notepad,... puis ouvrir avec le navigateur ou Kompozer pour modifier!
Code : Tout sélectionner
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr-fr" lang="fr-fr">
<head>
<title>SIMPLE PAGE</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<style type="text/css">
/*<![CDATA[*/
body { background-image: url(http://p2e2a.free.fr/images/1464.jpg);}
a {color: rgb(51, 0, 51);}
h1, h2 /* Titre de niveau 1, 2 en rouge*/
{
color:red;
}
p {text-indent:2em}
#menu {
float: left;
width:200px;
padding:20px;
margin-right:20px;
border: 1px dotted grey
}
#menu a:hover
{ background:white;
color:blue;}
#contenu {
margin-left: 10px}
/*]]>*/
</style>
</head>
<body>
<div id="menu">
<ul>
<li> <a href="index.html">ACCUEIL</a> </li>
<li> <a href="compte-rendu%20de%20reunion.html">COMPTE-RENDU DE REUNION</a> </li>
<li> <a href="vie%20scolaire.html" >VIE SCOLAIRE</a> </li>
<li> <a href="projets.html" >PROJETS</a> </li>
<li> <a href="mailto:p2e2a@free.fr" >NOUS CONTACTER</a></li>
</ul>
</div>
<div id="contenu">
<h1>Parents d'Elèves d'Etang-sur-Arroux Apolitiques </h1>
<p>POUR NOS ENFANTS...</p>
<p>Nous sommes persuadés que leur réussite et leur épanouissement ne peut être possible qu'en harmonie avec tous les acteurs de la vie scolaire.
C'est pourquoi nous souhaitons mettre tout en oeuvre pour que ces relations restent saines et constructives.</p>
<p>Nous sommes soucieux de l'avenir dans un contexte social de plus en plus difficile.
Nous souhaitons transmettre vos inquiétudes, vos questions et vous informer en temps réel sur les réflexions et les décisions prises lors des réunions.</p>
<p>Nous avons décidé de créer une liste apolitique et sans étiquette dans un souci d'intégrité, de transparence et de diffusion d'informations.</p>
</div>
</body>
</html>
Si la présentation ne te convient pas, ce qui est normal, c'est une base de travail, il suffit de la modifier avec les css (feuilles de styles), mais surtout pas en utilisant la barre de mise en forme de Kompozer!
Les styles permettent de fixer l'allure des titres (h1 à h6), des paragraphes, la position du menu, de la page, des arrières plans, de la couleur des caractères, leur taille,...
Si en plus la feuille de styles est un fichier appelé par chaque page, le fait de changer ce fichier permettra de modifier l'aspect de toutes les pages. C'est top pour mettre un sapin de noel en fond d'écran à Noel, ....
De plus les pages ont une allure similaire, cela fait + pro!
Evite les espaces dans les noms de fichiers !