Blog e-commerce - Joptimisemonsite
  • Trucs & Astuces
    • Design
    • Monétisation
    • Divers
  • UX/UI
    • Tests A/B
  • Astuces SEO
  • Dropshipping
  • Débuter en e-commerce
    • Wizishop
    • Prestashop
    • Shopify
    • Wix
    • Solutions de paiement e-commerce
  • Email Marketing
Aucun résultat
Voir tous les résultats
Blog e-commerce - Joptimisemonsite
  • Trucs & Astuces
    • Design
    • Monétisation
    • Divers
  • UX/UI
    • Tests A/B
  • Astuces SEO
  • Dropshipping
  • Débuter en e-commerce
    • Wizishop
    • Prestashop
    • Shopify
    • Wix
    • Solutions de paiement e-commerce
  • Email Marketing
Aucun résultat
Voir tous les résultats
Blog e-commerce - Joptimisemonsite
Aucun résultat
Voir tous les résultats

Police d’écriture: 3 outils gratuits pour détecter la police d’un site internet

Sébastien BLERIOT par Sébastien BLERIOT
28 février 2018
dans Design
Temps de lecture : 5 mins
0
comment-identifier-police-ecriture-site-internet

Si vous avez prévu d’ouvir une boutique en ligne, de créer un site internet ou de refondre le vôtre, vous pourriez être intéressé par ce qui suit. En effet, lors de vos différentes sessions de benchmark ou votre navigation internet, vous vous êtes sûrement déjà dit: « j’aime bien la police d’écriture de ce site » suivi d’un « je l’utiliserais bien pour mon site internet ».

La police d’écriture d’un site, que l’on peut également appeler « font » ou « typographie », fait partie intégrante d’une charte graphique de site internet. C’est en partie grâce à elle que vous allez imposer le design de votre site ainsi que tous les éléments de communication que vous aller créer. Il est donc indispensable de bien la choisir et la copier sur un de vos sites préférés peut être une bonne idée.

Et c’est là que j’interviens !

En effet, sachez qu’il existe un outil gratuit pour détecter la police d’écrire d’un site internet. Je vous propose aujourd’hui de vous livrer le nom de cet outil tout en vous expliquant la démarche pour identifier la typographie utilisée par un site internet en quelques clics seulement. Et l’avantage, c’est que cela devrait vous prendre 2 minutes au maximum.

Accéder à une partie de l'article

Toggle
  • Comment identifier la police d’écriture d’un site internet ?
    • L’outil gratuit est en fait une extension !
    • Comment fonctionne la détection de fonts ?
    • Tout savoir sur la police d’écriture utilisée par un site
  • Et si on ne veut pas installer d’extension ?
    • WhatTheFont
    • What Font is

Comment identifier la police d’écriture d’un site internet ?

Avant de commencer, sachez que j’ai publié récemment un article dans lequel je vous livre 3 sites internet pour télécharger des fonts gratuitement. N’hésitez pas à passer un peu de temps sur ce site car il y a logiquement la police d’écriture de votre futur site internet.

L’outil gratuit est en fait une extension !

Cette extension, elle s’appelle WhatFont et est disponible sur le navigateur le plus utilisé actuellement en France, à savoir Google Chrome. Je vous proposer de télécharger cette extension en utilisant les liens suivants: Whatfont pour Google Chrome

identifier-police-ecriture-site-internet

Cliquez simplement sur le lien ci-dessus et sélectionnez « ajouter à Chrome ». L’extension va alors s’installer dans votre navigateur et sera prête à être utilisée.

L’extension Safari à télécharger

A noter également que si vous utilisez le navigateur Safari d’Apple, vous pouvez également vous rendre sur le site du créateur de l’extension et la télécharger gratuitement.

Le site est en anglais (ainsi que l’extension) mais je vous assure que vous n’aurez aucune difficulté pour la trouver, la télécharger et l’utiliser.

L’extension Firefox: Font Finder

Sur Firefox, cette extension a un autre nom: Font Finder.

Comme ses pairs, elle est totalement gratuite et s’installe en quelques clics seulement.

connaitre-police-ecriture-site-internet

Comment fonctionne la détection de fonts ?

Pour identifier la typographie d’un site internet, il vous faudra cliquer sur l’extension présente à droite de la barre d’URLs de votre navigateur Google Chrome.

Passez ensuite votre souris sur la typologie qui vous intéresse. Vous verrez alors apparaître une petite box qui vous livrera le nom de la police d’écriture utilisée pour le texte sur lequel vous serez positionné. Voici un exemple ci-dessous:

détecter-font-site-internet
Dans cette capture d’écran, on apprend que la police d’écriture utilisée par Amazon est nommée « Amazon Ember »

Tout savoir sur la police d’écriture utilisée par un site

Là où l’outil est encore plus intéressant, c’est qu’il permet également de TOUT savoir sur la police d’écriture utilisée par le site internet interrogé.

En effet, vous allez pouvoir, en cliquant simplement sur le texte qui vous plait, tout savoir sur ce texte: la famille, le style, la taille, la couleur… etc comme vous pouvez le voir ci-dessous:

identifier-typo-site-internet-outil-gratuit
Sur cette capture, on apprend que Rueducommerce utilise la police d’écriture Roboto, ayant un style normal mais également la taille de 14 pixels ou encore la couleur utilisée

Vous aurez ainsi toutes les informations nécessaires pour copier la police d’écriture d’un site et l’utiliser sur le vôtre gratuitement.

Elle est pas belle la vie ?

Et si on ne veut pas installer d’extension ?

Dans le cas où vous êtes réfractaire aux extensions, sachez qu’il existe également des services alternatifs en mode SAAS. Et comme pour Whatfont, ces solutions sont gratuites.

WhatTheFont

Le premier site est WhatTheFont. A noter qu’il est dans la langue de shakespeare mais que cela ne devrait pas être trop compliqué à utiliser, même pour des non initiés à l’anglais.

Pour détecter la typographie utilisée par un site, il vous suffira de faire une capture d’écran du site dont la typographie vous intéresse. Une fois cette capture réalisée, uploadez la tout simplement sur le site et celui-ci vous livrera toutes les informations nécessaires.

La problématique, c’est qu’il faut absolument que votre image ne comporte qu’une seule et unique police d’écriture. En effet, l’outil ne sait pas gérer le multi-fonts ce qui n’est pas idéal lorsqu’on apprécie le mixe de typographies utilisées sur une page internet.

identifier-police-ecriture-site
Si vous uploadé une image qui comporte plusieurs polices d’écritures, vous vous exposez à ne pas avoir la réponse attendue mais bien ce message d’erreur.

A noter qu’il existe également une extension pour cet outil mais qui ne donne pas autant d’information que celle dont je vous ai parlé plus haut. L’ergonomie est plus rustique, ce qui démontre que l’outil est plus ancien, ce qui explique peut être pourquoi il est moins complet.

Dans le cas où vous ne souhaitez pas utiliser d’extension, What the Font peut tout de même être une alternative intéressante.

What Font is

Autre alternative à l’extension Whatfont qui vous permettra d’identifier la police d’écriture utilisée par un site internet: What Font is.

A la manière de What the Font, What Font is est un outil en mode SAAS, qui est donc accessible directement depuis votre navigateur internet. Il n’est donc pas nécessaire d’installer une extension pour l’utiliser.

Mais, après plusieurs utilisations de l’outil, je reste déçu par les informations apportées qui sont, selon moi, bien moins intéressantes que l’extension. Encore une fois, c’est pratique pour ceux qui n’ont pas les droits d’admin de leur PC et qui ne veulent pas attendre deux semaines que le service informatique de leur entreprise viennent leur installer.

Article précédent

Comment vider le cache sur Prestashop en 3 clics seulement ?

Article suivant

UTM Google: comment les utiliser pour tracker vos campagnes de communication

Sébastien BLERIOT

Sébastien BLERIOT

Evoluant en e-commerce depuis plus de 9 ans maintenant, j'ai profité de mes différentes expériences chez Rueducommerce et Next Interactive (BFM TV, RMC, 01net) et ELEGIA Formation pour développer mon expertise de la vente en ligne en B to C et B to B. J'accompagne désormais des e-commerçants dans l'optimisation de leur stratégie e-commerce. Je propose mes services en qualité de consultant mais également en tant que formateur/conférencier.

Vous pourriez également être intéressé par...

Astuces SEO

15 outils gratuits pour réaliser tous vos contenus digitaux sans photoshop

21 avril 2020

La création de contenu est le nerf de la guerre de votre présence sur...

Design

UX Design – 3 clés pour comprendre l’importance du design dans l’expérience utilisateur

7 juin 2017

Depuis plusieurs mois maintenant, je travaille sur la refonte du site de mon entreprise....

outils creation nuage de mots
Design

5 outils gratuits pour créer un nuage de mots-clés

21 février 2018

Le weekend dernier, j'étais en famille. Et une de mes tantes, qui travaille depuis...

symbolique-couleurs-signification-rouge-bleu-orange-jaune-blanc-vert
Design

La symbolique des couleurs et son impact sur le taux de conversion d’un site

27 novembre 2018

Depuis que je travaille dans le e-commerce, j'entends souvent dire qu'un bouton d'action doit...

DERNIERS ARTICLES

Formation TikTok E-commerce : La méthode ULTIME pour percer

Formation TikTok E-commerce : La méthode ULTIME pour percer

7 mai 2025
Comment vendre en ligne ? Les 6 étapes des boutiques à succès

Comment vendre en ligne ? Les 6 étapes des boutiques à succès

7 mai 2025
Cybersécurité du e-commerce en 2025 : risques et solutions

Cybersécurité du e-commerce en 2025 : risques et solutions

29 avril 2025
Obfuscation SEO : avantages, inconvénients & risques

Obfuscation SEO : avantages, inconvénients & risques

3 avril 2025
Pourquoi choisir un cloud souverain pour héberger vos données ?

Pourquoi choisir un cloud souverain pour héberger vos données ?

2 avril 2025

Newsletter

Abonnez-vous à la newsletter de Joptimisemonsite et recevez, chaque semaine, les dernières actualités publiées.

ARTICLES POPULAIRES

btob

Le BtoB, c’est quoi ? Comprendre le B to B en 2min seulement

25 septembre 2024
Dropshipping rentable

5 Exemples de Sites Dropshipping qui cartonnent en 2024 !

1 décembre 2023
wix avis

Wix Avis 2024 – Faut-il (encore) choisir Wix ?

25 septembre 2024
exemple charte graphique

3 superbes exemples de charte graphique à copier en 2024

9 décembre 2023
odoo-avis

Odoo Avis 2024 : faut-il choisir Odoo pour sa PME ?

9 novembre 2023

Le blog e-commerce qui vous aide à vendre plus !

SHOPIFY VS AUTRES CMS

  • Shopify Avis
  • Shopify ou Prestashop
  • Shopify ou Squarespace
  • Shopify ou Wizishop
  • Shopify ou Woocommerce
  • Shopify ou WordPress
  • Shopify ou Wix

WIX VS LES AUTRES CMS

  • Wix ou Jimdo
  • Wix ou Squarespace
  • Wix ou WordPress
  • Wix ou Weebly
  • Wix eCommerce
  • Wix Dropshipping

NEWSLETTER

Abonnez-vous à la newsletter de Joptimisemonsite et recevez, chaque semaine, les dernières actualités publiées.

  • Envie de nous contacter ?
  • Mentions légales et politique de confidentialité

Joptimisemonsite © 2024

Welcome Back!

Login to your account below

Forgotten Password?

Retrieve your password

Please enter your username or email address to reset your password.

Log In
Aucun résultat
Voir tous les résultats
  • Trucs & Astuces
    • Design
    • Monétisation
    • Divers
  • UX/UI
    • Tests A/B
  • Astuces SEO
  • Dropshipping
  • Débuter en e-commerce
    • Wizishop
    • Prestashop
    • Shopify
    • Wix
    • Solutions de paiement e-commerce
  • Email Marketing

Joptimisemonsite © 2024