Les feuilles de styles CSS
DEUXIÈME PARTIE
72
Les sérifs, issus de l’imprimerie traditionnelle, ne conviennent pas toujours à une utilisation pour le Web. Ils gênent notamment la lecture dans les petites tailles, où les
empattements accentuent la pixellisation et son crénage (ou « effet d’escalier »).
Les polices sans sérifs, dénuées d’empattements, sont d’apparence plus simple et plus
sobre. Leur confort de lecture sur écran les fait souvent privilégier dans les chartes
graphiques pour le Web. Les plus fréquentes sont Verdana et Arial.
Les polices à chasse fixe, dites monospace, attribuent à chaque caractère une largeur
constante, comme sur les machines à écrire (les « m » des textes imprimés étant au
contraire généralement plus larges que leurs « l »). Dans cette famille, on retient souvent Courier New pour l’affichage de code, de listings et de toutes les portions de
texte à reproduire verbatim.
Pour éviter que le système client opte pour une solution par défaut faute de disposer de
la police demandée, il est d’usage d’en préciser trois types : une police pour compatibles
PC, une autre pour Mac, en concluant par une famille générique disponible partout :
Cet exemple limite les mauvaises surprises : le navigateur cherche d’abord Trebuchet
MS. En son absence, il tentera Times et optera pour la police générique avec sérifs
en dernier recours. Autre solution :
Cette technique oriente le choix des polices par défaut et assure un affichage
« maîtrisé » du contenu du site web.
Pour des raisons syntaxiques, il est obligatoire en CSS de protéger les noms composés par des apostrophes simples (') ou doubles ("). Ainsi, on peut écrire arial
mais on devra écrire 'Trebuchet MS' ou "Trebuchet MS".
Affichage des polices exotiques
Les polices peu courantes ou exotiques sont rarement nécessaires sur les sites web.
Vous l’avez déjà compris, elles sont même déconseillées. Il est pourtant parfois utile
de s’en soucier, notamment dans le cas de sites internationaux devant s’afficher dans
de multiples langues.
body {
font-family: 'Trebuchet MS', times, serif;
}
body {
font-family : arial, helvetica, sans-serif;
}
DEUXIÈME PARTIE
72
Les sérifs, issus de l’imprimerie traditionnelle, ne conviennent pas toujours à une utilisation pour le Web. Ils gênent notamment la lecture dans les petites tailles, où les
empattements accentuent la pixellisation et son crénage (ou « effet d’escalier »).
Les polices sans sérifs, dénuées d’empattements, sont d’apparence plus simple et plus
sobre. Leur confort de lecture sur écran les fait souvent privilégier dans les chartes
graphiques pour le Web. Les plus fréquentes sont Verdana et Arial.
Les polices à chasse fixe, dites monospace, attribuent à chaque caractère une largeur
constante, comme sur les machines à écrire (les « m » des textes imprimés étant au
contraire généralement plus larges que leurs « l »). Dans cette famille, on retient souvent Courier New pour l’affichage de code, de listings et de toutes les portions de
texte à reproduire verbatim.
Pour éviter que le système client opte pour une solution par défaut faute de disposer de
la police demandée, il est d’usage d’en préciser trois types : une police pour compatibles
PC, une autre pour Mac, en concluant par une famille générique disponible partout :
Cet exemple limite les mauvaises surprises : le navigateur cherche d’abord Trebuchet
MS. En son absence, il tentera Times et optera pour la police générique avec sérifs
en dernier recours. Autre solution :
Cette technique oriente le choix des polices par défaut et assure un affichage
« maîtrisé » du contenu du site web.
Pour des raisons syntaxiques, il est obligatoire en CSS de protéger les noms composés par des apostrophes simples (') ou doubles ("). Ainsi, on peut écrire arial
mais on devra écrire 'Trebuchet MS' ou "Trebuchet MS".
Affichage des polices exotiques
Les polices peu courantes ou exotiques sont rarement nécessaires sur les sites web.
Vous l’avez déjà compris, elles sont même déconseillées. Il est pourtant parfois utile
de s’en soucier, notamment dans le cas de sites internationaux devant s’afficher dans
de multiples langues.
body {
font-family: 'Trebuchet MS', times, serif;
}
body {
font-family : arial, helvetica, sans-serif;
}