Feuille de style, faut-il limiter leurs tailles?

**Death83** · 27/01/2006, 16h39

Salut a tous,

je me posait une question.

Qu'elle est le plus avantageux:

faire du full CSS et avoir une feuille de style de 50 ko ou bien mettre dans la feuille de style que les styles communs et le mettre le reste dans les tag html?

**jeff_!** · 27/01/2006, 18h05

salut
une feuille de style de 50ko

j'veu voir

ca me parrait ernorme

**Resyek** · 27/01/2006, 18h31

J'ai pas jusqu'à 50 Ko, m'enfin, celle que j'utilise actuellement fait 35 Ko.

Quand tu paramètres tout en CSS, entete, menu, pied de page, un corps de page contenant plusieurs "entités" : Bloc de Recherche, Blocs d'affichage, Blocs de listes, onglets etc... tu peux arriver à de grosses CSS.

Je te conseillerais personnellement de ne pas mettre de "mise en page" dans tes pages HTML. C'est nettement plus efficace de tout gérer en CSS. Et 50Ko ce n'est pas si gros... Surtout que ça ne transite qu'une fois.

**theanswerdu40** · 27/01/2006, 23h07

mais que lees communs dans ta feuille de style ca limitera et ca sera plus clair

**francis m** · 27/01/2006, 23h27

50k c'est beaucoup quand-même

moins un fichier est grand plus vite il sera chargé, donc sur le fond il vaut mieux une fichier css général court avec quelques instructions spécifiques dans la feuille html. Mais ces instructions sont également chargées, donc si elles apparaissent souvent, il vaut mieux tout mettre dans ta feuille de style

**Death83** · 27/01/2006, 23h57

Mittigé donc.

Pour un site ayant une dizaine de page en full CSS, ca prend vite de la place. Surtout quand les menu sont en CSS.

Je vais essayer de la réduire mais c'est pas toujours évident. Surtout qu'il y a pas mal de ligne rajouté juste pour que ca marche sur internet explorer.

**Spack** · 28/01/2006, 00h53

Question :
Y a t'il un moyen de faire un include dans un CSS? Ca permettrait de diviser un gros fichier un plusieurs petits... Même si au final ça revien au même

...

**francis m** · 28/01/2006, 01h16

non tu ne peux pas faire un inclide dans un css
et ce n'est pas intéressant : il vaut mieux charger un gros fichier que plusieurs petits

**francis m** · 28/01/2006, 01h19

mais quand-même, comme jeff, je voudrais bien voir une feuille de style de 50k
la mienne en fait 6 et j'ai des styles pour chaque type de paragraphes (p, h1, h2, etc), des classes spécifiques, des styles pour les formulaires, pour les liens (et différents selon les id), pour des id comme mon entete, le contenu, le menu, etc...

**Death83** · 28/01/2006, 11h07

Envoyé par francis m

mais quand-même, comme jeff, je voudrais bien voir une feuille de style de 50k
la mienne en fait 6 et j'ai des styles pour chaque type de paragraphes (p, h1, h2, etc), des classes spécifiques, des styles pour les formulaires, pour les liens (et différents selon les id), pour des id comme mon entete, le contenu, le menu, etc...

ca depend, tu fait ta mise en page avec des tableaux? Moi j'utilise que des <div> et don ilfaut tous les définir dans la feuille de style alors ca va tres vite. Je ne défini pas que mes polices dans la feuille de style.
J'ai aussi styles "double". Pour que le style change au survol de la souris par exemple.

**francis m** · 29/01/2006, 01h04

non je n'ai pas fait la présentation avec des tableaux, mais avec des divs comme toi

et j'en ai quelques-uns (une dizaine), ainsi que des propriétés communes aux textes ou aux blocs tel que .blink { font-weight: bold; color: #CC00CC;} (environ une vingtaine)

**jeff_!** · 29/01/2006, 18h44

non tu ne peux pas faire un inclide dans un css

dans une feuille css tu peut en appeler d'autre mais bon ca sert pas en grand chose
maintenant je me demande si la feuille html n'est pas encombre de balise inutile ou une mauvaise utilisation des selecteurs voir d'un mauvais choix dans le positionnement

mais bon faut voir la complexité de la page

**Phnx** · 29/01/2006, 21h01

euh a la limite tu peut alleger ta page css en y mettant juste le design pour ton site.
Se qui concerne la disposition d'une seule page tu peut l'inclure directement dans la page html concernée ( entre les balises <script></script> parce que mettre du css directement dans les atributs de la balise c'est pas super)

**ePoX** · 30/01/2006, 00h04

Tu peux surement optimiser la feuille en la divisant et ne charger que ce qui est utile à la page.

Il y 'à surement des choses dont tu as besoin en home mais pas sur le panier et inversement. Sa ne regle pas le probleme en soit, sa fait juste passer un peu mieux la pillule pour le client.

Sinon faut voir si tu n'à pas des attributs inutile.

Bon tu peux aussi retirer les retours chariots pour gagner un peu mais bon..

**Death83** · 30/01/2006, 01h39

Envoyé par ePoX

Tu peux surement optimiser la feuille en la divisant et ne charger que ce qui est utile à la page.

Il y 'à surement des choses dont tu as besoin en home mais pas sur le panier et inversement. Sa ne regle pas le probleme en soit, sa fait juste passer un peu mieux la pillule pour le client.

Sinon faut voir si tu n'à pas des attributs inutile.

Bon tu peux aussi retirer les retours chariots pour gagner un peu mais bon..

Non les retour chariots ne sont pas prix en compte. Quand je regarde ma feuille de style depuis un navifateurs c'est tout écrit sans espaces et sans retour chariots(sauf au bout de laligne bien sur). Par contre pour le javascript ca marche. J'ai gagné 2 ko en faisant ca lol.

**siddh** · 30/01/2006, 03h21

salut,
alors il existe une directive import en css ...

Sinon, personnelement, je préfère "éclater" mes feuilles :

forms.css pour les formulaires
menu.css pour mon/mes menus
style.css pour le style général du site
...

Tu doit aussi pouvoir optimiser tes feuilles,
par exemple tu peux remplacer

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
border-color: #FFFFFF;
border-style: solid;
border-width: 1px;

par

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
border: 1px #FFFFFF solid;

et il en est de même pour pas mal de propriétés, comme pour les marges ou tu peux préciser 4 valeurs dans margin au lieu de mettre des top, left, right et bottom ....

Ca me semble quand meme etrange d'avoir des feuilles de styles aussi grosses.
En général, on essayes d'avoir une certaine harmonie au niveau des couleurs, du coup on a rarement plus de 5 couleurs différentes sur un site.
De même, la structure des pages est en général la même, on a les memes éléments avec les mêmes classes et id dans les différentes pages.
Seul le contenu change.

Dans la dernière application web que j'ai fait, j'ai une dizaine de feuilles différentes car j'ai des composants graphiques javascript.
Au total, je ne monte pas a plus de 14Ko pour l'ensemble de mes feuilles (hors images, juste les css).

**marsupix** · 30/01/2006, 06h15

siddh, lorsque tu as plusieurs fichiers css comme tu dis, on met plusieurs balises <link> à la suite pour chaque feuille et c'est bon ?

sinon perso, pour gèrer mon site entier j'ai un css de 800 lignes pas encore vraiment optimisé et elle fait 12.5Ko, sachant que meme en 56k le design du site est pratiquement instantané et seules les images de fond, dégradés et autres mettent du temps à s'afficher (en 56k je précise lol) pour venir remplir la page.
avec l'adsl, meme 512Ko, un fichier de 12.5 Ko comme ça se charge en 1 clin d'oeil

donc pour avoir une feuille de 50Ko ! faut vraiment en vouloir :p