Les extensions de Google Chrome pour les développeurs Web -

Google Chrome est le navigateur web le plus prometteur en ce moment, car il est assez rapide et offre beaucoup de fonctionnalités. Une enquête menée par des professionnels du web a montré que près de 75% des employés d’entreprises utilisent Google Chrome quotidiennement, et presque tous les utilisateurs ont installé des extensions supplémentaires. Voiçi donc le top du top des extensions pour les développeurs web. Ci-dessous vous trouverez une liste des extensions les plus populaires et utiles pour les développeurs web.

Web Developer

L’extension Web Developper est spécialement recommandée par notre équipe de développeurs, elle permet de faire une multitudes de modifications de code directement sur le navigateur sans être obligé de modifier réellement le code source de votre site. Exemples: Ajouter un css temporaire, des scripts js reutilisable, afficher les boundaries des divs et plein d’autre utilités, nous l’utilisons pour remmplir les formulaire en un click pour les tester… il contient une centaine de fonctionnalités, les plus interessantes sont :

Désactiver / activer le css navigateur (utile pour voir si un mauvais affichage est causé par le navigateur ou pas)
Désactiver / activer l’inline css
Voir et traker les cookies
Changer les valeurs des cookies
Désactiver le javascript ou quelques fonctions du js comme les alters et les popup
Resize les images
Voir les liens des images
Trouver les brisés des images
Reset des champs d’un formulaire
Remplir les champs d’un formulaire
Afficher les hidden inputs
Resize de la page pour la voir en respensive

IE Tab

Internet Explorer est très impopulaire auprès des développeurs car c’est la source d’interminables problèmes. Malgré cela, beaucoup d’internautes ignorent ce fait et préfèrent ce navigateur. Pour le moment, IE est toujours parmi les leaders même si la chute est continue.

L’extension IE Tab exécute Internet Explorer directement dans l’interface utilisateur Google Chrome, permettant ainsi au développeur de parcourir rapidement son site web et trouver les lacunes de la mise en page. En outre, parfois il y a la situation inverse lorsque le site est correctement affiché sur Internet Explorer, mais il a quelques problèmes sur Mozilla Firefox ou Google Chrome (il se réfère principalement aux anciens sites). Pour ces sites, IE Tab fournit un mode de téléchargement automatique de votre site immédiatement sur Internet Explorer, évitant le téléchargement sur Chrome.

Eye Dropper

Eye Dropper est une extension qui permet de trouver la couleur de n’importe quel élément sur une page. En cliquant avec une « pipette » sur un élément, vous recevez des informations sur la couleur RGB et le code HTML.

En fait, cette extension est l’analogue de «Eye Dropper Tool» dans Adobe Photoshop . EyeDropper vous permet de vérifier un fichier CSS pour une couleur particulière, aussi, il y a une autre caractéristique pratique: vous pouvez ouvrir la mise en page graphique du site web dans l’onglet suivant et composer rapidement un CSS en utilisant Eye Dropper.

Window Resizer

Avec cette extension Windows Resizer, vous pouvez tester l’affichage d’un site web sur des écrans avec des résolutions différentes. L’émulation est effectuée en sélectionnant l’une des résolutions prédéfinies. Window Resizer vous permet de choisir n’importe laquelle des résolutions les plus courantes, ordinateurs de bureau, portables, tablettes ou smartphones.

RDS Bar

Après l’avoir installé, RDS Bar vous permet d’obtenir une barre d’outils supplémentaire qui permet d’effectuer une analyse rapide des indicateurs de base d’un site en point de vue référencement naturel: Pages indexées dans les principaux moteurs de recherche, PR, etc.

Firebug Lite

Firebug Lite est un excellent outil pour les développeurs web, qui est intégré dans le navigateur et fournit des fonctionnalités avancées pour l’édition et le débogage du code de toute page Web. Par défaut, Firebug est désactivé et affiché en gris, mais une fois que vous l’activez, vous voyez le morceau de code qui correspond à l’élément du site web sur lequel vous avez cliqué. Vous pouvez le modifier et afficher les modifications en temps réel.

BuiltWith Technology Profiler

L’extension BuiltWith analyse tout site web que vous visitez et détecte les technologies web utilisées, même les services intégrés tels que le compteur FeedBurner ou le widget Twitter. Si le site est sur WordPress, l’extension peut même afficher les noms des principaux plug-ins utilisés. un outil trés précieux.

CSSViewer

Cette extension CSSViewer, comme l’indique son nom, est conçue pour afficher les propriétés CSS affectées à un élément particulier sur une page. Pour l’utiliser, il suffit de l’activer en cliquant simplement sur l’icône, puis de placer le curseur sur n’importe quel élément de la page que vous souhaitez vérifier.

HoverZoom+

Cette extension est très utile pour ceux qui veulent afficher des images mises à l’échelle sans passer à une page séparée: Avec HoverZoom+ placez simplement votre souris sur l’image et ainsi vous pouvez l’agrandir en taille réelle (elle correspondra à la fenêtre du navigateur).

MeasureIt

Ce plug-in MeasureIt vous permet de mesurer la distance et la taille (en pixels) de n’importe quel élément d’une page web. (Certains utilisateurs ont signalé que vous devez redémarrer le navigateur pour que l’extension fonctionne)

Ripple

Ripple est un outil qui affiche votre applications web sur une variété d’appareils mobiles, de l’iPhone à BlackBerry. Bien que Ripple ait été initialement créé pour le débogage d’applications web basées sur la technologie PhoneGap, maintenant il est largement utilisé pour imiter les écrans des appareils mobiles.

Advanced REST client

Advanced REST client c’est une extension très utile pour le remplissage des requêtes POST, PUT, GET, DELETE, des requêtes aux services RestFul, des réponses du serveur et bien plus encore. Vous pouvez enregistrer les demandes sur Google Drive et les renvoyer au besoin.

Minimap

Certaines pages web sont si grandes (par exemple, des pages de défilement long) que vous avez besoin de faire défiler une dizaine de fois pour arriver à la fin. Minimap permet d’afficher des pages telles que des vignettes; C’est-à-dire que vous voyez une page web convenablement mise à l’échelle et vous pouvez ainsi rapidement évaluer où vous êtes et vous déplacer au bon endroit.

The Great Suspender

L’un des principaux problèmes de Google Chrome est son utilisation excessive des ressources système. The Great Suspender aide à résoudre ce problème: après une certaine période de temps, il désactive tous les onglets inutilisés, ce qui permet d’économiser la RAM et la charge de la batterie. Vous pourrez aussi définir une liste blanche des sites à ne pas suspendre, ce qui vous permettera de ne pas a recharger les pages donc vous avez besoin même aprés quelques heures d’innactivité.

ARC Welder

ARC Welder est une extension qui permet de lancer vos applications Android préférées sur Google Chrome. Si vous n’avez pas trouvé une alternative convenable de vos applications mobiles Android préférées sur ordinateur de bureau, n’hésitez pas à utiliser ARC Welder, une excellente solution à ce problème.

Highly

C’est l’une des extensions les plus efficaces pour ceux qui sont habitués à travailler avec du texte tout au long de la journée. Dans la vie ordinaire, nous sommes habitués à mettre en évidence les extraits les plus importants avec un marqueur jaune. Sur Internet, Highly est une excellente alternative. Créez simplement un bref résumé du texte et enregistrez-le ou partagez-le avec vos amis ou vos collègues!

Taco

Taco est un gestionnaire de tâches qui combine vos tâches à partir des services tels que Highrise, Google Gmail, Google Tasks, GitHub Issues, Exchange, Evernote, Bugzilla, Codebase, Bitbucket, Asana, Basecamp et autres dans une seule interface. Cela fonctionne très bien, et le plus important, est qu’il est très beau et convivial.

Marker

L’extension Marker, recommandée par l’un de nos fidèles lecteurs, permet de faire des captures d’écran, de les anoter et de les partager avec son équipe de développeurs pour faciliter la communication et le reporting des bugs. Une extentions particulièrement interessante pour faire un bon contrôle qualité sur les vos projets. Une video de démonstration est disponible.

Conclusion

Toutes les extensions énumérées ci-dessus vont simplifier considérablement la routine du développeur Web et surtout de gagner du temps précieux. Le plus important est que toutes ces fonctionnalités seront intégrées directement dans le navigateur et par conséquent, vous n’avez pas besoin d’installer de logiciels supplémentaires. De plus, ces extensions pourront vous suivre sur n’importe quel ordinateur où vous vous identifierez. Mais il demande de ressources, donc à vous de choisir lesquelles seront les extensions que vous vous en servirez le plus, pour les autres vous pourrez les désactiver jusqu’au moment où vous aurez besoin.

Source : Aurone.com

9 décembre 2016 Par Team Click 123 Création Web Développement HTML Navigateurs SEO Social Media Web Ajouter un commentaire

À propos de l'auteur

Luis Rosas est Concepteur / Développeur Web / Spécialiste E-Commerce. Je travaille avec différents langages de programmation et technologies comme : HTML5, CSS3, JavaScript, jQuery, PHP, Ruby, Less, Sass et avec diverses plates-formes Open Source comme Wordpress, Drupal, Magento, Prestashop, OpenCart entre autres.