Comment installer la police Google Roboto sur Windows, Mac et Linux

La police Roboto est une police sans-serif créée par Google. Elle est élégante et s’affiche bien sur les écrans haute résolution, tels que les téléphones Android. En tant que telle, elle est parfaitement adaptée à de nombreuses applications. De plus, apprendre à installer la police Google Roboto sur Windows, macOS et Linux est un jeu d’enfant.

Table des matières

• Téléchargement de la police Google Roboto
• Installer la police Google Roboto sur Windows
• Installer la police Google Roboto sur macOS
• Installer la police Google Roboto sur Linux
• Utiliser la police Google Roboto sur un site Web
• Questions fréquentes

Téléchargement de la police Google Roboto

Quel que soit votre système, vous devez d’abord télécharger le pack de polices Roboto. Pour ce faire, rendez-vous sur le site de la police Roboto. La manière la plus simple de télécharger l’ensemble de la famille de polices est de cliquer sur le bouton “Télécharger la famille” en haut à droite.

Cela se terminera par un fichier ZIP sur votre ordinateur, à partir duquel vous pourrez l’installer sur votre système d’exploitation.

Si vos polices apparaissent pixelisées ou corrompues de quelque manière que ce soit, essayez ces étapes de dépannage pour résoudre le problème.

La bonne nouvelle est que, quel que soit le système, vous pouvez installer la police Roboto en quelques clics.

Installer la police Google Roboto sur Windows

Suivez ces étapes pour installer la police Roboto sur Windows :

1. Dézippez le dossier de la police Roboto. Cliquez avec le bouton droit et sélectionnez “Extraire tout.”

1. Ouvrez le menu “Démarrer” et sélectionnez “Paramètres.”

1. Cliquez sur “Personnalisation” et choisissez “Polices” dans la liste des paramètres à droite.

1. Faites glisser les polices extraites dans la fenêtre d’installation. Après quelques secondes, la police Google Roboto sera installée sur Windows. Vous pouvez la sélectionner comme n’importe quelle autre police dans les applications.

Pour installer d’autres types de polices ou simplement voir ce qui est disponible sur Windows, consultez notre guide pour installer et gérer les polices sur Windows.

Installer la police Google Roboto sur macOS

Suivez ces étapes pour installer la police Roboto sur Mac :

1. Extrayez le fichier ZIP. Double-cliquez ou cliquez avec le bouton droit et sélectionnez “Ouvrir.”
2. Sélectionnez toutes les polices à l’intérieur du dossier (en sautant LICENSE.txt), cliquez avec le bouton droit et sélectionnez “Ouvrir avec -> Livre des polices” dans le menu contextuel.

1. Cela les chargera dans le Livre des polices et les rendra disponibles pour une utilisation dans vos applications.

Notez que vous pouvez également double-cliquer sur les fichiers de police individuels pour les charger dans le Livre des polices.

Installer la police Google Roboto sur Linux

1. Extrayez les fichiers compressés avec la commande unzip.
2. Ouvrez votre dossier personnel et activez l’option pour afficher les fichiers/dossiers cachés. Vous pouvez appuyer sur Ctrl + H, ou cliquer sur le menu “Affichage” et choisir “Afficher les fichiers cachés.”
3. Localisez le dossier “.fonts”. S’il n’existe pas, créez-le.
4. Déplacez le dossier de la police Roboto dans ce dossier “.fonts”.

Alternativement, utilisez le programme Gestionnaire de polices pour gérer vos polices.

1. Installez le Gestionnaire de polices depuis le Centre de logiciels ou le dépôt.

1. Une fois installé, ouvrez-le ainsi que l’application Polices (encore une fois, depuis la barre de recherche).

1. Dans le Gestionnaire de polices, assurez-vous d’être sur l’onglet Gérer, et cliquez sur l’icône Plus (+).

1. Naviguez jusqu’à votre dossier de polices extraites et ajoutez-les selon vos besoins.

Une fois que vous redémarrez les applications que vous utilisez, vous devriez voir la police Roboto.

Bien que Linux ne devrait pas avoir de problème avec Roboto, certaines distributions, comme Ubuntu, peuvent avoir des difficultés à reconnaître certaines polices. Si vous avez des problèmes avec Roboto ou d’autres polices dans Ubuntu, essayez de les convertir au format de police TrueType.

Utiliser la police Google Roboto sur un site Web

Si vous souhaitez utiliser la police Roboto sur votre site Web, utilisez la syntaxe CSS3 @font-face pour intégrer la police externe à votre page Web.

1. Rendez-vous sur la page de police Roboto de FontSquirrel, cliquez sur “Kit Webfont”, puis choisissez vos formats de police préférés, un sous-ensemble (le cas échéant), et cliquez sur “Télécharger le kit @Font-Face.”

1. Extrayez le fichier compressé dans votre dossier de polices de site Web. Ouvrez votre feuille de style Web et ajoutez le code suivant :

@font-face{  
font-family:'Roboto';  
src:url('Roboto-Regular-webfont.eot');  
src:url('Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),  
url('Roboto-Regular-webfont.woff') format('woff'),  
url('Roboto-Regular-webfont.ttf') format('truetype'),  
url('Roboto-Regular-webfont.svg#RobotoRegular') format('svg');  
font-weight:normal;  
font-style:normal;  
}  
  
@font-face{  
font-family:'Roboto';  
src:url('Roboto-Italic-webfont.eot');  
src:url('Roboto-Italic-webfont.eot?#iefix') format('embedded-opentype'),  
url('Roboto-Italic-webfont.woff') format('woff'),  
url('Roboto-Italic-webfont.ttf') format('truetype'),  
url('Roboto-Italic-webfont.svg#RobotoItalic') format('svg');  
font-weight:normal;  
font-style:italic;  
}  
  
@font-face{  
font-family:'Roboto';  
src:url('Roboto-Bold-webfont.eot');  
src:url('Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'),  
url('Roboto-Bold-webfont.woff') format('woff'),  
url('Roboto-Bold-webfont.ttf') format('truetype'),  
url('Roboto-Bold-webfont.svg#RobotoBold') format('svg');  
font-weight:bold;  
font-style:normal;  
}  
  
@font-face{  
font-family:'Roboto';  
src:url('Roboto-BoldItalic-webfont.eot');  
src:url('Roboto-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),  
url('Roboto-BoldItalic-webfont.woff') format('woff'),  
url('Roboto-BoldItalic-webfont.ttf') format('truetype'),  
url('Roboto-BoldItalic-webfont.svg#RobotoBoldItalic') format('svg');  
font-weight:bold;  
font-style:italic;  
}  
  
@font-face{  
font-family:'Roboto';  
src:url('Roboto-Thin-webfont.eot');  
src:url('Roboto-Thin-webfont.eot?#iefix') format('embedded-opentype'),  
url('Roboto-Thin-webfont.woff') format('woff'),  
url('Roboto-Thin-webfont.ttf') format('truetype'),  
url('Roboto-Thin-webfont.svg#RobotoThin') format('svg');  
font-weight:200;  
font-style:normal;  
}  
  
@font-face{  
font-family:'Roboto';  
src:url('Roboto-ThinItalic-webfont.eot');  
src:url('Roboto-ThinItalic-webfont.eot?#iefix') format('embedded-opentype'),  
url('Roboto-ThinItalic-webfont.woff') format('woff'),  
url('Roboto-ThinItalic-webfont.ttf') format('truetype'),  
url('Roboto-ThinItalic-webfont.svg#RobotoThinItalic') format('svg');(sous la licence Apache Software).   
font-weight:200;  
font-style:italic;  
}  
  
@font-face{  
font-family:'Roboto';  
src:url('Roboto-Light-webfont.eot');  
src:url('Roboto-Light-webfont.eot?#iefix') format('embedded-opentype'),  
url('Roboto-Light-webfont.woff') format('woff'),  
url('Roboto-Light-webfont.ttf') format('truetype'),  
url('Roboto-Light-webfont.svg#RobotoLight') format('svg');  
font-weight:100;  
font-style:normal;  
}  
  
@font-face{  
font-family:'Roboto';  
src:url('Roboto-LightItalic-webfont.eot');  
src:url('Roboto-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),  
url('Roboto-LightItalic-webfont.woff') format('woff'),  
url('Roboto-LightItalic-webfont.ttf') format('truetype'),  
url('Roboto-LightItalic-webfont.svg#RobotoLightItalic') format('svg');  
font-weight:100;  
font-style:italic;  
}  
  
@font-face{  
font-family:'Roboto';  
src:url('Roboto-Medium-webfont.eot');  
src:url('Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'),  
url('Roboto-Medium.webfont.woff') format('woff'),  
url('Roboto-Medium.webfont.ttf') format('truetype'),  
url('Roboto-Medium.webfont.svg#RobotoMedium') format('svg');  
font-weight:300;  
font-style:normal;  
}  
  
@font-face{  
font-family:'Roboto';  
src:url('Roboto-MediumItalic-webfont.eot');  
src:url('Roboto-MediumItalic-webfont.eot?#iefix') format('embedded-opentype'),  
url('Roboto-MediumItalic-webfont.woff') format('woff'),  
url('Roboto-MediumItalic-webfont.ttf') format('truetype'),  
url('Roboto-MediumItalic-webfont.svg#RobotoMediumItalic') format('svg');  
font-weight:300;  
font-style:italic;  
}

1. Assurez-vous de changer le “src” pour pointer vers le chemin du dossier de polices.

2. Utilisez la syntaxe font-family:"Roboto"; pour afficher la police Roboto sur votre page Web.

Si vous avez des problèmes pour afficher correctement Roboto, Google a un guide de démarrage rapide qui peut vous aider.

Questions fréquentes

Existe-t-il une version serif de Roboto ?

Oui. Au début de 2022, Google Fonts a ajouté Roboto Serif à sa bibliothèque. Il est gratuit à télécharger, et vous pouvez l’installer comme Roboto. Utilisez les deux sur votre système si vous le souhaitez.

Dois-je un jour payer pour utiliser Roboto ou d’autres polices Google ?

Non. Elles sont complètement open source. Selon Google, vous êtes libre de les utiliser dans des projets personnels et commerciaux, totalement gratuitement. Si vous êtes développeur d’applications Android, ajoutez les polices à vos applications.

Puis-je installer d’autres polices Google en même temps ?

Vous pouvez télécharger et utiliser autant de polices Google que vous le souhaitez. Au moment de la rédaction, il y avait plus de 1 500 familles de polices parmi lesquelles choisir. Celles-ci se déclinent en variétés serif, sans-serif, display, écriture manuscrite et mono.

Comment puis-je savoir si une image ou un site utilise Roboto ?

Si vous admirez la police sur un site Web ou dans une image, il existe plusieurs outils utiles pour vous aider à identifier la police. Cela vous dira rapidement si l’image ou le site utilise Roboto ou une autre police.

Crédit image : Google Fonts. Toutes les captures d’écran par Crystal Crowder.