Je commence avec cet article un nouveau projet, soit une carte narrative interactive entièrement programmée. J’en ai déjà fait une pour accompagner mon livre, mais je n’avais pas eu le temps de faire un tutoriel complet. Ce projet ne le sera pas nécessairement non plus, mais je vais partager avec vous quelques trucs qui, je l’espère, vous aideront dans vos propres projets. Donc, le premier de ces trucs, ce sont les polices Google. Quand on écrit un site web, le choix de police Web par défaut est assez limité.

Difficile de se démarquer avec ces polices. Heureusement, il y a Google Fonts. Sur le site, de façon à prévisualiser le résultat, on entre un texte significatif, on choisit la taille qui sera celle du texte sur notre site, et on voit le résultat dans les diverses polices.

Quand on en a trouvée une qui nous plaît, on clique sur le lien suivant:

puis on copie les infos à coller dans l’en-tête de notre site web.

Il est bon aussi de prévenir le navigateur que votre site utilise des ressources externes avec cette ligne de code:
<link rel="preconnect" href="https://fonts.gstatic.com">
On peut dès lors utiliser la police dans notre CSS, par exemple ainsi:
.titre { font-family: 'Stint Ultra Condensed'; text-align: center; color: white;
Ces polices ont été créées par diverses personnes qui les partagent selon les conditions qu’elles stipulent, par exemple ici:

Il est important de respecter ces conditions et personnellement j’ajouterais dans la section attribution de votre site le nom de la personne qui a créé la police, comme ici:

Je vous souhaite bien du plaisir avec votre nouvelle police!

Laisser un commentaire