Hier, il y a eu quelques ralentissement du serveur (Dreamhost) dont je fais l’éloge dans mes derniers billets. Et donc j’ai décidé de m’attaquer à l’optimisation de Webdesign-tutoriaux. Donc voici tout d’abord les outils que j’ai utilisé :

- PingDom tool est un outil permettant de mesurer le temps de chargement de chaque éléments d’une page web et ainsi de voir les images ou les Javascripts qui peuvent ralentir.
- Yslow qui est une extension Firefox pour FireBug et développé par Yahoo. Yslow mesure à peu près la même chose que PingDom mais depuis votre navigateur et en vous donnant des conseils d’optimisation.
En gros pour diminuer le temps de chargement d’une page il faut :
- Eviter d’avoir trop de requêtes http sachant qu’il y a une requête pour chaque fichier Css et Js à charger.
- Avoir des images de poids faible (généralement préférer les Gif au Jpeg) le découpage du design joue.
- Lancer les scripts Javascript à la fin de la page quand c’est possible.
La solution si vous ne souhaitez pas rentrer dans les détails est un script PHP d’aciddrop qui permet en 3 lignes de :
- Regrouper les fichiers CSS et Js en un seul pour avoir moins de requêtes Http
- Ajouter des entêtes qui expirent
- Compresser des composant de la page avec Gzip
- Minifier (de minify en anglais) les Css, Javascript et html : en gros on supprime les espaces, les tabulations et les retour à la ligne afin que les fichiers soit moins gros et donc moins long à charger
Enjoy !
February 3rd, 2008 at 9:46
Bjr.
Pour le script d’aciddrop j’avoue que j’avais vu son site mais je n’ai rien compris du tout. Ca a marché chez vous, vous n’en parlez pas.
February 20th, 2008 at 17:16
Merci pour ce petit billet, sympa et constructif !