Des ensembles de polices cohérents pour le web

Si vos déclarations CSS font-family contiennent désespérément la même liste de police de caractères Helvetica, Arial, sans-serif, etc., le billet de Grégoire Polices sur le web et celui de Michael Tuck 8 Definitive Web Font Stacks devraient élargir votre horizon typographique grâce à 8 ensembles de polices « intelligents » :

En théorie

body {
    font-family :
    police exacte,
    alternative la plus proche,
    alternative la plus répandue pour chaque plateforme,
    alternative universelle (cross-platform),
    famille générique
}

Times New Roman et serif

body {
    font-family:
    Cambria,
    "Hoefler Text",
    Utopia,
    "Liberation Serif",
    "Nimbus Roman No9 L Regular",
    Times,
    "Times New Roman",
    serif;
}

Georgia

    body {
    font-family:
    Constantia,
    "Lucida Bright",
    Lucidabright,
    "Lucida Serif",
    Lucida,
    "DejaVu Serif",
    "Bitstream Vera Serif",
    "Liberation Serif",
    Georgia,
    serif;
}

Garamond

body {
    font-family:
    "Palatino Linotype",
    Palatino,
    Palladio,
    "URW Palladio L",
    "Book Antiqua",
    Baskerville,
    "Bookman Old Style",
    "Bitstream Charter",
    "Nimbus Roman No9 L",
    Garamond,
    "Apple Garamond",
    "ITC Garamond Narrow",
    "New Century Schoolbook",
    "Century Schoolbook",
    "Century Schoolbook L",
    Georgia,
    serif;
}

Helvetica/Arial

body {
    font-family:
    Frutiger,
    "Frutiger Linotype",
    Univers,
    Calibri,
    "Gill Sans",
    "Gill Sans MT",
    "Myriad Pro",
    Myriad,
    "DejaVu Sans Condensed",
    "Liberation Sans",
    "Nimbus Sans L",
    Tahoma,
    Geneva,
    "Helvetica Neue",
    Helvetica,
    Arial,
    sans serif;
}

Verdana

body {
    font-family:
    Corbel,
    "Lucida Grande",
    "Lucida Sans Unicode",
    "Lucida Sans",
    "DejaVu Sans",
    "Bitstream Vera Sans",
    "Liberation Sans",
    Verdana,
    "Verdana Ref",
    sans serif;
}

Trebuchet

body {
    font-family:
    "Segoe UI",
    Candara,
    "Bitstream Vera Sans",
    "DejaVu Sans",
    "Bitstream Vera Sans",
    "Trebuchet MS",
    Verdana,
    "Verdana Ref",
    sans serif;
}

Impact

body {
    font-family:
    Impact,
    Haettenschweiler,
    "Franklin Gothic Bold",
    Charcoal,
    "Helvetica Inserat",
    "Bitstream Vera Sans Bold",
    "Arial Black",
    sans serif;
}

Monospace

body {
    font-family:
    Consolas,
    "Andale Mono WT",
    "Andale Mono",
    "Lucida Console",
    "Lucida Sans Typewriter",
    "DejaVu Sans Mono",
    "Bitstream Vera Sans Mono",
    "Liberation Mono",
    "Nimbus Mono L",
    Monaco,
    "Courier New",
    Courier,
    monospace;
}

21 autres ensembles plus classiques

body {
    font-family: Arial, Helvetica, sans-serif;
}
body {
    font-family: 'Arial Black', Gadget, sans-serif;
}
body {
    font-family: 'Bookman Old Style', serif;
}
body {
    font-family: 'Comic Sans MS', cursive;
}
body {
    font-family: Courier, monospace;
}
body {
    font-family: 'Courier New', Courier, monospace;
}
body {
    font-family: Garamond, serif;
}
body {
    font-family: Georgia, serif;
}
body {
    font-family: Impact, Charcoal, sans-serif;
}
body {
    font-family: 'Lucida Console', Monaco, monospace;
}
body {
    font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
}
body {
    font-family: 'MS Sans Serif', Geneva, sans-serif;
}
body {
    font-family: 'MS Serif', 'New York', sans-serif;
}
body {
    font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
}
body {
    font-family: Symbol, sans-serif;
}
body {
    font-family: Tahoma, Geneva, sans-serif;
}
body {
    font-family: 'Times New Roman', Times, serif;
}
body {
    font-family: 'Trebuchet MS', Helvetica, sans-serif;
}
body {
    font-family: Verdana, Geneva, sans-serif;
}
body {
    font-family: Webdings, sans-serif;
}
body {
    font-family: Wingdings, 'Zapf Dingbats', sans-serif;
}

Lire aussi Revised Font Stack car le choix d’une famille de caractère est un élément fondamental dans le design de votre site web.