Les feuilles de styles qui deviennent boulimiques

[BigVicente]

Les feuilles de style demandent vraiment beaucoup de rigueur !

Lorsque j'ai commencé à faire le squelette de mon site j'ai décider de m'initier aux nouvelles technologies du net (il y a longtemps je faisais du html pur mais depuis ça a bien changé !), donc xhtml + css (+ php + mysql).

J'ai commencé par me faire un squelette de feuille de style global, puis je me suis lancé dans le codage du site puis au fur et à mesure de l'ajout des différentes parties de mon site la feuille de style s'est mise à gonfler et à devenir de plus en plus complexe... Arriva un moment ou elle etait trop complexe, j'ai donc pris une après midi pour la simplifier et surtout standardiser les différentes parties de mon site. Ca allait beaucoup mieux après et j'ai pu continuer à avancer.

Maintenant je rentre dans l'étape de finalisation du site, et je me rend compte qu'au fur et a mesure de la fin du développement je me suis encore éloigné de la standardisation des parties du site et que plein de petites parties sont venues se greffer dans la feuille de style pour telle ou telle chose (ex : ici je voudrais tel truc aligné à droite, ici ces images doivent avoir des bordures, par contre celle plus bas non car se sont des logos...). Et la c'est le drame, la visibilité est plutôt faible et le découragement gagne ! Mais bon c'est plutôt la fatigue

Bref ce petit topic pour une réflexion simple : il suffit de ne pas être assez rigoureux pendant quelques temps et on se retrouve vite submergé Bon bien entendu le problème n'est pas si gros, en une après midi je pourrai remettre de l'ordre la dedans mais d'après les discussions que j'ai eu avec des amis je ne suis pas le seul à avoir rencontré ce problème au cour du développement d'un site

PS pour les modos : Je ne savais pas ou partager cette réflexion, je l'ai mis ici, si cela ne correspond pas n'hésitez pas à déplacer ou supprimer ;-)

PS pour les codeurs : Je bosse uniquement sous Linux, j'ai entendu dire que sous msie il manquait la bordure supérieur de mon menu du haut de page, si vous avez des idées... (mon site est en signature)

La page qui me pose tant de soucis, j'ai taché de faire une présentation clair, mais le contenu lui par contre... (et le validator du w3c me signal plein d'avertissement...) : http://www.bigvicente.com/styles/ant/screen.css

[Aprilwine]

Bof j'ai rencontré la même chose, mais il y a un petit morceau d'info qui pourrait vous aider:

Selon moi, c'est mieux d'écrire toute la page en (X)HTML sans aucun style. Regardez-la dans le browser. Puis, commencez (délicatement) à ajouter de petites lignes de CSS pour développer une idée visuelle: les polices, l'alignement, etc. Laissez votre contenu vous diriger et ne dites pas "...et je veux ça là, et ça justement là, et...". Je suis une personne qui veux chaque petite chose exactement positionnée, mais la plupart du temps, il n'est pas nécessaire... et comme ça on peut réduire la taille des feuilles de style!

Modifié 18 Mars 2006 par Aprilwine

[Dudu]

Salut,

Ça me semble normal, c'est partie intégrante d'une création.

Quand tu construis un immeuble, il y aura forcément un long moment pendant lequel il va y avoir des gravats partout, de la poussière, etc etc.. un bordel monstrueux.

Mais ensuite vient le temps où, la construction achevée, on se charge de tout nettoyer, de fignoler l'architecture intérieure. Et là seulement ça devient une construction rutilante prête à être morcelée en appartements vendables.

Un site, c'est la même chose. Pour ma part, je ne fais jamais attention à l'amoncellement de code CSS lorsque le site est encore en construction. J'essaie juste que ce soit un minimum lisible pour m'y retrouver moi-même mais sans plus.

Mais une fois fini, là oui on peut s'attaquer au déboguage, à l'optimisation, au regroupement d'informations redondantes. Et pourquoi pas en ayant pris une petite journée ou deux de recul car effectivement la lisibilité est mauvaise quand on est encore "la tête dans le guidon".

Bref, çà me semble complètement logique. Pas de souci à se faire

Reste aussi le problème du poids de la CSS: dans le cas d'une mise en page extrêmement complexe, il peut arriver que le fichier .css reste très lourd malgré les optimisations. Mais là encore, c'est un faux problème: une feuille de style ne reste rien d'autre qu'un simple fichier texte, donc c'est par définition très léger: même en bas débit une feuille de style se charge très rapidement, fût-elle remplie de redondances.

Un petit détail bon à savoir pour grappiller de précieux octets tout en gardant une lisibilité correcte: utiliser les tabulations (1 octet) plutôt que les espaces (1 octet/espace) lorsqu'on indente son code.

PS: entièrement d'accord avec AprilWine.

[BigVicente]

Merci pour toutes ces petites infos

Pour moi je pense que la solution viendra en repartant d'une page vide avec le site comme il est à coté pour servir de model. Et je referais tout de facon plus optimisé et mieu pensé

Enfin tout cela est tres interessant à faire je trouve mais par moment on peut se sentir submergé quand on part de zero Mais c'est aussi comme ca qu'on apprend

[Monique]

Bonjour,

Des articles pleins de conseils et d'astuces pour organiser une feuille de style :

- Architecture des CSS

- Trucs et astuces CSS (1 et 2)

- Écrire des feuilles de style efficaces

[Aprilwine]

Ben, je viens de rendre visite à votre site de photographie... et que c'est merveilleux! J'adore toutes ces images elles possèdent une clarté diamantine. Bravo.

[BigVicente]

Bonjour,

Des articles pleins de conseils et d'astuces pour organiser une feuille de style :

- Architecture des CSS

- Trucs et astuces CSS (1 et 2)

- Écrire des feuilles de style efficaces

<{POST_SNAPBACK}>

Ah bien ! J'en avais cherché en francais sans avoir rien trouvé... Merci

Ben, je viens de rendre visite à votre site de photographie... et que c'est merveilleux! J'adore toutes ces images elles possèdent une clarté diamantine. Bravo.

<{POST_SNAPBACK}>

Merci

[xpatval]

Pourtant, penser architecture d'un site en appliquant des règles css seulement à la fin peut se révéler être, aussi, une perte de temps...

Imaginer l'architecture avec des positionnements de blocs en absolute, et élaborer sa feuille de style seulement à la fin va très vite devenir laborieux...

La partie HTML, dans ce cas, doit être pensée en même temps que les fondations en CSS, me dis-je...

xpatval

[Monique]

Bonjour,

La partie HTML, dans ce cas, doit être pensée en même temps que les fondations en CSS, me dis-je...  

xpatval

<{POST_SNAPBACK}>

Un site forme un tout : il y a le contenu et sa présentation, la navigation, la charte graphique, le référencement... Je pense qu'avant de se lancer dans la phase de création, une phase de réflexion est indispensable pour pouvoir tenir compte de l'interaction entre ces différents éléments et en tirer le meilleur parti.

Je suis persuadée que la qualité finale est à ce prix et qu'il est toujours risqué de commencer la création d'un site sous un seul angle, quel qu'il soit !

[xpatval]

Comme le dit Dudu, l'immeuble ne sera officiellement ouvert que lorsque tous les travaux seront finis. Les gravats auront été enlevés.

La construction aura été pensée au préalable, bien sur.

Mais dans le cadre de ce post, j'estime qu'il n'est pas forcément facile de dissocier le HTML des règles CSS, pour peu qu'on use de Float ou d'Absolute.

Et il est évident qu'une réflexion logique des différents composants du site ait abouti à une architecture viable. Commencer un site par une mise en page et un design au top, pour finir par l'affichage d'un contenu dynamique pas encore inséré dans une base (par exemple) va faire désordre....