AccueilActualitésRessourcesExtensions et Bookmarklets #1: Présentation Extensions et Bookmarklets #1: Présentation Publié le 26/01/2012 Ressources Premier article d’une série sur les extensions et bookmarklets. Aujourd’hui, présentation et quelques exemples. Introduction Tout le monde connaît les extensions que l’on peut installer sur son navigateur. Popularisées grâce aux premières versions de firefox, elles permettent d’ajouter des fonctionnalités à son navigateur, ou bien (au départ grâce à greasemonkey pour firefox, nativement pour chrome et firefox maintenant) permettre de modifier directement la vision que l’on a de certains sites. Mais avez-vous déjà croisé un bookmarklet? Ce sont de petits codes que l’on place dans la barre de favoris du navigateur (généralement par copier coller), et qui, au lieu d’ouvrir une autre fenêtre, modifie la page actuel. Comme exemple, vous pourrez par exemple trouver Css Refresh, qui permet de recharger une page dès que son Css est modifié sans avoir à faire F5. Ils sont, en définitive, des sortes de mini-extensions navigateurs, plus simple à installer, et au fonctionnement un peu plus limitéė. Ces deux technologies sont très proche, par les possibilités mais aussi par la construction : Leur langage principal est le javascript, agrémenté de html et css. Exemples Voilà quelques exemples de bookmarklets. Readability Cette petite extension permet de nettoyer son écran, pour n’en garder que le contenu, et avoir un meilleur confort de lecture. disponible en bookmarklet et en extension sur leur site. PDF download Connaissez vous pdf download ? Ce site permet de récupérer une version pdf d’un site web. Ce petit bookmarklet simplifie l’opération, en ouvrant directement les champs du site pdfdownloader préremplis avec le site actuel. Download as PDF Et comme on ne se refait pas, voilà les quelques uns que j’utilise au quotidien pour m’aider dans mon travail. Pendule Pendule est une extension pour chrome qui permet d’avoir beaucoup d’informations sur le css, les formulaires et autres des pages web. Très pratique en collaboration avec l’inspection d’éléments de chrome. L’installer ici Spry Media Voilà un petit bookmarklet sympatique qui permet d’afficher des grilles ou mesurer une distance entre deux points sur un site web. Plus pratique que d’avancer à tatons. Spry Media XRay XRay permet de connaitre le type, l’arbre de node et la taille d’un élément rien qu’en cliquant dessus. Un peu doublons avec l’outil d’inspection d’élément, mais pratique quand l’on surf sur un navigateur ne le proposant pas. XRAY Test Selector Test selector fait un peu le travail inverse de test selector: Donnez lui une requête de selection CSS (par exemple « p nav.menu a »), et il mettra en avant tout les éléments qui correspondent à cette requête. Test Selectors Le mot de la fin Voilà pour aujourd’hui. Ne manquez pas le prochain article qui proposera un tutoriel sur comment créer un bookmarklet! By Benjamin Sanchez Laisser un commentaire Annuler la réponseVotre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *Comment Nom * E-mail* Site web Enregistrer mon nom, mon e-mail et mon site dans le navigateur pour mon prochain commentaire.
Ressources 20 tutos vidéos gratuits pour en apprendre plus sur Photoshop – Volume #2 Publié le 28/04/2017