Si vous vous êtes déjà demandé comment voir les polices utilisées par un site web, la réponse est aussi simple que d’ouvrir l’inspecteur de votre navigateur. Comme chaque élément d’un site web est interprété par votre navigateur, si vous savez comment utiliser correctement l’inspecteur de votre navigateur, vous pouvez déterminer les polices, les images, les propriétés CSS et tout ce qui se trouve sur la page.
Dans cette article, nous vous montrons comment utiliser l’inspecteur d’élement de votre navigateur pour trouver les polices utilisées par un site, et même comment commencer à jouer avec ces polices sur une page.
Voici l’article en vidéo :
Comment connaître la police utilisées par un site
- Ouvrez l’inspecteur de votre navigateur. Dans Chrome ou Firefox, vous pouvez le faire en cliquant avec le bouton droit de la souris et en choisissant Inspecter. Ctrl+Shift+I (Windows) ou Cmd+Shift+I (Mac) devraient également fonctionner.
- Naviguez jusqu’à l’élément dont vous souhaitez connaître la police. Vous pouvez le faire soit en cliquant sur Inspecter sur l’élément lui-même, soit en naviguant vers l’élément dans le modèle d’objet de document de l’inspecteur, sa carte des éléments HTML liés qui composent le site. Faites attention aux sections de la page qui sont mises en évidence lorsque vous vous déplacez.
- Une fois que vous êtes sur le bon élément, naviguez jusqu’à l’onglet Console dans l’inspecteur et faites défiler la page jusqu’à l’attribut font-family. La police de l’élément y est indiquée.
Là encore, en plus de vous aider à trouver les polices utilisées le site web, l’inspecteur du navigateur peut vous permettre de faire toutes sortes d’expériences dans n’importe quel onglet de votre navigateur.
Comment découvrir la police utilisé par une image d’un site
Autre point important : que faire si vous voulez voir quelle police de caractères est utilisée pour une image ? Par exemple, vous pouvez être curieux de savoir quelles polices sont utilisées dans le logo du site ou dans une infographie. Dans ce cas, l’inspecteur de votre navigateur ne vous sera pas d’une grande aide.
Il existe une chose géniale pour cela, et elle s’appelle Font Squirrel Matcherator :
- Téléchargez l’image du site (en utilisant un clic droit > Enregistrer l’image sous ou une autre méthode), et téléchargez la dans l’interface de Matcherator.
- Utilisez la boîte de sélection bleue pour choisir la partie de l’image dont vous voulez analyser la police. (Vous devriez voir le logiciel commencer à mettre des petites boîtes autour des éléments qu’il identifie comme des caractères de police).
- Cliquez sur Matcherate It !
Les résultats devraient vous donner des polices qui correspondent très étroitement au texte sélectionné. Si vous pensez qu’il ne s’agit pas d’une correspondance exacte, vous pouvez continuer à chercher sur Google : par exemple, si le résultat obtenu est Adagio Slab, cherchez « Polices similaires à Adagio Slab » sur Google et voyez ce qui en ressort. Les listes de polices similaires de whatfontis.com semblent être particulièrement utiles.
