Le choix d’une police de caractères chinoise conditionne directement la lisibilité et la qualité perçue d’un contenu numérique ou imprimé. Source Han Serif, développée conjointement par Adobe et Google, propose une solution open source couvrant plus de 20 000 sinogrammes et offrant sept graisses modulaires. Sa licence libre et sa conception en sous-ensembles régionaux la rendent adaptée à la fois aux interfaces web et aux documents haute définition. Ce guide présente ses fondamentaux, son déploiement sur les principaux systèmes d’exploitation et les techniques d’optimisation de son rendu.
- Fondamentaux et atouts de Source Han Serif
Couverture de caractères et famille de graisses
Source Han Serif se distingue par trois caractéristiques techniques : une couverture étendue des jeux de caractères chinois (GB2312, GBK, GB18030), une palette de sept graisess allant de l’ExtraLight au Heavy, et un rendu cohérent entre écrans et sorties imprimées. La police est distribuée sous la licence SIL Open Font License, ce qui autorise son utilisation et sa modification dans des projets commerciaux sans frais de licence.
- Économie : pas de redevance, même pour un usage commercial ou un produit distribué massivement.
- Modularité : les fichiers sont fournis par région linguistique (CN, TW, JP, KR), ce qui permet de n’installer que le sous-ensemble nécessaire.
- Mise à jour communautaire : le projet évolue via des contributions externes qui corrigent les glyphes et améliorent le hinting.
- Cas d’usage et sélection des graisses
Chaque graisse répond à une fontcion précise dans la hiérarchie d’un document. Limiter une page à deux ou trois graisses différentes garantit une lecture fluide.
| Graisse | Usage typique | Taille recommandée |
|---|---|---|
| ExtraLight | Titres élégants, bannières créatives | 18–36 pt |
| Light | Corps de texte longs sur écran | 10–14 pt |
| Regular | Documents administratifs et rapports | 10–12 pt |
| Medium | Accroches et mises en valeur modérées | 11–13 pt |
| SemiBold | Sous-titres et titres de section | 14–18 pt |
| Bold | Titres principaux et marques | 16–24 pt |
| Heavy | Affichages publicitaires, points focaux | 24–48 pt |
À titre d’exemple, un magazine technique peut utiliser Regular pour le corps du texte, SemiBold pour les titres de rubrique et Bold pour le nom de la couverture. Sur une page web e-commerce, Medium met en valeur les noms de produit, Heavy souligne les promotions et Light sert aux descriptions longues.
- Installation sur les environnements courants
Windows
- Téléchargez l’archive contenant les fichiers
.ttfet ouvrez le dossier dédié à la version simplifiée chinoise. - Sélectionnez les fichiers de police, faites un clic droit et choisissez Installer.
- Redémarrez les logiciels de conception ou de bureautique pour qu’ils prennent en compte les nouvelles polices.
macOS
- Ouvrez le fichier
.ttfdans l’aperçu, puis cliquez sur Installer la police. - Gérez les polices et créez des collections via l’application Livre de polices.
- Dans les logiciels de création, spécifiez manuellement le chemin vers Source Han Serif pour éviter les conflits avec d’autres polices du même nom.
Linux
Une installation en espace utilisateur évite d’écrire dans les répertoires système et facilite les mises à jour :
# Création d’un répertoire dédié aux polices utilisateur
mkdir -p ~/.local/share/fonts/source-han-serif
# Copie des fichiers TTF chinois simplifié
cp ./TTF-CN/*.ttf ~/.local/share/fonts/source-han-serif/
# Actualisation du cache de fontconfig
fc-cache -f -v
# Vérification de la détection
fc-list : family | grep -i "Source Han Serif"
Si le rendu reste incorrect, vérifiez que le répertoire ~/.local/share/fonts est bien référencé dans la configuration de fontconfig.
- Optimisation pour le web et l’impression
Réduction du temps de chargement
Les fichiers de police chinoise sont volumineux ; il faut donc limiter le nombre de graisses chargées et préparer les ressources critiques.
- Préchargement du fichier critique dans l’en-tête HTML :
<link rel="preload" href="/assets/fonts/SourceHanSerifCN-Regular.ttf" as="font" type="font/ttf" crossorigin="anonymous">
- Déclaration des graisses utilisées via
@font-face:
@font-face {
font-family: 'HanSerifCN';
src: url('/assets/fonts/SourceHanSerifCN-Regular.ttf') format('truetype');
font-weight: 400;
font-display: swap;
}
@font-face {
font-family: 'HanSerifCN';
src: url('/assets/fonts/SourceHanSerifCN-Bold.ttf') format('truetype');
font-weight: 700;
font-display: swap;
}
- Politique d’affichage : l’attribut
font-display: swapévite le contenu invisible pendant le chargement.
Rendu écran versus rendu papier
- Écran : activez l’anticrénelage, utilisez une taille de 14–16 px et un interligne de 1,5–1,6.
- Impression : désactivez le lissage, préférez 10–12 pt et un interligne de 1,2–1,4.
- Couleurs : travaillez en RGB pour le numérique et en CMYK pour l’imprimerie afin de conserver une reproduction fidèle.
En grand format, ajustez le crénage dans le panneau de caractères de votre logiciel de maquette pour corriger l’espacement des sinogrammes.
- Diagnostic et compatibilité
Procédure de dépannage en cinq étapes
- Intégrité du fichier : comparez sa taille et sa somme de contrôle avec le paquet source.
- Cache des polices : sur Linux ou macOS, lancez
sudo fc-cache -fv. - Redémarrage de l’application : certains outils ne lisent les polices qu’au lancement.
- Compatibilité du format : assurez-vous que le logiciel prend en charge le format TrueType.
- Droits d’accès : le fichier doit être lisible par l’utilisateur qui exécute l’application.
Compatibilité entre navigateurs
Le rendu varie selon les moteurs. Définissez une pile de polices de secours et normalisez le lissage :
:root {
--font-serif-cn: 'Source Han Serif CN', 'Noto Serif SC', 'STSong', serif;
}
body {
font-family: var(--font-serif-cn);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
Mixte sinogrammes et latin
- Utilisez la partie latine de Source Han Serif pour les mots anglais et les chiffres afin de conserver l’harmonie stylistique.
- Ajoutez un léger espacement entre les blocs de langues :
word-spacingouletter-spacingselon le cas. - Activez la césure automatique pour les longues chaînes latines :
hyphens: auto.
Certains navigateurs ne reconnaissent correctement que les graisses 400 et 700 ; en cas de flou, vérifiez que font-weight correspond à une graisse réellement chargée.