Les 6 extensions Firefox indispensables du développeur Web
Publié le 28/06/10 par Grégori DESAI - Catégorie : Développement
Firefox propose par l'intermédiaire de ses plugins, de nombreux outils qui permettent de gagner un temps précieux dans vos développements. Les plugins que je vais vous présenter ici sont ceux que j'utilise dans mes travaux personnels et professionnels. Je les considère comme indispensables !
Barre d'outil Webdeveloper
C'est l'outil de base que tout bon développeur se doit d'avoir sous firefox. La barre d'outil vient se caler entre les tabs et les bookmarks et donne accès à de multiples fonctionnalités.
En vrac, ce dont je me sers (non exhaustif) :
- Edition du HTML et CSS à la volée
- Désactivation du cache navigateur, du javascript, etc.
- Redimensionnement de la fenêtre du navigateur : utile pour tester l'aspect d'un site sous différentes résolutions
- Entourer les éléments lors du survol de la souris (div, span...)
- Auto-complétion de formulaires
Pour le reste, installez-le, vous ne le regretterez pas !
Installer Webdeveloper pour Firefox
Colorzilla
Marre de batailler entre tous les codes Hexa de vos fichiers CSS ? Ce plugin est fait pour vous ! Ou comment se simplifier la vie avec une pipette qui vous donnera en un clic le code d'hexadécimal (ou rvb..) d'une couleur présente sur une page web. Fonctionne partout sauf sur les médias en Flash (bouh le Flash !).
Installer Colorzilla pour Firefox
HTML Validator
Ce plugin intègre un parseur HTML/SGML identique à celui utilisé par le W3 Validator du World Wide Web Consortium. Permet de gagner un temps précieux et de voir en un coup d'oeil si une page est bien formée.
Installer HTML Validator pour Firefox
Firebug + Yslow
Firebug est l'extension idéale pour débugger rapidement du code javascript. Le plugin intègre également une console javascript en ligne de commande pour tester des bouts de script directement dans la page. Firebug permet de parcourir le DOM d'une page, de placer des points d'arrêt sur du code javascript...
Yslow est un complément de Firebug développé par Yahoo! qui est axé sur les bonnes pratiques d'une page web pour gagner en performance et en temps d'affichage. Ainsi, une note sur 100 est attribuée à une page que vous souhaitez analyser, et selon certains critères, des conseils d'optimisation vous sont donnés. Très instructif.
Installer Firebug pour Firefox
Installer Yslow pour Firefox (nécessite Firebug)
IE Tab Plus
Développer sur Firefox c'est bien, mais le rendu sur Internet Explorer n'est pas toujours celui attendu. IE Tab Plus est une extension qui permet d'utiliser le moteur de rendu du célèbre navigateur de Microsoft -installé sur votre système- dans votre navigateur favori.
Installer IE Tab Plus pour Firefox
Proposez les vôtres !
Je passe peut-être à côté de certaines extensions qui mériteraient d'attirer mon attention, je compte sur vous pour me les faire découvrir !
D'autres billets pourraient vous intéresser :
Voir tous les billets sur ce thème ! - Retour au blog
Les 4 commentaires
Le 28/06 à 23:13
Greg
a dit ...
Merci Seb pour ta contribution, c'est ajouté !
Le 22/09 à 19:57
Thomas
a dit ...
Dans ce cas, je vous parlerais bien de ceci:
http://www.spoon.net/browsers/
Ça n'est pas une extension firefox, c'est un outil externe. Mais te connaissant, suis sur que tu t'en es déjà servi.
Le 27/06 à 15:05
Philippe
a dit ...
J'ajoute que l'inspecteur de code de Firebug ne fonctionne pas avec IETAB
Still in developmentGB 2012
T'as pas parlé de IE Tab Plus qui permet d'afficher le rendu IE dans Firefox grâce à un simple clic : https://addons.mozilla.org/fr/firefox/addon/10909/