<body><script type="text/javascript"> function setAttributeOnload(object, attribute, val) { if(window.addEventListener) { window.addEventListener('load', function(){ object[attribute] = val; }, false); } else { window.attachEvent('onload', function(){ object[attribute] = val; }); } } </script> <iframe src="http://www.blogger.com/navbar.g?targetBlogID=3365508&amp;blogName=gou+blog&amp;publishMode=PUBLISH_MODE_HOSTED&amp;navbarType=BLUE&amp;layoutType=CLASSIC&amp;searchRoot=http://www.tgou.ca/search&amp;blogLocale=fr_CA&amp;v=1&amp;homepageUrl=http://www.tgou.ca/&amp;vt=-8053743305835652900" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" height="30px" width="100%" id="navbar-iframe" allowtransparency="true" title="Blogger Navigation and Search"></iframe> <div></div>

Gou blog

 5 septembre 2006

Structurer ses CSS, une révision

Ce matin j'ai reçu un petit courriel de Ève Février, enseignante au Cégep-Ste-Foy en Techniques d'intégration multimédia. Elle me demandait cordialement l'autorisation de pouvoir pointer sur deux billets de mon blog dans le cadre de son cours. Aucun problème... Et suite à la correction des liens brisés qu'elle m'a signalé, je dois dire que j'ai réalisé que je devais rectifier certaines choses dites il y a un certain temps...

Tout d'abord, la notion de la structure des CSS est primordiale et est grandement utilisée dans mon contexte de travail, et ce depuis maintenant au moins deux ans. Ça a donc fait ses preuves chez nous et j'ai aucune intention de revenir en arrière. Par contre, la méthode s'est raffinée un peu.

Simplifions

Dans l'exemple présenté antérieurement (en 2004), je faisais mention d'une structure organisée, soit, mais qui reposait sur l'utilisation d'une CSS d'importation qui, elle, ne contenait aucune déclaration de styles. Elle ne faisait que ré-orienter. Cette CSS est maintenant révolue. J'ai modifié le système et on retrouve une CSS principale (voir l'image ci-desous) qui redirige vers les CSS par médium et à la CSS de niveau supérieur, tout en contenant l'ensemble des déclaratiosn de styles de base (générales).

Un dépot central?

Les plus attentifs d'entre-vous remarquerez aussi que les liens entre les CSS ne sont pas faits de façon absolus, mais plutôt de relatifs (avec le fameux ../ pour monter d'un niveau). Cette particularité est dûe à des problèmes de configuration entre les postes de travail (lorsqu'on est en local) et l'arrivée dans l'environnement des serveurs. Ça nous a causé tout plein de maux de têtes.

Le plus gros problème que l'on a eu de l'utilisation d'un dépot unique a été la sécurité. Effectivement, étant donné que nos systèmes se retrouvent derrière une protection (iChain), le système ne référait pas à la bonne version des CSS. Je vous épargne le jargon technique, car je ne le comprend pas trop moi-même... M'enfin, ce qui est important, c'est que le dépot unique, ça ne fonctionne pas!

Ce n'est que cet été qu'on a tout réglé. Dorénavant, il n'y a plus de dépot unique. Toutes les CSS sont ajoutées à même le code d'application, mais on a un petit plus, soit une gestion centralisée, tout comme si on avait un dépot unique!

Un répertoire unique!

Cette gestion centralisée se fait par l'utilisation d'un répertoire unique dans toutes les applications, nommé UI (user interface, je sais, c'est pas génial, en anglais... mais bon, ça a été décidé rapidement il y a un sacré bout de temps!)... alors, un répertoire nommé UI qui contient les CSS et les images... Toutes les CSS et toutes les images, y compris celles du ministère (celle de très haut niveau).

Ce que l'application fait (grâce à Maven, voir le billet cité plus haut à cet effet), c'est qu'elle importe la version des CSS que l'on désire. Et le chemin d'apppel (via les url relatifs) demeure inchangé.

En conclusion

Merci à Ève de m'avoir fait allumer ce matin et de m'avoir permis de remettre en perspectives certaines choses que j'ai dites il y a maintenant deux ans. Le fond est encore très solide, c'est la forme qui a changé.

Libellés : , , ,

Écrit par Thierry Goulet 07:41

0 Commentaire(s)

Faire un commentaire

Ce site s'affiche mieux avec un fureteur conforme aux standards...

Contrat Creative Commons
Cette création est mise à disposition sous un contrat Creative Commons