La typographie, c'est 90% du design. Choisir les mauvaises polices ou les mauvaises associations ruine l'harmonie visuelle d'un site, même si le reste est parfait. Voici 5 combinaisons testées, éprouvées, et qui fonctionnent dans presque toutes les situations.
Les règles de base
Avant les combinaisons : deux règles qui s'appliquent toujours.
- Maximum 2 polices par identité. Une pour les titres, une pour le corps. Vous pouvez jouer sur les graisses et styles (italique, bold) au lieu d'ajouter une troisième police.
- Contraste entre les deux. Une serif + une sans-serif, c'est la combinaison classique. Deux serif ou deux sans-serif ensemble demandent plus de maîtrise pour ne pas se ressembler trop ou se battre.
1. Cormorant Garamond + Figtree
Une combinaison que j'ai longtemps utilisée. Cormorant est une serif élégante avec un fort caractère éditorial, idéale pour les titres. Figtree est une sans-serif géométrique moderne et très lisible en corps de texte.
Idéal pour : consultants, coaches, créatifs, secteur luxe & lifestyle, portfolios. Ambiance : sophistiqué, moderne, éditorial.
Comment les utiliser
Cormorant : titres H1 en italic weight 300-400, grand corps (48px+). Figtree : corps en weight 300, taille 16-17px, interligne 1.65-1.8. L'écart de caractère entre les deux crée une tension visuelle agréable.
2. Playfair Display + Inter
Playfair Display est plus prononcée que Cormorant, contrastes forts entre pleins et déliés. Elle attire l'œil immédiatement. Inter est la police sans-serif la plus utilisée sur le web en 2025, pour de bonnes raisons : parfaite lisibilité à toutes les tailles.
Idéal pour : avocats, architectes, professions libérales, luxe accessible. Ambiance : sérieux, premium, intemporel.
3. DM Serif Display + DM Sans
Conçues ensemble par Google pour fonctionner en duo, elles partagent le même ADN géométrique, ce qui crée une cohérence rare. DM Serif pour les gros titres, DM Sans pour tout le reste.
Idéal pour : startups, apps, tech, e-commerce moderne. Ambiance : propre, contemporain, tech sans être froid.
4. Libre Baskerville + Lato
Baskerville est l'une des grandes classiques de l'imprimerie, son équivalent web open source est très fidèle. Lato est chaleureuse et accessible, parfaite pour les corps de texte longs.
Idéal pour : médecins, thérapeutes, associations, ONG, édition. Ambiance : confiance, chaleur humaine, tradition.
5. Fraunces + Nunito Sans
Fraunces est une serif variable optique récente, avec une personnalité forte et mémorable. Nunito Sans est arrondie et conviviale. Ensemble, elles créent quelque chose d'original qui sort des sentiers battus.
Idéal pour : marques lifestyle, alimentation, beauté naturelle, artisanat. Ambiance : chaleureux, artisanal, mémorable.
Comment les appliquer
- Chargez vos polices via Google Fonts avec uniquement les graisses dont vous avez besoin (évitez "all weights")
- Utilise la propriété
font-display: swappour éviter le flash de texte invisible - Testez votre lisibilité sur mobile en priorité, la majorité de votre trafic vient de là