Archive pour la catégorie ‘Modules Firefox’

La toolbar indispensable

Barre d’outils Web developper

Article réalisé par Romain


Je suis très ému de vous transmettre mon premier article. J’ai souhaité commencer par la présentation d’un plugin très utile à mes yeux pour Firefox, Internet Explorer et Opéra. Cet outil nommé web developper est très complet, il aide les webmasters pour le développement et l’analyse d’un site internet.

Attention suivant les navigateurs la toolbar est différente du point de vue du design et des fonctionnalités. Étant usagé de Firefox, je préfère vous présenter cette barre d’outils si précieuse.

Voici un échantillon des différentes fonctionnalités de celle-ci :

  • Fonction de désactivation : images, cookies, cache, java script, etc.

  • Gestion des cookies.

  • Gestion des feuilles de style CSS.

  • L’onglet divers très utile : loupe, lignes repères, rendu sur écran téléphone.

  • L’onglet entourer vous permet d’identifier rapidement les liens, les roll-over, les frames, etc.

  • Outils de validation XHTML, CSS, WAI; liens vers les spécifications W3C

  • Affichage du code source en 1 clic

  • Recadrage 800×600, 1024×768. Ce recadrage peut être personnalisé.

  • Console d’erreurs

J’utilise régulièrement la toolbar web developper pour la simple raison qu’elle est parfaite. Des mises à jour sont faites de temps en temps afin d’optimiser la performance de votre site.

Essayez-là et n’hésitez pas à donner votre avis.

Où télécharger la barre d’outils Web developper ? c’est très simple, suivez les liens ci-dessous.

Firefox > Cliquez ici

Opéra > Cliquez ici

Internet Explorer > Cliquez ici

A bientôt, Romain alias Romain ! ^^

Usages

Les barres d’outils de développeurs sont à usage multiples et leurs fonctionnalités dépendent de chaque navigateur.
Ainsi, impossible de dire qu’une barre est dans l’absolue plus performante qu’une autre, même si j’aurais récemment un penchant pour…(à suivre…)

Leur usage le plus courant :

  • Fonction de désactivation : images, cookies, scripts, popup blocker, etc.
  • Edition des feuilles de styles de la page
  • Visualisation des ID et CLASS
  • Visualisation des éléments de structure (blocs, paragraphes, etc.).
  • Outils de validation XHTML, CSS, WAI; liens vers les spécifications W3C
  • Affichage du code source en 1 clic
  • Recadrage 800×600
  • Spécificités propres

Web Developer Toolbar pour Firefox

C’est celle que j’utilise au quotidien. J’ai eu le temps de la manipuler et j’en suis pleinement satisfait.
Son point fort : la possibilité d’éditer les feuilles de styles reliées à une page pour visualiser instantanément les modifications. C’est en fait l’extension propre Edit CSS intégrée à la barre d’outils. L’avantage est indéniable : plus besoin d’aller dans l’éditeur HTML, modifier la feuille de style, enregistrer, revenir dans le navigateur, recharger la page pour voir le résultat, et refaire l’opération tant que.
Ses points faibles : aucuns, tant qu’on ne connait pas les autres barres d’outils ;

Marquer/Partager via AddInto

Module pour Firefox : MeasureIt

Module Firefox MeasureIt

Encore un petit module à rajouter a votre navigateur Firefox : MeasureIt.

Une bannière, une image, un bloc à placer sur votre boutique, seul souci vous voyez à peu près la taille mais vous ne savez pas forcement ce que cela représente en pixel. Un petit clic sur l’icône de MeasureIt (en bas à gauche de votre navigateur Firefox) et sélectionnez la zone qui vous intéresse.

Cliquez sur l’image pour le télécharger


Marquer/Partager via AddInto

Module pour firefox : Colorzilla

Outil Firefox de capture de couleurs

Article réalisé par KeNdO

Après la présentation de Firebug, je vais vous présenter d’autres outils qui me semble nécessaire lorsque vous souhaitez modifier votre thème.

ColorZilla est donc un module qui va ajouter une pipette en bas de votre navigateur FireFox, pour l’utiliser il vous suffit de cliquer dessus.

Baladez votre souris sur votre page et notamment sur les différentes zones de couleurs afin d’en obtenir le code HTML de la couleur.

Plus besoin de chercher une couleur approximativement.

Marquer/Partager via AddInto

Modifier son thème simplement grâce à Firebug

Modifier son thème

Afin de modifier son thème simplement sans pour autant avoir des connaissances en Dèv, je vous présente FIREBUG. Simple et gratuit, ce module Firefox vous permettra de modifier mais surtout de trouver les lignes de code attribuées à votre thème. De plus vous pourrez modifier votre CSS directement en Front et voir cette modification apparaitre sans pour autant  réellement changer vos codes.

Plus la peine d’acheter des thèmes hors de prix ! Analysez votre Template et changez-la simplement. De plus, vous pouvez grâce à ceci (si les fichiers ne sont pas protégés), copier/coller les thèmes qui vous plaises. « Bientôt un Billet sur cette procédure »

Entrainez vous et devenez un vrai Pro de l’intégration.

Si vous avez des questions, posez les ci-dessous

BON COURAGE POUR LA SUITE

Vidéo de l’installation

Marquer/Partager via AddInto