Nuances des extensions Google Chrome pour les développeurs. Extensions Google Chrome pour le développement Web et plus encore. Quelles versions de Chrome existe-t-il ?

Navigateur Google Chrome– un excellent choix pour les concepteurs et les développeurs Web. Avec les extensions pour GoogleChrome, vous pouvez ajouter plus de fonctionnalités, qui peut aider à la conception, à la recherche d'erreurs et à d'autres travaux sur le site. Nous présentons ici les meilleures extensions Chrome pour les concepteurs et les développeurs.

3.


Test de résolution– cette extension est conçue pour vérifier les pages Web avec différentes résolutions d'écran et vous pouvez définir vos propres paramètres de résolution. Cet outil est très pratique pour vérifier l’apparence de votre conception sur différentes tailles d’écran.

4.


Pendule étend les fonctionnalités des outils intégrés de Google Chrome. Avec cette extension, les utilisateurs disposent de nombreuses fonctionnalités supplémentaires, telles que : l'évaluation des balises de restriction à l'aide des services Web automatisés du W3C, le masquage d'images sur une page, l'affichage de scripts intégrés dans une page et bien d'autres.

5.


En civil Il ne fait bien qu'une chose : il supprime tous les CSS de la page. L'une des méthodes préférées pour évaluer l'accessibilité d'une page Web consiste à supprimer les styles CSS et à comparer la lisibilité de la page avec et sans les styles. Cette approche simule une situation dans laquelle l'utilisateur n'a qu'une page partielle affichée sur son écran et ne peut s'appuyer que sur les balises de page pour accéder au contenu.
Bien que ce programme ait été créé à l'origine pour tester des pages Web, vous pouvez l'utiliser pour afficher vos styles préférés de manière « sans style » (afin que votre patron ne vous surprenne pas à le regarder pendant que vous devez terminer une fonction JavaScript).

6.


Si vous souhaitez recadrer des parties spécifiques d'une page Web, Image Cropper est votre choix évident. Ce programme est aussi simple qu'un bâton et ne comporte aucun gadget. Spécifiez simplement la zone que vous souhaitez couper et l'application la récupérera. Besoin d’une précision au pixel près ? L'extension affiche la taille et l'emplacement des pièces que vous coupez, afin que vous puissiez choisir la taille dont vous avez besoin.

7.


Cette extension se targue d'être minimaliste et simple - ce qui est une bonne chose, car il n'y a aucune raison de compliquer la production de texte Lorem Ipsum. Le générateur Lorem Ipsum vous permet de remplir des cadres de texte lors de la conception de votre site Web de présentation.

8.


Identifier les bugs dans le moteur Internet Explorer Trident n'est pas amusant du tout. En utilisant IE Tab, vous pouvez au moins gagner un peu de temps et ne pas avoir à utiliser Internet Explorer (sans compter qu'il n'a pas beaucoup d'extensions) pour trouver des problèmes de rendu.

9.


jQuery Shell vous permet d'exécuter des commandes javascript et jQuery dans le contexte d'une page Web ouverte. Une extension très utile pour apprendre et expérimenter jQuery.

10.


Cette application maîtrise parfaitement un truc. L'astuce est que le programme vous permet d'obtenir rapidement les valeurs Hex et RVB de n'importe quelle couleur sur n'importe quelle page Web. Cette fonctionnalité peut s'avérer utile si vous devez déterminer les couleurs utilisées par votre site Web préféré sans utiliser Photoshop et son outil Pipette.

11.


Utilisation de la fonction Web, vous pouvez rendre n'importe quelle page disponible pour l'édition (les modifications que vous apportez, bien entendu, ne seront pas enregistrées). Eh bien, pourquoi as-tu besoin de ça alors ? Voici pourquoi : si vous créez un site Web et que vous souhaitez jouer avec les éléments sans apporter de modifications significatives au code, cette application vous sera très utile.

12.


Avez-vous déjà voulu savoir quelles technologies, structures et applications Open source utilise un site Web spécifique ? Les développeurs expérimentés peuvent répondre à ces questions en étudiant source, mais si vous souhaitez obtenir la réponse plus rapidement et plus facilement, essayez Chrome Sniffer. Chrome Sniffer répertorie tous les frameworks/bibliothèques javascript connus (jQuery, MooTools, etc.) et CMS (Drupal, WordPress, etc.) utilisés par un site Web.

13.
Compte-gouttes est une extension pour Google Chrome qui vous permet de détecter la couleur sur n'importe quelle page Web. De plus, le programme fournit une « roue » de couleurs et des échantillons de couleurs (que l'on peut trouver dans n'importe quel programme graphique), afin que vous puissiez expérimenter et manipuler les couleurs pour trouver celle que vous souhaitez.

15.


Une page Web correctement construite avec un bon balisage conduit finalement à des résultats impressionnants dans les moteurs de recherche. Cependant, si vous souhaitez évaluer votre site Web par rapport aux paramètres d'optimisation des moteurs de recherche connus, vous devriez essayer SEO Site Tools, une extension qui vous offre une vaste gamme d'outils et de fonctionnalités d'évaluation SEO utiles. Il peut lire de nombreux paramètres sur et hors de la page, obtenir des informations sur les réseaux sociaux et tout le reste.

Il existe plusieurs versions créées pour différentes catégories d'utilisateurs. L'un d'eux s'appelle Google Chrome Édition Développeur. De quel type de version s'agit-il et pourquoi est-il nécessaire ? À propos de cela et Nous parlerons dans ce matériau.

Il convient de noter que des versions alternatives de Chrome sont apparues depuis longtemps. Ils accompagnent ce navigateur populaire presque dès la version de lancement. Mais tous les utilisateurs ne sont pas adaptés aux options alternatives.

Le fait est que les « autres » versions de Chrome sont destinées aux professionnels dans un domaine ou un autre : concepteurs de mise en page, testeurs, développeurs, etc. Ces navigateurs ne conviennent pas aux utilisateurs ordinaires. Et pourtant, il faut en parler.

Quelles versions de Chrome existe-t-il ?

En fait, ils ne sont pas si nombreux. Cependant, il n’en existe qu’un seul stable. C’est exactement celui qui est rendu public. N'importe quel utilisateur peut le télécharger. Mais il existe aussi des versions alternatives. Regardons-les de plus près.

Ce sont les versions de Google Chrome préférées de tous qui existent. Cependant, dans ce contexte, nous nous intéressons à la Developer Edition. Il faut donc tout considérer principales caractéristiques cette version pour plus de détails. Ce n’est qu’alors qu’une conclusion pourra être tirée.

Fonctionnalités de l'édition développeur

La caractéristique clé de ce Versions Google Chrome est la disponibilité d'outils de développement. Ils seront utiles à ceux qui développent des extensions et des plugins pour ce navigateur web. L'utilisateur moyen se perdra dans de tels outils.

La deuxième fonctionnalité est la console avancée. Il est utilisé pour modifier le code et activer fonctions cachées navigateur. Cependant, il faut savoir comment travailler avec. La moindre erreur dans une équipe peut avoir des conséquences très désastreuses.

Un autre « truc » est la présence de toutes les dernières innovations qui ont migré vers cette version des Canaries. Grâce à cela, les développeurs peuvent optimiser leurs extensions pour les nouvelles fonctionnalités du navigateur Web.

Mises à jour fréquentes– une autre caractéristique distinctive de la Developer Edition. Ils viennent de façon irrégulière, mais au plus tard une fois toutes les deux semaines. Dans certains cas, les mises à jour peuvent arriver dans un délai de deux jours. Ceci est pratique pour ceux qui testent les nouvelles fonctionnalités du navigateur Web.

Conclusion

Ainsi, ci-dessus, nous avons parlé des versions de Google Chrome disponibles et avons discuté en détail de la version destinée aux développeurs. Force est désormais de constater que cette version se distingue par un ensemble d'outils et une console avancée.

Il convient de noter que les utilisateurs réguliers n'ont pas du tout besoin d'installer Developer Edition. Cela n’aura aucun sens. De plus, cet ensemble n'est pas particulièrement stable. Si vous n'êtes pas développeur, il est préférable d'utiliser Stable.

Il existe un grand nombre d'extensions gratuites pour Navigateur Google Chrome qui vous simplifie la vie. Voici 20 des meilleurs.

Dans cet article, nous présentons les meilleures extensions Google Chrome à des fins différentes, mais chacune est conçue pour vous faciliter la tâche.

Firefox est depuis longtemps célèbre pour sa personnalisation et ses nombreuses extensions, mais Google Chrome a également gagné en popularité parmi les concepteurs et développeurs Web au cours des dernières années. L'une des raisons en est sa rapidité et ses outils de développement intégrés.

Aujourd'hui, avec le développement de la collection d'extensions Chrome, qui s'agrandit chaque jour, c'est la raison pour laquelle de nombreux développeurs et concepteurs Web choisissent ce navigateur pour eux-mêmes.

Vous voulez en savoir plus à ce sujet ? Consultez notre liste.

01. iMacros pour Chrome

L'extension iMacros Chrome vous permet d'enregistrer et de sauvegarder vos actions.

En tant que développeur Web, vous devrez peut-être auditer vos pages Web. Faire les mêmes choses encore et encore peut être un processus fastidieux. iMacros est une extension pratique pour Chrome qui vous permet d'enregistrer vos actions et de les sauvegarder, vous obligeant à effectuer l'action une seule fois.

Vous pouvez ensuite vérifier vos pages encore et encore, en répétant les étapes en cliquant sur un bouton. Cela vous fait gagner un temps précieux et vous permet de vous concentrer sur des questions plus importantes.

02. Aire de jeux de polices

Font Playground vous permet d'expérimenter des polices locales sur des pages Web en direct.

Chaque concepteur et développeur trouvera beaucoup de choses utiles dans cette extension. Font Playground vous permet d'expérimenter les polices locales et toutes les bibliothèques de polices Google sur les pages Web actives sans apporter aucune modification aux pages elles-mêmes.

L’avantage de cette extension est qu’elle inclut toutes les tailles de police, styles et effets possibles. Vous pouvez d’abord visualiser différentes options de police avant d’apporter de réelles modifications au code.

03. Quelle police

Quelle police utilisent-ils ? L'extension What Font Chrome peut vous le montrer !

Extension très utile pour Google Chrome, What Font permet aux développeurs et aux concepteurs de déterminer quelles polices sont utilisées sur une page Web.

Ainsi, si vous tombez sur une police quelque part en ligne qui a l'air fantastique et que vous souhaitez l'utiliser dans l'un de vos futurs projets, survolez-la simplement et vous saurez instantanément de quoi il s'agit.

04. Yslow

YSlow vous dira ce qui ralentit la page.

Avec cet outil, vous ne pouvez pas simplement vérifier la vitesse de chargement d'une page Web, il vous montrera également si quelque chose la ralentit.

YSlow teste les pages Web par rapport à 23 des 34 règles de performances développées par l'équipe Yahoo. C'est extrêmement outil utile pour analyser les pages Web, ce qui suggère également des moyens d'optimiser leurs performances.

05. Développeur Web

L'extension Chrome Web Developer fournit un certain nombre d'outils utiles aux développeurs.

Si vous êtes un développeur web, vous vous demandez peut-être : comment avez-vous fait jusqu'à présent sans cette extension. Il ajoute un bouton dans la barre d'outils qui permet à Chrome d'accéder à de nombreux outils utiles pour les développeurs Web.

Ce la version officielle Extension de développeur Web développée pour Firefox.

06. Liste de contrôle du développeur Web

Il résout les problèmes de performances dans cet outil Chrome pratique.

Cet outil vous permet de tout vérifier : si vos pages sont conformes au référencement, conformes à la convivialité, ainsi que leur visibilité et leurs performances (vitesse de chargement des pages).

Ainsi, si, par exemple, vous avez manqué une balise H1, ou s'il manque un méta-titre ou une méta-description sur une page, l'extension de liste de contrôle du développeur Web vous en informe.

Pour que vous puissiez résoudre rapidement ce problème. Si vous cliquez sur le lien " plus d'informations et d'aide» en bas de l'extension, vous trouverez une liste plus détaillée.

07. Sauvegarde automatique de DevTools

Enregistre automatiquement les modifications apportées aux fichiers source de la page (CSS et JS).

Véritable trésor pour tous les développeurs, DevTools Autosave vous permet d'enregistrer automatiquement toutes les modifications apportées aux fichiers sources CSS et JS d'une page via l'environnement Chrome Dev Tools. L’extension est facile à configurer et à utiliser et vous fera gagner beaucoup de temps.

08. Filaire instantané

Vous permet d'afficher des wireframes de pages Web.

Connectez la visualisation filaire de n’importe quelle page Web en un seul clic. Cette extension Google Chrome aide les développeurs et concepteurs Web à visualiser les pages Web, qu'elles soient locales ou publiées en ligne, avec une superposition filaire.

09. Émulateur d'ondulation

Ripple Emulator aide au débogage des pages Web, à l'inspection DOM et aux tests automatisés.

Ripple Emulator est un émulateur d'environnement mobile multiplateforme qui vous aidera à tester votre application Web sur divers appareils et les résolutions d'écran.

L'extension Ripple Emulator peut être utilisée en combinaison avec les outils de développement existants pour le débogage, l'inspection DOM et les tests automatisés.

10. Série

Suivi des conversations par e-mail dans un seul ticket, attribution de tâches.

Streak est le principal outil CRM et d'assistance E-mail Gmail.

L'extension vous permet de regrouper toutes vos boîtes e-mail en une seule ou d'organiser le suivi des échanges de messages dans un seul ticket, d'attribuer des tâches afin que vous puissiez gérer personnellement le processus de communication avec vos contreparties ou d'en donner accès à d'autres personnes.

11. Rechercher Stackoverflow

Obtenez des réponses rapides à vos questions avec cette extension incontournable.

Si vous êtes un développeur Web, vous devez avoir entendu parler de Stack Overflow, un endroit vers lequel de nombreux développeurs se tournent pour diverses questions liées au développement de projets Web. Sinon, vous devez absolument apprendre à le connaître. Il s'agit d'une communauté véritablement florissante qui couvre un large éventail de sujets, du C# et Java à PHP et JQuery.

Cette extension fantastique ajoute un champ de recherche directement à votre navigateur et vous permet d'exploiter les vastes ressources de Stack Overflow. Une extension incontournable !

12. Manuel PHP Ninja

Toute la documentation pour PHP 5.5, dans votre navigateur.

Il est vraiment difficile de se souvenir de chaque fonction, donc si vous avez passé de nombreuses heures à rechercher des fonctions PHP spécifiques via Google à l'époque, cette extension attirera certainement votre attention. Le manuel PHP Ninja fournit

Vous obtenez toute la documentation pour PHP 5.5 exemples concrets en huit langues dans votre navigateur.

13. Pixel parfait

Cette extension vous aidera à garantir que chaque pixel de votre site correspond au design.

Les concepteurs détestent les situations où ils créent un design étonnant, mais après l'avoir traduit en code, quelque chose ne correspond pas au design original. Le processeur Perfect Pixel est véritablement l'extension parfaite pour les développeurs Web qui s'efforcent de créer des sites dont la conception est précise.

Cette extension facile à utiliser vous permet de placer une superposition d'image semi-transparente au-dessus d'une page Web et d'effectuer une vérification de correspondance pixel par pixel pour garantir une correspondance à 100 %.

14. Code Cola

Vous permet de modifier le CSS de la page Web en place.

Non seulement cet outil vous permettra de visualiser le code source sur lequel vous travaillez, mais il peut également fonctionner comme un éditeur CSS. Cela signifie que vous pouvez modifier le style CSS de vos pages Web sur place et voir immédiatement les résultats de vos modifications.

15. Renifleur de Chrome

Inspection des applications Web et des bibliothèques JavaScript.

Cette extension permettra aux développeurs Web d'inspecter et d'identifier les applications Web ainsi que les bibliothèques JavaScript attachées à un projet spécifique. L'extension fonctionne le plus simplement possible : une icône apparaît dans la barre d'adresse indiquant la version du framework ou du CMS utilisé.

16. Commutateur d'agent utilisateur

Vérifiez à quoi ressemble votre site sur différents appareils.

Un excellent outil pour voir à quoi ressemble un site Web divers types appareils tels que les appareils iPad, iPhone ou Android. Cela peut également être très utile pour voir le site tel que les moteurs de recherche le voient.

Peu importe ce que vous avez entendu à propos de Google Chrome, quand nous parlons de en ce qui concerne la conception et le développement Web, Firefox reste le meilleur navigateur avec un environnement de développement convivial que vous puissiez trouver.

Bon sang, Firefox propose même une version spéciale du navigateur conçue uniquement pour les développeurs Web. C'est à quel point Mozilla se soucie des concepteurs et des développeurs Web.

Firefox dispose également d'une vaste collection d'extensions qui rendent le navigateur plus puissant pour un effet maximal. Voici quelques-unes des meilleures extensions Firefox que vous pouvez utiliser pour faciliter votre vie de développement Web.

Installez, testez et utilisez la plupart de ces extensions. Après tout, leur utilisation est gratuite !

  • Ce qu'il fait : Inspecte les pages Web

Firebug est une extension sans laquelle les concepteurs et développeurs Web ne peuvent tout simplement pas vivre. Cette extension est comme une version améliorée de la console de développement intégrée fournie avec Firefox. Firebug vous permet d'inspecter beaucoup plus facilement les éléments des pages Web et de vous montrer comment les choses fonctionnent sur différents sites.

  • Convient pour : les développeurs Web
  • Ce qu'il fait : client pour Firefox

FireFTP est un client FTP/SFTP pour Firefox qui vous permet de télécharger et de transférer en toute sécurité des fichiers entre votre ordinateur et le serveur directement depuis votre navigateur. Avec ce module complémentaire, vous n'aurez plus jamais besoin de passer de votre navigateur aux applications client FTP.

  • Convient pour : les développeurs et concepteurs Web
  • Ce qu'il fait : analyser et vérifier les pages Web

C'est une extension tout-en-un qui ajoute un certain nombre d'outils utiles à votre Firefox. Certains des outils inclus dans cet addon affichent et modifient les feuilles de style CSS, désactivent les styles, outils de débogage, etc.

  • Ce qu'il fait : Outil d'analyse des couleurs

ColorZilla est un excellent outil que les concepteurs Web front-end trouveront très utile. Cet addon dispose d'une pipette pour choisir rapidement les couleurs sur une page Web, d'un générateur de dégradé CSS, d'un analyseur de couleurs, de palettes de couleurs et bien plus encore.

  • Convient pour : les développeurs Web
  • Ce qu'il fait : Modifier des sites Web avec du code personnalisé

Appréciée par plus d'un million d'utilisateurs de Firefox, Greasemonkey est une extension qui vous procurera un plaisir sans fin. Ce module complémentaire vous permet de personnaliser les sites Web populaires en les modifiant à l'aide de votre propre code JavaScript. Vous pouvez également profiter de scripts déjà créés par d'autres développeurs.

  • Idéal pour : les concepteurs d’interfaces
  • Ce qu'il fait : Ajuste le décalage des éléments Web

Un plugin simple mais utile qui vous permet d'inspecter les éléments Web et de voir visuellement combien de pixels sont décalés dans les éléments, créant ainsi une composition avec des calques transparents. En utilisant cette composition, vous pouvez configurer votre page Web réelle pour qu'elle corresponde à la superposition pour obtenir le meilleur résultat sans aucune hypothèse.

Par exemple, si l'une des images de votre page Web chevauche un autre objet, vous pouvez utiliser Pixel Perfect pour déterminer le nombre de pixels que vous devez ajuster pour placer cette image au bon endroit.

  • Convient pour : les concepteurs de sites Web
  • Ce qu'il fait : charge tout à partir d'une page Web

Ce plugin porte bien son nom en vous permettant de tout télécharger depuis une page Web. En un clic, vous pouvez télécharger toutes les images, liens et autres données contenues dans une page Web grâce à cette extension. L'addon dispose également d'un accélérateur de téléchargement intégré qui optimise la vitesse de téléchargement par quatre.

  • Idéal pour : les concepteurs d’interfaces
  • Ce qu'il fait : Vérifier les pages Web dans Internet Explorer

Croyez-le ou non, il y a des gens qui utilisent encore les anciens Versions Internet Explorer pour accéder à Internet. Créer des sites qui fonctionnent bien dans ces anciens navigateurs est l'un des problèmes avec lesquels les concepteurs de sites Web sont encore confrontés. Ce plugin facilite la personnalisation des conceptions Web pour les plus anciens Navigateurs Internet Explorer, créant un nouvel onglet dans IE.

  • Convient à : les concepteurs et développeurs Web
  • Ce qu'il fait : vous présente la technologie utilisée sur le site Web.

Vous vous demandez quelles technologies ont été utilisées pour créer vos sites Web préférés ? Alors ce module complémentaire vous sera utile. BuiltWith est une extension qui vous permet d'analyser des sites Web pour trouver les technologies utilisées sur la page. Un excellent outil permettant à tous les concepteurs de sites Web en herbe d'apprendre à partir de sites Web prêts à l'emploi.

  • Convient pour : les développeurs Web
  • Ce qu'il fait : Active ou désactive Java

Ce module complémentaire vous permet d'activer ou de désactiver facilement Java dans votre navigateur. Il peut également désactiver Javascript, les cookies, les images animées, Flash et bien plus encore sur la page Web. C'est un plugin utile non seulement pour les développeurs, mais aussi pour utilisateurs ordinaires pour améliorer la sécurité du navigateur et réduire la bande passante.

  • Idéal pour : les concepteurs d’interfaces
  • Ce qu'il fait : Mesure les éléments en pixels

La fonction de ce module complémentaire est simple, il vous permet de dessiner une règle virtuelle au-dessus d'une page Web ou d'un élément sur une page pour mesurer la largeur, la hauteur ou l'alignement des pixels de l'élément sur la page Web. MeasureIt est utile à la plupart des développeurs front-end pour créer des wireframes.

  • Convient pour : les concepteurs de sites Web
  • Ce qu'il fait : change la langue dans le navigateur

Il s'agit d'un outil utile qui traduit instantanément votre Firefox dans une autre langue. Tout dans votre navigateur, y compris interface utilisateur, le dictionnaire de vérification orthographique et le contenu du site Web seront traduits dans la langue de votre choix. Une fonctionnalité intéressante que vous pouvez utiliser lors du développement de sites Web multilingues.

  • Idéal pour : les concepteurs d’interfaces
  • Ce qu'il fait : générer du texte factice

Créer un texte factice pour vos nouvelles maquettes et prototypes de sites Web est une tâche ennuyeuse qui ne divertira même pas un seul concepteur. Cette extension rend le processus moins ennuyeux en vous permettant de générer du texte factice Lorem Ipsum directement depuis Firefox.

  • Convient pour : les développeurs Web
  • Ce qu'il fait : édite et crée des cookies

Ce module complémentaire gère non seulement les cookies de votre site, mais vous permet également de modifier et de créer facilement de nouveaux fichiers. Certaines fonctionnalités du plugin incluent la navigation en ligne biscuits, la possibilité de changer de domaine, la possibilité de modifier plusieurs cookies à la fois et bien plus encore.

  • Idéal pour : les concepteurs d’interfaces
  • Ce qu'il fait : Sélectionne les couleurs sur une page Web

Un outil facile à utiliser qui vous permet de choisir les couleurs de n'importe quel pixel d'une page Web et de copier facilement le code couleur RVB ou Hex pour l'utiliser dans vos propres projets. La beauté et l'interface visuelle de cet outil permettent aux débutants de se familiariser beaucoup plus facilement avec les couleurs sur les pages Web.

  • Convient à : les concepteurs et développeurs Web
  • Ce qu'il fait : Donne des informations sur le logiciel utilisé par le site Web

Semblable au module complémentaire BuiltWith, Wappalyzer est une autre extension utile qui vous permet de découvrir ce que logiciel utilisé sur le site Web. Par exemple, vous pouvez découvrir quel type de CMS le site utilise, quel système d'exploitation prend en charge le serveur du site Web, et bien plus encore.

  • Convient pour : les développeurs Web
  • Ce qu'il fait : Modifie l'agent utilisateur du navigateur

Vous voulez savoir à quoi ressemblera votre site Web sur différentes plateformes et systèmes d’exploitation ? Alors c’est un outil qui vous sera certainement utile. User-Agent Switcher vous permet de basculer entre différentes plates-formes telles qu'Android, Mac, Windows et de sélectionner des systèmes d'exploitation pour modifier l'agent utilisateur de votre navigateur.

  • Convient à : les concepteurs et développeurs Web
  • Ce qu'il fait : montre un exemple d'utilisation de l'onglet mémoire du navigateur

Il s'agit d'un module complémentaire pratique qui vous aidera à déterminer la quantité de ressources de votre ordinateur utilisée par chaque onglet ouvert dans Firefox. Vous pouvez utiliser cet outil pour découvrir combien de ressources votre site utilise et optimiser votre site pour des performances maximales.

  • Convient à : les concepteurs Web et graphistes
  • Ce qu'il fait : Ouvre les images dans Photoshop

Ce module complémentaire fait ce que son nom l'indique, ouvre simplement en un clic les images que vous trouvez sur une page Web avec en utilisant Photoshop. Pas besoin de télécharger une image ou de lancer Photoshop, l'extension fera tout ce dont vous avez besoin.

  • Idéal pour : les concepteurs d’interfaces
  • Ce qu'il fait : Améliore les tableaux HTML

Graphiques, statistiques, comparaisons, tableaux : ce module complémentaire peut tout faire. Vous pouvez utiliser cet outil pour créer des tableaux et des diagrammes HTML conviviaux et esthétiques.

  • Convient pour : les développeurs Web
  • Ce qu'il fait : client SSH pour Firefox

En règle générale, vous devez installer une application pour exécuter le terminal SSH. Ces applications diffèrent sur une chose système opérateur D'un autre. FireSSH, cependant, fonctionne sur toutes les plateformes tant que vous disposez de Firefox. L'extension permet de lancer un terminal SSH directement depuis le navigateur.

  • Idéal pour : les concepteurs d’interfaces
  • Ce qu'il fait : Actualiser automatiquement les pages Web

L'une des choses ennuyeuses auxquelles les concepteurs de sites Web sont confrontés lors du développement de sites Web est de devoir mettre à jour manuellement la page Web après chaque petite modification du code. Auto Refresh est une extension qui résout ce problème en vous permettant d'actualiser automatiquement un ou plusieurs onglets dans Firefox à des intervalles que vous définissez.

  • Idéal pour : les concepteurs d’interfaces
  • Ce qu'il fait : Redimensionne les fenêtres de Firefox pour des résolutions d'écran spécifiques

Ce module complémentaire vous permet de redimensionner votre fenêtre Firefox à des résolutions spécifiques pour voir à quoi ressemble votre site Web sur différents écrans. Vous devrez installer la barre complémentaire Firefox pour que cette extension fonctionne correctement.

  • Convient à : les concepteurs et développeurs Web
  • Ce qu'il fait : recherche des informations sur les polices de la page et ses éléments

Font Finder est un outil pratique qui vous permet d'examiner les éléments du site Web pour le découvrir. une information important sur les polices utilisées sur la page, telles que le nom de la famille de polices, la couleur de la police, l'espacement des lignes, la décoration, etc.

  • Idéal pour : les concepteurs d’interfaces
  • Ce qu'il fait : vérifie les pages Web dans différents navigateurs

La fonction de ce module complémentaire est simple. Il vous permet d'ouvrir instantanément n'importe quelle page Web que vous consultez dans Firefox à l'aide d'un autre navigateur en un seul clic. Il n'est pas nécessaire de copier les URL, d'ouvrir chaque navigateur un par un et de coller les URL pour ouvrir le site Web.

  • Convient à : les concepteurs et développeurs Web
  • Ce qu'il fait : efface le cache du navigateur

Ce module complémentaire efface instantanément le cache Navigateur Firefox(RAM et DISQUE) pour réduire l’utilisation des ressources informatiques. L'extension vous permet de vider le cache en cliquant simplement sur un bouton ou en appuyant sur la touche F9 de votre clavier. Si vous souhaitez visualiser rapidement les modifications apportées à une page Web, ce module complémentaire sera très utile.

Avec la popularité croissante du navigateur Google Chrome, des extensions apparaissent qui font gagner du temps aux développeurs Web en leur donnant la possibilité de suivre les erreurs et les problèmes de performances du site.

Voici quelques extensions utiles pour Google Chrome.

Extension de développeur Web

Je voudrais souligner l'outil le plus pratique et le plus puissant pour un développeur Web et un concepteur Web - Extension de développeur Web pour Google Chrome.

L'extension est ajoutée à la barre d'outils de Google Chrome sous la forme d'un bouton avec une icône d'engrenage et contient divers outils pour développer et déboguer un site Web. Il s'agit d'une adaptation officielle du populaire, écrite par le même développeur.

L'extension dispose d'un grand nombre d'options.

Par exemple, beaucoup de gens ont simplement besoin découvrir la couleur de l'élément sur l’écran du moniteur au format hexadécimal. A cet effet, le plugin a fonction spéciale. Dans la section Divers, sélectionnez Afficher le sélecteur de couleurs.

En sélectionnant Display Color Picker, le curseur devient une croix. Désormais, cliquer sur n'importe quelle zone de l'écran dans le coin inférieur droit du navigateur affiche la couleur en hexadécimal pour une utilisation en CSS.






Haut