40
Maîtrise des CSS
Guides de styles
La.gestion.de.la.plupart.des.sites.web.occupe.généralement.plusieurs.personnes.et.parfois.
même,.pour.les.sites.d’envergure,.plusieurs.équipes.chargées.de.différents.aspects.du.site..
Les.programmeurs,.les.gestionnaires.de.contenu.et.les.autres.développeurs.d’interface.peuvent.avoir.besoin.de.comprendre.le.fonctionnement.des.éléments.de.votre.code.et.de.votre.
mise.en.page..Il.est.donc.judicieux.de.créer.un.guide.de.styles..
Le.guide.de.styles.est.un.document,.une.page.web.ou.un.microsite,.qui.explique.comment.
se.coordonnent.le.code.et.la.conception.graphique.d’un.site..Au.départ,.le.guide.de.styles.
doit.définir.les.directives.de.conception.générales.comme.le.traitement.approprié.pour.les.
titres.et.les.autres.éléments.typographiques,.indiquer.comment.fonctionne.la.structure.de.grille.
et.préciser.la.palette.de.couleurs.à.utiliser..Les.guides.de.styles.de.qualité.détaillent.aussi.
le.traitement.de.la.répétition.des.éléments.comme.les.articles,.les.news.et.les.notifications,.
afin.d’indiquer.comment.les.implémenter..Les.guides.de.styles.plus.détaillés.peuvent.même.
inclure. des. informations. concernant. les. standards. en. matière. de. programmation. comme.
la.version.XHTML/CSS.utilisée,.le.niveau.d’accessibilité.désiré,.les.détails.concernant.la.
prise.en.charge.des.navigateurs.et.des.bonnes.pratiques.de.programmation.générales.(voir.
Figure 2.6)..
Figure 2.6
Exemple de guide
de styles.
Les.guides.de.styles.sont.un.excellent.moyen.de.transmettre.un.projet.à.ceux.qui.doivent.
en. assurer. la. maintenance. ou. se. charger. de. son. implémentation.. En. consignant. quelques.
directives.simples,.vous.les.aiderez.à.contrôler.le.développement.du.site.et.à.minimiser.la.
fragmentation.des.styles.au.fil.du.temps..Les.guides.de.styles.sont.en.outre.une.excellente.
introduction.pour.les.nouveaux.employés.ou.les.contractuels.à.un.système.qui.ne.leur.est.pas.
familier.et.peut.d’abord.paraître.compliqué.
Malheureusement,.le.guide.de.styles.risque.de.se.désynchroniser.rapidement.avec.le.site.en.
production.et.sa.mise.à.jour.requiert.quelques.efforts..C’est.la.raison.pour.laquelle.je.préfère.utiliser.une.sorte.de.guide.de.styles.actif.que.j’ai.appelé.un."portfolio.de.motifs".(voir.
Figure 2.7).
Maîtrise des CSS
Guides de styles
La.gestion.de.la.plupart.des.sites.web.occupe.généralement.plusieurs.personnes.et.parfois.
même,.pour.les.sites.d’envergure,.plusieurs.équipes.chargées.de.différents.aspects.du.site..
Les.programmeurs,.les.gestionnaires.de.contenu.et.les.autres.développeurs.d’interface.peuvent.avoir.besoin.de.comprendre.le.fonctionnement.des.éléments.de.votre.code.et.de.votre.
mise.en.page..Il.est.donc.judicieux.de.créer.un.guide.de.styles..
Le.guide.de.styles.est.un.document,.une.page.web.ou.un.microsite,.qui.explique.comment.
se.coordonnent.le.code.et.la.conception.graphique.d’un.site..Au.départ,.le.guide.de.styles.
doit.définir.les.directives.de.conception.générales.comme.le.traitement.approprié.pour.les.
titres.et.les.autres.éléments.typographiques,.indiquer.comment.fonctionne.la.structure.de.grille.
et.préciser.la.palette.de.couleurs.à.utiliser..Les.guides.de.styles.de.qualité.détaillent.aussi.
le.traitement.de.la.répétition.des.éléments.comme.les.articles,.les.news.et.les.notifications,.
afin.d’indiquer.comment.les.implémenter..Les.guides.de.styles.plus.détaillés.peuvent.même.
inclure. des. informations. concernant. les. standards. en. matière. de. programmation. comme.
la.version.XHTML/CSS.utilisée,.le.niveau.d’accessibilité.désiré,.les.détails.concernant.la.
prise.en.charge.des.navigateurs.et.des.bonnes.pratiques.de.programmation.générales.(voir.
Figure 2.6)..
Figure 2.6
Exemple de guide
de styles.
Les.guides.de.styles.sont.un.excellent.moyen.de.transmettre.un.projet.à.ceux.qui.doivent.
en. assurer. la. maintenance. ou. se. charger. de. son. implémentation.. En. consignant. quelques.
directives.simples,.vous.les.aiderez.à.contrôler.le.développement.du.site.et.à.minimiser.la.
fragmentation.des.styles.au.fil.du.temps..Les.guides.de.styles.sont.en.outre.une.excellente.
introduction.pour.les.nouveaux.employés.ou.les.contractuels.à.un.système.qui.ne.leur.est.pas.
familier.et.peut.d’abord.paraître.compliqué.
Malheureusement,.le.guide.de.styles.risque.de.se.désynchroniser.rapidement.avec.le.site.en.
production.et.sa.mise.à.jour.requiert.quelques.efforts..C’est.la.raison.pour.laquelle.je.préfère.utiliser.une.sorte.de.guide.de.styles.actif.que.j’ai.appelé.un."portfolio.de.motifs".(voir.
Figure 2.7).