Comment Trouver la Police d’une Page Web À l’aide de l’outil Inspecter l’élément et des Extensions de navigateur

Le succès de votre site Web dépend grandement de son apparence. Avoir la bonne combinaison de couleurs et le bon thème gardera vos visiteurs sur votre site un peu plus longtemps. En plus de la palette de couleurs et de la structure de votre site, la police que vous choisissez joue également un rôle essentiel pour fidéliser votre public.

Vous tombez peut-être sur un site attrayant en naviguant sur le Web et vous voulez savoir quelles polices il utilise. Grâce aux extensions en ligne et à l’outil d’inspection des éléments intégré à votre navigateur, l’identification d’une police est rapide et facile.

Comment trouver des polices À l’aide de l’outil Inspecter les éléments

Si vous ne le saviez pas, l’outil d’inspection des éléments intégré à votre navigateur vous permet d’examiner le code source d’un site Web. Vous pouvez comprendre les éléments de conception d’un site en consultant ses informations CSS, HTML et autres. C’est un excellent moyen de vous inspirer lors de la conception de votre propre site.

Le processus d’identification d’une police à l’aide de l’outil Inspecter l’élément est assez simple, et vous n’aurez besoin d’aucune compétence en codage. Cet outil est disponible dans tous les navigateurs du marché, et chacun a une mise en page similaire.

Voici comment identifier une police à l’aide de l’outil d’inspection de votre navigateur.

1. Ouvrez le site Web que vous souhaitez utiliser.
2. Mettez en surbrillance le texte contenant la police que vous souhaitez identifier et cliquez dessus avec le bouton droit de la souris.
3. Cliquez sur Inspecter dans le menu contextuel.
   

   

4. Lorsque le menu Inspecter s’ouvre, cliquez sur le Calculé.
5. Faites défiler vers le bas pour trouver la section Font-Family. Ici, vous pouvez trouver le nom et le style de la police, ainsi que ses dimensions.
   

   

Autres façons d’utiliser l’outil d’inspection

Si vous souhaitez trouver plus rapidement la police d’un site à l’aide de l’outil d’inspection, essayez plutôt ceci:

1. Ouvrez le site Web que vous souhaitez utiliser.
2. Appuyez sur Ctrl + Maj + C (Cmd + Maj + C sur Mac).
3. Survolez le texte pour afficher le style de police, la taille, le code couleur et la marge.
   

   

Vous pouvez également consulter la liste des polices utilisées sur une page Web à l’aide de l’outil Inspecter. Voici comment procéder:

1. Allez sur la page web.
2. Ouvrez le code source en appuyant sur Ctrl + Maj + I (Cmd + Maj + I sur Mac).
3. Cliquez sur l’onglet Réseau, puis sélectionnez l’onglet Police.
4. Ici, vous verrez une liste de toutes les polices utilisées sur la page Web.
   

   

Pour obtenir la liste de toutes les polices en temps réel, vous devrez peut-être actualiser la page Web.

Comment identifier les polices À l’aide des extensions de navigateur

Si vous souhaitez un moyen plus pratique d’identifier une police, vous pouvez installer une extension de navigateur de recherche de polices. Bien qu’il existe plusieurs extensions de navigateur qui peuvent aider à détecter les polices sur le Web, les deux plus populaires sont WhatFont et Font Finder.

Examinons le processus d’identification des polices à l’aide des deux extensions.

WhatFont

WhatFont est très populaire pour détecter rapidement plusieurs polices à la fois. Voici comment utiliser cet outil.

1. Lorsque WhatFont est activé dans votre navigateur, survolez le texte pour afficher sa police.
   

   

2. Une fois que vous avez cliqué sur le texte, une fenêtre contextuelle apparaîtra avec le reste des détails de la police, tels que la taille, la couleur et le style de la police.
   

   

3. De plus, vous pouvez sélectionner plusieurs sections de texte simultanément pour comparer différentes polices sur la même page.
   

   

Télécharger: WhatFont pour Chrome / Firefox / Safari (Gratuit)

Font Finder

Font Finder affiche également les détails de la police lorsque vous survolez un texte sur un site Web. Cependant, il fournit beaucoup de détails techniques, de sorte qu’il peut devenir un peu déroutant si vous n’êtes pas familier avec la conception Web.

Cela dit, Font Finder convient mieux aux développeurs Web qui souhaitent remplacer les polices existantes par de nouvelles en temps réel. Cela facilite le test des polices avant d’apporter des modifications permanentes.

Voici comment tester une police à l’aide de Font Finder:

1. Mettez en surbrillance une partie du texte de la page Web.
2. Faites un clic droit dessus et sélectionnez Recherche de polices dans le menu contextuel.
   

   

3. Sélectionnez Remplacer la police par et entrez le nom de la police. Ajoutons Calibri et voyons comment cela change la police dans l’aperçu.
   

   

4. Si vous souhaitez réinitialiser la police, actualisez la page.
   

   

Télécharger: FontFinder pour Chrome / Edge / Firefox (Gratuit)

Qu’en est-il de la vérification de la Police dans une Image?

Si vous souhaitez identifier les polices d’une image, les extensions de navigateur et l’outil d’inspection de votre navigateur peuvent ne pas vous aider. Cependant, vous pouvez essayer des outils d’inspection d’images en ligne tels que WhatFontIs, FontSquirrel, Fontspring, WhatTheFont et bien d’autres.

Le processus d’identification d’une police à partir d’une image est en grande partie le même dans tous les outils. Essayons d’identifier la police dans une image en utilisant WhatTheFont.

1. Si ce n’est pas déjà fait, téléchargez l’image que vous souhaitez utiliser.
2. Importez l’image dans WhatTheFont.
   

   

3. WhatTheFont détectera automatiquement le texte de votre image. Réduisez ou agrandissez la zone de recadrage afin qu’elle entoure la police que vous souhaitez identifier. Appuyez sur le bouton fléché lorsque vous avez terminé.
   

   

4. WhatTheFont fera ensuite correspondre la police de l’image avec les polices de sa galerie et vous montrera des polices étroitement liées.
   

   

5. Si vous ne trouvez pas une bonne correspondance tout de suite, vous pouvez continuer à cliquer sur Afficher plus de résultats pour voir plus de polices associées.
   

   

Détectez les polices du Web et Utilisez-les dans vos designs

Les polices jouent un rôle important dans le succès d’un site Web ou d’un design graphique. Si vous tombez sur une police engageante lors de la navigation sur le Web, vous pouvez facilement la détecter en utilisant les méthodes ci-dessus.