6 extensions Chrome pour les concepteurs web

Google Chrome est l'un des navigateurs web les plus populaires au monde grâce à ses nombreuses fonctions, son interface élégante, et bien sûr sa connexion au puissant moteur de recherche et à ses logiciels et matériels. Mais beaucoup des meilleures fonctions de Chrome sont piégées derrière des couches d'étapes assez complexes pour donner une pause à Indiana Jones.

De nombreuses extensions de navigateur permettent aux concepteurs web et autres professionnels de gagner du temps en créant des raccourcis vers des fonctions telles que les captures d'écran et la visualisation des éléments/codes sources. D'autres introduisent des fonctionnalités tout à fait uniques, transformant le navigateur en quelque chose de plus qu'une simple interface pour naviguer sur le web.

Les extensions Chrome sont particulièrement utiles pour les concepteurs de sites web car nous passons de nombreuses heures à travailler avec des navigateurs web, et testons régulièrement les sites web sur tous les navigateurs (ou du moins ceux qui sont populaires). Lorsque vous passez huit heures ou plus par jour à travailler en ligne, il y a beaucoup de tâches banales qui prennent inutilement du temps. Les extensions peuvent faire en sorte qu'une tâche de cinq minutes prenne trente secondes, ou qu'il ne soit pas nécessaire d'utiliser un logiciel supplémentaire.

Bien qu'il existe de nombreuses extensions pour Chrome qui peuvent aider les concepteurs dans leur travail quotidien, en voici six que je trouve particulièrement utiles.

ColorZilla

ColorZilla est probablement l'extension qui me fait gagner le plus de temps, que je travaille sur la conception web ou un autre projet qui implique la couleur. ColorZilla peut récupérer le code hexadécimal depuis n'importe quel élément visible de la page, en le copiant dans le presse-papiers en un seul clic. Sans cette extension, obtenir un code hexadécimal d'une couleur inconnue nécessite le téléchargement ou la capture d'écran de la page, puis le chargement de l'image dans un logiciel qui peut extraire le code.

Ce serait suffisant pour faire de ColorZilla mon plugin préféré sur cette liste, mais le petit monstre introduit encore plus de fonctionnalités dans le navigateur. Il dispose également d'une palette de sélection de couleurs et d'un générateur de dégradés intégrés, et peut analyser toutes les couleurs utilisées sur une page et les fournir dans un format accessible.

En d'autres termes, si vous avez du mal à trouver les bonnes combinaisons de couleurs pour votre site ou si vous passez beaucoup de temps à télécharger des images pour obtenir leurs codes hexadécimaux, ColorZilla peut être votre nouveau meilleur ami.

FireShot

Fireshot est une magnifique extension pour tous ceux qui créent des tutoriels, des rapports ou des notes de conception sur des photos de leur site web. Plutôt que de passer par la procédure angoissante de Chrome pour prendre une capture d'écran ordinaire, FireShot vous permet de capturer une zone sélectionnée de la page, ou la page entière, ou juste la zone actuellement visible.

C'est un outil incroyablement pratique pour créer des maquettes de sites web, ou pour obtenir une image sur laquelle vous pouvez dessiner/écrire quelques notes et la transmettre à un collègue ou un employé. En quelques clics, vous pouvez capturer ce que vous voulez et y copier dans le presse-papiers ou l'enregistrer au format PNG, JPG ou PDF.

La version premium de cette extension introduit encore plus de fonctionnalités, mais tout ce qui est mentionné ci-dessus est disponible gratuitement. Si vous naviguez régulièrement sur Chrome pour n'importe quel type de travail, avoir FireShot ou une extension comparable installée est tout à fait logique.

Fonts Ninja

Fonts Ninja est un outil génial pour les concepteurs qui s'inspirent d'autres sites web. Si vous voyez une police que vous aimez, vous devriez normalement inspecter l'élément et/ou vérifier le code source pour savoir de quoi il s'agit, ce qui peut être un processus fastidieux et long. Avec Fonts Ninja, il suffit de quelques clics pour découvrir, expérimenter et télécharger les polices qui vous plaisent.

Si vous n'êtes pas particulièrement à l'aise pour chercher dans le code source ou si vous passez beaucoup de temps à penser aux polices, c'est certainement une extension pour vous.

L'une des plus grandes caractéristiques de Fonts Ninja est le fait qu'elle est complètement gratuite ; il n'y a aucune fonction cachée derrière un paywall, ce qui est une vérité frustrante de nombreux plugins.

Si la police que vous admirez n'est pas gratuite, Fonts Ninja fournit un lien pour l'acheter. Il fournit même une interface slick dans le navigateur que vous pouvez utiliser pour expérimenter avec les polices avant de décider de les obtenir ou non. Dans l'ensemble, si vous voulez améliorer votre jeu de polices, ce plugin vous rendra la vie beaucoup plus facile.

CSS Scan

CSS Scan est une puissante extension payante qui se décrit comme "Inspecteur d'élément sous stéroïdes". Entre cela et le nom, vous pouvez probablement deviner ce qu'il fait, mais voici un bref aperçu de ses meilleures caractéristiques.

Lorsque CSS Scan est activé, passer la souris sur n'importe quel élément de la page web active affichera les données de la feuille de style en cascade (CSS) et permettra de copier le code dans le presse-papiers en un seul clic. Cela rend l'apprentissage du code utilisé sur d'autres sites beaucoup plus facile, et vous pouvez trouver d'autres utilisations pour cette extension en fonction de vos responsabilités.

Checkbot

Checkbot est doté de nombreuses fonctions, mais d'un point de vue visuel, c'est facile à comprendre ; cette extension testera un site web par rapport à de longues listes de meilleures pratiques en matière de référencement, de vitesse et de sécurité. Il recherche les liens cassés, le code non optimisé, l'accès facile aux zones restreintes, et bien plus encore.

Ce plugin vous sera utile que vous soyez débutant en conception web et que vous travailliez uniquement sur votre propre site web, ou que vous soyez un concepteur expérimenté avec de nombreux projets clients à gérer. Bien que la version gratuite de cette extension ait quelques limitations intégrées, la version Premium peut vérifier jusqu'à 10 000 URL par site web et exporter des rapports PDF et CSV.

Si vous êtes nouveau dans le domaine des sites web, cet outil vous aidera à trouver les problèmes qui pourraient vous échapper et vous aidera à adopter les meilleures pratiques. Si vous êtes plus expérimenté, cela pourrait vous aider à faire évoluer votre entreprise en réduisant le temps nécessaire pour trouver et résoudre les problèmes.

Pour une liste complète des fonctions de Checkbot, consultez la page de la boutique en ligne de Chrome ou jetez un coup d'œil à leur site web. Même si vous venez de tester la version gratuite, vous pouvez trouver des problèmes faciles à résoudre avec un site sur lequel vous travaillez.

Block Yourself from Analytics

Block Analytics est une extension pratique qui empêche Google Analytics, un outil de statistiques de site populaire, d'inclure vos propres visites et tendances de navigation dans les statistiques des sites web sur lesquels vous travaillez. Cela peut être utile si vous voulez vous assurer que les statistiques de votre site web sont celles de vos visiteurs actuels, et non les vôtres.

Bien qu'il existe d'autres moyens d'accomplir la même chose (comme la création d'un filtre IP dans Google Analytics), il existe de nombreuses situations où une extension comme Block Analytics est une solution plus facile. Si votre adresse IP change régulièrement, ou si vous travaillez à partir de différents endroits, ou si vous n'avez pas accès à Analytics pour tous les sites sur lesquels vous travaillez, Block Analytics peut être exactement ce dont vous avez besoin.

Il est à noter que cette extension n'est pas destinée à masquer votre présence sur tous les sites web - le créateur l'indique expressément dans sa description.

Notes de fin sur les extensions de navigateur

Chrome est un navigateur web puissant, mais certaines de ses meilleures fonctions sont cachées derrière une série d'étapes ennuyeuses ou nécessitent une connaissance plus approfondie du développement web. Si vous passez beaucoup de temps à travailler en ligne et que vous avez l'impression que trop de temps est consacré à des tâches répétitives et banales, vous voudrez peut-être envisager d'ajouter quelques extensions au navigateur.

Entre la demi-douzaine d'extensions que j'utilise quotidiennement ou hebdomadairement, j'estime qu'elles me font économiser au moins cinq ou six heures par mois. C'est assez de temps pour éliminer un petit projet, ou passer une demi-journée de détente. Mais le temps n'est pas le seul avantage de ces extensions ; elles permettent aussi d'économiser beaucoup de frustration qui peut résulter des aspects plus ennuyeux du travail de conception web. Plus vous gardez l'esprit clair, plus vous pouvez rester créatif et concevoir de beaux sites web.

Utilisez-vous d'autres extensions Chrome utiles au quotidien? Faites-le moi savoir, ainsi qu'aux autres lecteurs, dans les commentaires ci-dessous!