Comment bien démarrer en HTML ? On manque souvent d'un bon exemple. Bien évidemment, il faut limiter autant que possible l'utilisation des tableaux. Le positionnement des éléments de la page doit se réaliser avec les divisions (< div >).
Plutot que de faire une liste de principes de bonne conduite. Essayez :
http://www.csscreator.com/version2/pagelayout.php




De quoi s'agit t'il ? Cet outil génère un template (une page vierge) à partir de de quelques informations recueillies par un formulaire.
C'est une petite interface pour choisir des couleurs et une zone de prévisualisions. A partir du formulaire on accède à différente configuration de format de sortie (HTML, XHTML,...). On peut définir une mise en forme de la page comme le centrage de la page. On choisit la présence, la largeur et la couleur de fond d'une colonne de gauche, de droite, du header, du footer, ... L'interface de choix des couleurs est un peu délicate à utiliser. En passant la souris sur les 3 barres, les curseurs jaunes se déplacent. Il faut ensuite cliquer dans un champ couleur pour déposer la couleur.
Pour bien comprendre, une petite vidéo est plus efficace que de nombreuses explications :

L'intérêt de l'outil est dans la possibilité de générer un gabarit HTML + CSS au format sélectionné. On appréciera de visualiser les différences entre les formats HTML et XHTML et leur déclinaison en grammaire stricte , transitional ou frameset. On appréciera également la mise en forme à l'aide de division positionnée dans l'espace de la page, alors que de nombreux sites sont encore construits à l'aide de tableau.
L'intérêt de l'outil n'est pas de générer un template à forte valeur ajoutée. On se demande souvent comment faire du HTML car au-delà du langage et de ses possibilités, il y a une philosophie à appliquer : séparer le contenu structuré (HTML) et les informations de mises en forme (CSS). Et cette application le fait bien. Elle offre un exemple personnalisé d'un fichier html ou xhtml bien construit. J'invite le lecteur désireux d'apprendre le HTML ou soucieux de la qualité et de l'efficacité de sa production HTML d'étudier les pages générées par cet outil. Il est objectivement important de produire un code respectueux des standards :

• la production de pages déclinées du template et de la feuille de style est simplifiée.
• Le site pèse moins lourd
• Le code sera plus facilement interprétable par les robots des moteurs de recherche donc mieux référençable
• Le code ne pose pas d'obstacle d'accessibilité

Le cout engendré par la production d'une page respectant les standards existe t'il ? Il est difficile de répondre oui. C'est une manière de faire, pas un travail supplémentaire. Par contre l'économie à court terme est évidente la déclinaison du template est grandement facilité.

Ce billet est le premier d'une série destinée à énoncer les bonnes pratiques du développement web. Ces bonnes pratiques sont justifiées par des impératifs économiques. Il est notament important de garantir la maintenabilité de l'application et son évolutivité. La qualité du code influera sur le cout des évolution. L'apparition d'un bug en exploitation peut représenter des manques à gagner conséquent et justifie un cloisonement atomique de tout ce qui peut l'être de sorte d'offrir au développeur une information facilement compréhensible. Si on comprends facilement, alors on voit les erreurs facilement.