Toi, étudiant en DUT MMI ou simplement internaute aguerri, tu n’es pas sans savoir que ton navigateur web, que ce soit Chrome, Safari, Firefox ou Opera, peut s’équiper d’une multitude d’extensions gratuites !

Si tu es un fou de webdesign, ou que tu aimes juste passer du temps à faire de la veille, j’ai quelques plugins à te conseiller ! Ils te permettront de mettre de côté des idées, trouver des typos sympatoches, des images ou des couleurs qui t’inspirent. Bref, de bons petites extensions à ajouter à ton browser si ce n’est pas déjà fait, et en voici la liste

Capture tout ce qui t’inspire

Pin It

Si tu as un compte Pinterest, alors il te faut absolument le plugin Pin It. Imagine : tu viens de trouver une superbe photo ou une interface canon mais tu as la flemme de l’enregistrer dans les fins fonds de ton ordi pour la re-uploader, un jour, sur Pinterest (si t’y penses). Alors avec le petit plugin Pin It, tu peux ajouter en 1 clic (bon ok, deux clics en fait) l’image directement à un de tes tableaux. Dispo pour Chrome, Safari et Firefox.

Webpages Screenshot

Impossible de capturer la totalité du site web, même sous la ligne de flottaison ? La solution s’appelle Webpages Screenshot et je te la recommande si tu es sur Chrome.

FireShot

Si tu utilises Firefox, j’ai testé pour toi FireShot qui est une très bonne alternative au plugin présenté ci-dessus. Et avec FireShot, tu peux même enregistrer intégralement des pages web au format PDF (on sait jamais, ça peut servir) !

Awesome Screenshot

Les utilisateurs de Safari pourront installer Awesome Screenshot pour capturer des pages web entières, les annoter, les rogner, et tout ça de façon rapide et efficace depuis le navigateur !

ShotPin

Avec les plugins cités juste au-dessus, tu as la possibilité de screener des zones précises de ton écran, mais c’est assez reloud d’enregistrer l’image sur ton ordi, puis la re-uploader sur Pinterest (oui parce que Pinterest est un très bon outil de veille). Heureusement, quand de petits éléments t’intéressent (un bouton particulier, un menu dropdown stylé), tu peux utiliser ShotPin pour sélectionner la zone que tu veux capturer pour l’envoyer directement sur Pinterest ! Houraaaaa ! Par contre, je n’ai trouvé ça que pour Chrome, mais si tu connais une alternative pour Firefox & Safari, balance-nous le lien !

Sip

Lui va te permettre d’utiliser une pipette dans ton navigateur pour identifier la couleur et obtenir son code hexadécimal. C’est un peu plus rapide et pratique que de faire Inspecter l’élément puis de chercher la bonne propriété CSS, copier-coller, etc … Et si tu es sur Mac, je te propose de télécharger Sip (merci Emma), un appli qui te permettra de tout pipetter !

Palette Grabber

Et si tu es sur Firefox, tu as le droit à Palette Grabber, un addon plutôt malin qui te fourni une palette de couleurs pour Photoshop, créée à partir de la page web sur laquelle tu es. Pas mal, non ?

WhatFont

Dans le même esprit que ColorZilla, WhatFont te détectera directement quelle typo est utilisée sur l’élément du site que tu vises, avec en plus des données sur sa graisse (bold, extrabold, light), son corps, etc ..

FontFinder

Les adeptes de Firefox ont leur propre WhatFont, et il s’appelle Font Finder ! Un addon qui te permet d’avoir un aperçu rapide de la typo utilisée sur le site.

Stylify Me

Et sinon, je dois absolument te faire connaître un site qui fait ColorZilla, Palette Grabber, Font Finder et WhatFont à la fois ! Il s’agit de Stylify Me. Je t’explique le concept : tu donnes l’URL du site dont tu veux connaître la charte, et Stylify Me te donne toutes les couleurs et polices utilisées, ainsi que leur corps. Tu peux même télécharger la charte au format PDF

Viens, on re-décore nos nouveaux onglets !

Panda

Qu’est-ce que c’est ça Panda ? C’est une application web qui diffuse des flux d’images provenant de Dribbble, Behance et d’autres sites sur une seule et même page. Tu peux aussi ajouter des flux de sites comme Sidebar ou bien Mashable. Panda (actuellement en version 4) existe aussi comme application pour Chrome. C’est un outil de veille indispensable si tu as la flemme d’ouvrir 35 sites pour voir de la nouveauté.

Palettab

A chaque nouvel onglet ouvert sur Chrome, Palettab te propose une palette de couleur aléatoire et par la même occasion te fait découvrir des Google Fonts. Tu peux aussi cliquer sur la couleur pour copier le code hexa.

Momentum

Amateur de belles photographies ? Alors le plugin Chrome Momentum est pour toi : Chaque jour une nouvelle photo juste sublime, pour rendre ton navigateur plus original (attention, ces photos ne sont pas libre de droit !). Pinterest avait lancé en 2014 Pinterest Tab, qui se base sur le même principe que Momentum, sauf que là ce sont des épingles issues du site, et tu peux choisir des catégories pour l’image à afficher.

Exposure New Tab

Dans le même style que le plugin pour Chrome cité au-dessus, Exposure New Tab te permettra d’ouvrir un nouvel onglet avec une sublime photographie qui embellira ton navigateur ;)

Et les articles et les tutos, je les enregistre comment ?

Que ce soit dans le webdesign ou tout autre domaine, il arrive de lire de bons articles intéressants et utiles (comme ceux du Blog du MMI). Du coup, on fait un rapide glisser-déposer du lien dans la barre de favoris en se disant qu’on le retrouvera parmi les 956 autres articles enregistrés de la sorte.

Scoop.it!

Et sinon, tu connais Scoop.it! ? Scoop.it! est une sorte de réseau social qui te permet de classer des liens par « topics« ‘ (sujet), et le site (made in France) possède une extension pour enregistrer ces liens directement dans un de tes topics sans quitter la page que tu es en train de lire ! En gros, c’est un outil de veille trop génial, tu peux simultanément tweeter ton nouveau scoop, le poster sur Facebook, et etc …

  • Je t’invite à consulter mon profil sur Scoop.it! pour comprendre de quelle façon je m’en sers dans ma veille pour le webdesign

On est d’accord, quand tu fais de la veille, t’es pas à l’abri de tomber sur THE tuto vraiment trop génial ! Alors Scoop.it! c’est sympa quand tu veux que tout le monde puisse voir ce que tu enregistres, mais le problème, c’est que nous ne sauvegardons que des liens, et pas le contenu ! Avec Evernote et son extension Evernote Web Clipper, tu peux prendre le contenu d’une page, standardiser sa mise en page pour une meilleure lecture, et enregistrer intégralement le contenu sur ton cloud Evernote ! Pratique si tu as peur qu’un auteur supprime le méga-super-top-génial tutoriel qui expliquait comment faire du popcorn atomique dans un igloo au Pakistan :)

Evernote

Au passage, cette même extension d’Evernote te permet de faire des captures d’écran de page, d’annoter des éléments sur la page web, et encore plein d’autres choses (non non, le Blog du MMI n’est pas sponsorisé par Evernote) !

PS : Nos supers-lecteurs recommandent également :

  • MeasureIt (Chrome / Safarie / Firefox), permet de mesurer des éléments de ta page web (recommandé par @Palomalice)
  • Pocket (Chrome / Safari / Firefox), pour stocker du contenu (recommandé par dd)

Voilà, il ne te reste plus qu’à équiper ton navigateur web qui deviendra un super-navigateur, maintenant efficace à 200% dans ta veille pour le webdesign

D’ailleurs, je pense qu’on a dû faire le tour, tu crois pas ? Bien entendu, si un plugin que tu connais n’est pas mentionné dans cette liste, fonce nous donner le lien dans les commentaires ! Tu peux aussi donner une note juste au-dessous de cet article (les petites étoiles), et même partager sur tes réseaux sociaux préférés ! Je te facilite la chose en te proposant de tweeter l’article :

#Webdesign : Des extensions de navigateur incontournables pour améliorer ta #veilleClick to Tweet
Super-navigateur : Le plein d’extensions pour ta veille webdesign
4.8 (96.92%) 13 votes

Ce qui pourrait également t'intéresser ...

Comment adapter son contenu pour mobile ?

Comment adapter son contenu pour mobile ?

Toi aussi tu passes tellement de temps sur ton smartphone qu'on a l'impression qu'il est greffé dans ta main ? (bon ok j'exagère à peine) [icon name="emo-laugh"] Alors tu as sûrement dû remarquer que certains sites étaient plus ou moins optimisés pour ton mobile, non ? Lire la suite

15 réflexions sur “ Super-navigateur : Le plein d’extensions pour ta veille webdesign ”

    1. Même si c’est plus éloigné de la thématique, c’est une bonne recommandation !
      Je connais de nom parce que j’avais cherché ce genre de logiciel pour stocker mes pwd. Du coup, toi qui l’utilise, peux-tu me dire si la gestion de login/mot de passe est pratique avec ce système ?

  1. super utile merci beaucoup ! Je suis entrée en DUT MMI directement au second semestre et je suis un peu à la traine , vos articles m’aident énormément , ça me permet d’avoir des avis et de ne pas avoir à chercher de partout , un gain de de temps non négligeable ! Ce serait top si vous pouviez faire un article sur le poursuites d’études possibles dans quels établissements et les métiers possibles , si il y a des débouchés etc.

    1. Ca nous fait plaisir si nos articles et tutoriels t’aident !
      Et bien justement, cet article est en préparation, on essaiera de le publier le plus tôt possible

      1. C’est vraiment génial et très altruiste de votre part sincèrement merci !! Votre blog mérite d’être plus connus surtout chez nous les MMI

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Je veux Contribuer

C'est parti

Je suis un Professionnel

Voyons voir