Convertir Une Page Existante (CSS Standards)
par Christophe Ducamp (commentaire sur Eric Meyer Design)
vendredi 4 juin 2004
Cet exercice tiré de Eric Meyer ISBN 0-7357-1245-X est à pratiquer avec le site compagnon : http://www.ericmeyeroncss.com. L'idée est de prendre une page existante balisée à la vieille école du HTML avec plein de tables pour la convertir en HTML/CSS. Cet exercice doit démontrer l'avantage du design CSS.- Le nombre d'images doit être réduit au minimum
- Nous supprimerons quelques tables
- Le produit fini doit se rapprocher d'une vraie conception HTML proche des standards
Préparation
- Téléchargez le dossier sur http://www.ericmeyeroncss.com/projects/01/proj01.zip et décompressez l'archive sur votre bureau (winzip nécessaire)
- Ouvrez un nouveau fichier site CityDesk que vous nommerez EricMeyerCss
- Importez tous les fichiers dans un dossier que vous pourriez nommer EricMeyerProjetUn en utilisant la commande Insert > Import Folder From Disk
- La solution détaillée des explications du code est délivrée sur le wikicompagnon : http://www.wikiservice.at/fractal/wikidev.cgi?FR/CityDeskEtDesignStandards/ConvertirUnePageExistante
Les fichiers de travail :
- Projet ch0101 - la page source plein de tableaux
- Projet ch0102 - la page avec un aperçu de la structure en rouge
- Projet ch0103 - la page avec élimination des éléments de structure
- Projet ch0104
- Projet ch0105
- Projet ch0106
- Projet ch0107
- Projet ch0108 - la page avec le sommet restauré (voir explications détaillés sur le wiki compagnon)
- Projet ch0109
- Projet ch0110 - contenu de l'article mis en forme
- Projet ch0111 - mise en forme du titre de l'article
- Projet ch0112 - "pullquote" citation incluse dans l'article
- Projet ch0113 - restauration de la citation dans l'article
- Projet ch0114 - la barre à droite (mise en forme)
- Projet ch0115 - barre de droite (mise en forme du style)
- Projet ch0116 - barre de droite : les ratings
- Projet ch0117 - le "tip" dans la barre de droite
- Projet ch0118 - mise en forme du pied de page
- Projet ch0119 - le fichier final HTML CSS
A bientôt
