Cele mai bune 11 extensii de dezvoltare web pentru Chrome

11 meilleures extensions de développement Web pour Chrome

⌛ Reading Time: 6 minutes

Lors du développement d’un site Web, vous devez dresser une liste de contrôle de nombreuses exigences complexes. Qu’il s’agisse de schémas de couleurs ou de polices, de problèmes de mise en page CSS ou de réactivité de sites Web sur divers appareils, il est important de rester au courant de tout problème émergent. Voici quelques-unes des meilleures extensions de développement Web pour Google Chrome (et d’autres navigateurs basés sur Chromium).

1. Pipette de choix de couleur

Avez-vous envie de la palette de couleurs d’une page Web aléatoire et souhaitez-vous l’utiliser dans votre propre projet ? Une extension Chrome appelée Choix de la couleur « Pipeline » vous permet d’extraire les couleurs avec une précision extrême et une fonction de zoom réglable.

Des extensions comme celles-ci nécessitent une autorisation sur tous les sites Web pour effectuer l’extraction des couleurs. Si vous voulez des fonctionnalités légèrement plus avancées, il existe un outil appelé ColorZilla qui est livré avec un générateur de dégradé, une visionneuse de palette et un historique des couleurs.

2. Capture d’écran pleine page en un clic

Prendre une capture d’écran Web en pleine page est une nécessité du travail quotidien. Parfois, la meilleure façon de communiquer vos modifications de conception est de capturer l’intégralité du site Web tel qu’il est. Avec une extension appelée “Capture d’écran pleine page en un clic”, vous pouvez y parvenir précisément.

Pendant que la capture d’écran est en cours, votre image de défilement terminée s’ouvrira dans une nouvelle fenêtre une fois terminée.

Capture d'écran 1 de la page complète en un clic sur Chrome Web

L’intégralité de l’écran de la page Web est désormais disponible en téléchargement au format PNG. Vous pouvez également appliquer un certain nombre d’effets à l’écran d’image, notamment des filtres, des dessins sur la page Web, l’ajout de texte, etc.

3. Modifier ce cookie

Les développeurs Web ont besoin d’accéder aux gestionnaires de cookies pour ajouter, supprimer, modifier, protéger et bloquer les cookies. Modifier ce cookie est une extension utile qui vous permet de travailler avec les cookies à votre guise et de les exporter ou de les importer au format JSON. Cela vous aide à maintenir le site Web en bonne santé en supprimant les anciens cookies et en limitant la date d’extraction maximale de tout cookie.

Chrome Web Modifier ce cookie 1

4. En-tête de module

En-tête de mod est l’une des extensions Chrome les plus populaires pour modifier les en-têtes HTTP des pages Web. En un ou deux clics seulement, vous pouvez activer la modification de l’en-tête en fonction de l’URL ou du type de ressource. La meilleure partie est que vous pouvez créer plusieurs profils et ajouter différentes valeurs aux en-têtes modifiés. Toutes les modifications peuvent être limitées à un seul onglet ou à un site entier.

Chrome Web Modheader 1

5. Vérification UX

Nous avons tous besoin d’une évaluation heuristique du site Web en cours de temps en temps. Ceci est rendu facile avec Vérification UX, une extension qui affiche tous les commentaires liés à l’UX dans un volet latéral. Après avoir cliqué sur un élément qui ne correspond pas à une heuristique évaluée par vous, vous pouvez ajouter des notes et prendre des captures d’écran. Enfin, toutes les modifications peuvent être exportées au format .docx.

Chrome Web Ux Contrôle 1

6. Redimensionneur de fenêtre

Les développeurs Web doivent émuler leurs pages Web pour différentes dimensions d’écran. Avec Redimensionneur de fenêtre, vous pouvez facilement effectuer ces évaluations pour les ordinateurs portables, les tablettes, les smartphones et toutes les dimensions d’écran de votre choix.

Redimensionneur de fenêtre Web Chrome

L’outil possède des fonctionnalités intéressantes telles que « Rotation » et « Mesure en direct », ainsi qu’un tas de fonctions de personnalisation visuelle. Si vous souhaitez créer un site Web vraiment réactif, assurez-vous d’avoir vérifié son apparence pour toutes les dimensions de l’écran.

7. Générateur Lorem Ipsum

Pour terminer rapidement le travail sur une page Web, vous avez besoin du texte par défaut. Une extension appelée Générateur de Lorem Ipsum offre plusieurs options de texte par défaut de différents paragraphes et phrases par paragraphe. Vous pouvez sélectionner des fragments de texte ou du texte entier à l’aide d’une option « Sélection automatique ». Le modèle final donne un aspect élégant en raison des possibilités de variation dans le texte.

Chrome Web Lorem Ipsum Générateur 1

8. BuiltWith Technology Profiler

BuiltWith est un rallonge classique pour en savoir plus sur toutes les technologies sous-jacentes prenant en charge un site Web. En un seul clic, il crée un profil qui vous aide à découvrir les derniers modules complémentaires et instruments qui permettent au site Web de mieux se démarquer. Cela vous aide à reproduire ses fonctionnalités pour votre propre usage.

Chrome Web intégré à 1

9. Quelle police

QuelleFont est l’un des moyens les plus rapides et les plus simples d’identifier différents types de polices sur une page Web. Il vous suffit de survoler le texte pour obtenir ses détails complets. Il prend en charge les modèles avancés tels que TypeKit et Google FontAPI.

Chrome Web Whatfont 1

10. VérifierMesLiens

Parfois, nous avons besoin d’un résumé objectif de tous les liens vers un site Web. VérifierMesLiens est une extension populaire pour résumer les liens valides, invalides et rompus. Les résultats des liens pour tout site Web en cours d’exécution sont immédiatement affichés dans un volet latéral. Cet outil est extrêmement pratique pour les vérifications ponctuelles de dernière minute avant la mise en ligne de votre site Web ou des modifications publiées.

Chrome Web Checkmylinks 1

11. Pesticide

Anticipez-vous des problèmes de mise en page CSS dans votre site Web ? Pesticide vous permet de déboguer ces problèmes en fournissant un aperçu à chaque élément de page. En tenant le Ctrl clé, vous pouvez voir les informations sur l’élément et analyser le placement de l’élément sur la page.

Chrome Web Pesticide 1

Il existe de nombreuses autres extensions Web populaires qui gèrent des détails cruciaux dans les applications de sites Web. Par exemple, Visionneuse JSON aide ceux qui travaillent avec des fichiers JSON. Il y a un Générateur d’arbre HTML qui donne une arborescence de tous les éléments d’un site Web.

Outre ce qui précède, il existe également de nombreuses extensions Chrome pour améliorer votre vitesse de navigation. Vérifie-les!

How useful was this post?

Click on a star to rate it!

Average rating 0 / 5. Vote count: 0

No votes so far! Be the first to rate this post.