3 indispensables
pour le développeur Web

Cela fait maintenant quelques années que l'on développe sous Dreamweaver, et on se prend pour un champion du HTML du CSS et autre Javascript. Pourtant il arrive que notre code Javascript, si beau et si parfait, se vautre comme une m*rde, que notre mise en page HTML ressemble à tout sauf à ce que l'on voulait. Bref, on se sent tout de suite moins malin. Heureusement, ces jours sont terminés (ou presque). Voici trois outils merveilleux pour faire de vous un dieu !

Un dieu qui utilise Firefox d'ailleurs, puisque ces indispensables sont des modules complémentaires pour celui-ci. Évidement, vous êtes un développeur sérieux, à la pointe de la technologie et de la mode, alors vous devez déjà l'utiliser comme navigateur par défaut, en ayant tout de même Internet Explorer sous le coude (ou ailleurs) afin de tester comment celui-ci pourrit tout.

Bref, voici une petite présentation de ces fameux indispensables, à savoir : Web Developer, HTML Validator et Firebug.

Web Developer

L'extension Web Developer ajoute une barre de menu au navigateur et propose de nombreux outils permettant de gérer le cache, les cookies, les feuilles de styles, les images, les formulaires… Je m'en sers principalement pour :

  • Voir le contenu des cookies.
  • Activer/désactiver le CSS – ce qui permet de vérifier la bonne hiérarchisation des documents (accessibilité pour personnes handicapées).
  • Redimensionner la fenêtre pour tester le document en 800×600 par exemple.
  • Afficher le code source modifié par Javascript.

HTML Validator

En utilisant des algorithmes originellement développés par le consortium W3C, et maintenant grandement améliorés par de nombreux contributeurs, l'extension HTML Validator ajoute la validation du code HTML directement dans Firefox. Le nombre d'erreurs apparait dans la barre de statuts, ce qui donne toujours de joyeuses surprises lorsque l'on parcourt nonchalamment le web – à se demander si certains ont entendu parler de validation…

L'extension remplace l'afficheur de source par une version améliorée qui met en évidence les erreurs rencontrées avec une aide contextuelle et des exemples à faire et ne pas faire.

Bref, plus besoin de mettre en ligne vos documents pour les faire valider par un serveur tiers, puisque la validation se fait immédiatement à l'intérieur même de Firefox !

Firebug

Maintenant, voici la perle des perle, le modestement nommé Firebug. Cette extension est un trésor ! Elle permet :

  • de débuger votre code Javascript, et même d'exécuter du code à la volée.
  • de parcourir le DOM les doigts dans le nez.
  • d'activer / désactiver / éditer les propriétés CSS des éléments.
  • de chronométrer le temps de téléchargements de vos ressources.
  • et tellement plus encore !

S'il ne fallait avoir qu'une seule extension, ce serait celle-ci. Que du bonheur !

Pour terminer, et pour vous remercier de votre attention, je vais terminer ce billet par un cadeau bonus (comme sur les DVD, c'est fou !) par une dernière extension pas merveilleuse merveilleuse, mais quand même pratique : IE Tab.

IE Tab (en bonus)

L'extension IE Tab permet, par un simple clic sur son icône (dans la barre de statuts) de passer du moteur d'affichage de Firefox (Gecko) à celui d'Internet Explorer (Daube 2000). Bon, ça n'a l'air de rien comme ça, mais c'est très pratique pour voir vite fait ce qu'Internet Explorer fait de notre mise en page soigneusement confectionnée…

Maintenant fini de discuter. A vous les réalisations soignées, propres et respectueuses des standards.

Je ne veux plus voir une page sans DOCTYPE (si si, ça arrive) !

Laisser un commentaire

Pas de commentaire