Il existe une flopée de logiciels dédiés a cette tache qui , chacun dans leur coins, sont capable d’inspecter la qualité des codes produits et d’analyser les temps de chargement, les performances javascript, php et j’en passe mais c’est “chiant” quand on est en phase de développement de tester chaque script et css dans chacun de ces logiciels et dans chaque navigateurs…
Une solution gratuite, efficace et performante est l’utilisation de Firefox et d’un certains nombres de modules qui va permettre de gagner du temps de développement, d’être sure du bon rendu des pages et surtout d’améliorer les pages pour le chargement optimale de la page pour chez le visiteur.
Alors on prend la dernière version de firefox 3.x et ont y rajoute :
- IEtab : https://addons.mozilla.org/fr/firefox/addon/1419 qui permet d’utiliser le moteur de rendu HTML d’Internet explorer en lieu et place de celui de FF pour valider la compatibilité avec firefox ET IE ce qui représente 90% des navigateurs utilisés dans le monde…
- FireBug : https://addons.mozilla.org/fr/firefox/addon/1843 qui fait office de debugger,de moniteur et d’éditeur CSS, HTML, et JavaScript permettant une analyse très fine de la qualité du code et du respect des differents standards. Plus d’infos sur sa page web officiel : http://getfirebug.com/
- PageSpeed : http://code.google.com/intl/fr/speed/page-speed/ de chez google qui est un addon de FireBug est qui permet l’optimisation du chargement des pages web de façon très pointu (c’est pas comme si google n’avait pas réfléchis a la question) grâce a des rapports très fins (directement dans firebug) pointant toute les mauvaises pratiques faisant perdre du temps au rendu de la page…
Uniquement Firefox et 3 extensions peut permettre une optimisation de la qualité du code et du rendu de manière très très importante, ce qui aujourd’hui au temps des connexions ADSL ne semble plus du tout être la priorité des intégrateurs WEB et autre webmestre même professionnels. Voila a ce sujet une page en anglais regroupant les 14 règles de base et leurs explications pour la réalisation d’un site web performant
Une autres pistes pour les sites requérant une visibilité parfaite sur toute les plateformes et avec tout les navigateurs est le service adobe browserlab (gratuit en Beta avec compte adobe) qui permet de tester et comparer le rendu graphique de vos pages grâce a des systèmes de calques et de rendus cote a cote…
Il ne faut pas oublier qu’une page de garde qui met plus de 4 secondes a se charger ou qui contient des erreurs de rendu est considéré de façon inconsciente par l’ internaute comme une page à probleme ce qui au niveau de la première l’impression donnée n’est pas des meilleurs…
Voila en espérant que cela vous aide…
Surtout n’hesiter pas a commenter et a faire remonter vos experience avec d’autres Extensions firefox utile dans cette optique.
Mots-clefs : optimisation web, moteur de rendu, HTML, webmaster, devellopement, firebug, pagespeed, mozilla, firefox, css, js, javascript, toolbox, optimize, code quality, code policy, extension, bonne pratique, debuggage, rapidité, render quality, acceleration, speedup
15 juin 2009 à 20:43 |
free software pawaaaa !!!
; )