39
Des styles qui atteignent leur cible
/* Variables de couleur
@colordef #434343; gris sombre
@colordef #f2f6e4; vert clair
@colordef #90b11f; vert foncé
@colordef #369; bleu foncé
*/
Pour.rendre.vos.commentaires.plus.signifiants,.vous.pouvez.utiliser.des.mots-clés.qui.distinguent. les. commentaires. importants.. Pour. ma. part,. j’utilise. @todo. pour. indiquer. que.
quelque.chose.doit.être.modifié,.corrigé.ou.revu.plus.tard,. @bugfix. pour.signaler.un.problème.avec.le.code.ou.un.navigateur.particulier.et.@workaround.pour.évoquer.une.solution.
de.contournement :
/* :@todo Penser à supprimer cette règle avant de publier le site */
/* @workaround: J’ai réussi à résoudre le problème dans IE en définissant
une petite marge négative, mais ce n’est pas esthétique */
/* @bugfix: Cette règle ne fonctionne pas sous IE 5.2 Mac */
En.programmation,.ces.mots-clés.sont.appelés.des.gotchas ;.ils.peuvent.être.très.utiles.au.
cours.des.phases.ultérieures.de.développement..En.fait,.tous.ces.termes.font.partie.d’un.projet.appelé.CSSDoc.(http://cssdoc.net).qui.vise.à.développer.une.syntaxe.standardisée.pour.
les.commentaires.des.feuilles.de.styles..
Supprimer les commentaires et optimiser les feuilles de styles
Les.commentaires.peuvent.considérablement.augmenter.la.taille.des.fichiers.CSS..Il.peut.
donc.être.utile.de.les.en.faire.disparaître..La.plupart.des.éditeurs.HTML/CSS.ou.des.éditeurs.
de.texte.possèdent.une.fonctionnalité.de.recherche.et.remplacement.qui.facilite.cette.opération..Vous.pouvez.sinon.utiliser.l’un.des.multiples.optimisateurs.CSS.en.ligne.comme.celui.
que.propose.www.cssoptimiser.com..L’optimisateur.supprime.non.seulement.les.commentaires,.mais.également.les.espaces.blancs,.afin.de.vous.aider.à.retirer.encore.quelques.octets.
supplémentaires.de.votre.code..Si.vous.choisissez.de.supprimer.les.commentaires.de.vos.
feuilles.de.styles,.n’oubliez.pas.d’en.conserver.une.version.avec.commentaires.pour.votre.
environnement. de. production.. Le. meilleur. moyen. de. gérer. ce. processus. consiste. à. créer.
un. script. de. déploiement. qui. supprime. automatiquement. les. commentaires. lorsque. vous.
publiez.vos.modifications.sur.le.Web..Comme.il.s’agit.d’une.technique.avancée,.mieux.vaut.
toutefois.la.réserver.aux.sites.de.grande.envergure.ou.sophistiqués.
Autrement,.le.meilleur.moyen.de.réduire.la.taille.des.fichiers.est.d’activer.la.compression.
côté.serveur..Si.vous.utilisez.un.serveur.Apache,.contactez.votre.hébergeur.concernant.l’installation.de.mod_gzip.ou.mod_deflate..Tous.les.navigateurs.web.modernes.peuvent.gérer.
ces. fichiers. compressés. avec. GZIP. et. les. décompresser. à. la. volée.. Ces. modules.Apache.
détectent.si.le.navigateur.peut.gérer.les.fichiers.de.ce.type.et,.si.c’est.le.cas,.ils.transmettent.une.version.compressée..La.compression.côté.serveur.peut.réduire.la.taille.des.fichiers.
HTML.et.CSS.de.80 %.environ,.ce.qui.libère.la.bande.passante.et.accélère.le.téléchargement.
des.pages..Si.vous.n’avez.pas.accès.à.ces.modules.Apache,.vous.pouvez.compresser.vos.
fichiers.en.suivant.le.didacticiel.(en.anglais).à.l’adresse.http://tinyurl.com/8w9rp.
Des styles qui atteignent leur cible
/* Variables de couleur
@colordef #434343; gris sombre
@colordef #f2f6e4; vert clair
@colordef #90b11f; vert foncé
@colordef #369; bleu foncé
*/
Pour.rendre.vos.commentaires.plus.signifiants,.vous.pouvez.utiliser.des.mots-clés.qui.distinguent. les. commentaires. importants.. Pour. ma. part,. j’utilise. @todo. pour. indiquer. que.
quelque.chose.doit.être.modifié,.corrigé.ou.revu.plus.tard,. @bugfix. pour.signaler.un.problème.avec.le.code.ou.un.navigateur.particulier.et.@workaround.pour.évoquer.une.solution.
de.contournement :
/* :@todo Penser à supprimer cette règle avant de publier le site */
/* @workaround: J’ai réussi à résoudre le problème dans IE en définissant
une petite marge négative, mais ce n’est pas esthétique */
/* @bugfix: Cette règle ne fonctionne pas sous IE 5.2 Mac */
En.programmation,.ces.mots-clés.sont.appelés.des.gotchas ;.ils.peuvent.être.très.utiles.au.
cours.des.phases.ultérieures.de.développement..En.fait,.tous.ces.termes.font.partie.d’un.projet.appelé.CSSDoc.(http://cssdoc.net).qui.vise.à.développer.une.syntaxe.standardisée.pour.
les.commentaires.des.feuilles.de.styles..
Supprimer les commentaires et optimiser les feuilles de styles
Les.commentaires.peuvent.considérablement.augmenter.la.taille.des.fichiers.CSS..Il.peut.
donc.être.utile.de.les.en.faire.disparaître..La.plupart.des.éditeurs.HTML/CSS.ou.des.éditeurs.
de.texte.possèdent.une.fonctionnalité.de.recherche.et.remplacement.qui.facilite.cette.opération..Vous.pouvez.sinon.utiliser.l’un.des.multiples.optimisateurs.CSS.en.ligne.comme.celui.
que.propose.www.cssoptimiser.com..L’optimisateur.supprime.non.seulement.les.commentaires,.mais.également.les.espaces.blancs,.afin.de.vous.aider.à.retirer.encore.quelques.octets.
supplémentaires.de.votre.code..Si.vous.choisissez.de.supprimer.les.commentaires.de.vos.
feuilles.de.styles,.n’oubliez.pas.d’en.conserver.une.version.avec.commentaires.pour.votre.
environnement. de. production.. Le. meilleur. moyen. de. gérer. ce. processus. consiste. à. créer.
un. script. de. déploiement. qui. supprime. automatiquement. les. commentaires. lorsque. vous.
publiez.vos.modifications.sur.le.Web..Comme.il.s’agit.d’une.technique.avancée,.mieux.vaut.
toutefois.la.réserver.aux.sites.de.grande.envergure.ou.sophistiqués.
Autrement,.le.meilleur.moyen.de.réduire.la.taille.des.fichiers.est.d’activer.la.compression.
côté.serveur..Si.vous.utilisez.un.serveur.Apache,.contactez.votre.hébergeur.concernant.l’installation.de.mod_gzip.ou.mod_deflate..Tous.les.navigateurs.web.modernes.peuvent.gérer.
ces. fichiers. compressés. avec. GZIP. et. les. décompresser. à. la. volée.. Ces. modules.Apache.
détectent.si.le.navigateur.peut.gérer.les.fichiers.de.ce.type.et,.si.c’est.le.cas,.ils.transmettent.une.version.compressée..La.compression.côté.serveur.peut.réduire.la.taille.des.fichiers.
HTML.et.CSS.de.80 %.environ,.ce.qui.libère.la.bande.passante.et.accélère.le.téléchargement.
des.pages..Si.vous.n’avez.pas.accès.à.ces.modules.Apache,.vous.pouvez.compresser.vos.
fichiers.en.suivant.le.didacticiel.(en.anglais).à.l’adresse.http://tinyurl.com/8w9rp.