Des polices de caractères

Le web est principalement un média textuel, mais textuel ne veux pas dire austères. Un choix éclairé des polices de caractères utilisées sur un site peu avoir une grande influence sur le rendu général et l’originalité de celui-ci.

Indroduction

« Une police de caractères, en typographie, est un ensemble de glyphes, c’est-à-dire de représentations visuelles de caractères d’une même famille, qui regroupe tous les corps et graisses d’une même famille, dont le style est coordonné, afin de former un alphabet, ou la représentation de l’ensemble des caractères d’un langage, complet et cohérent. » Police d’écriture - Wikipédia

La traduction anglaise est Typeface ; le mot font (fonte) très souvent utilisé correspond à un corps (taille), graisse (light, bold, ...) précis de cette famille. C’est-à-dire qu’une police de caractère est composée d’une ou plusieurs fontes.

Technique CSS

Les navigateurs modernes proposent le support des polices personnalisées grâce au @font-face de CSS3. (Référence, le brouillon du W3C : CSS Fonts Module Level 3)

Si les articles sont nombreux sur le sujet, la plupart ne parlent que de @font-face sans aborder les bonnes pratiques comme le choix des familles de polices et la gestion des tailles. Ces pratiques sont d’autant plus importantes qu’elles définissent l’apparence du site sur les navigateurs ne supportant pas CSS3.

Voici trois ressources qui regroupent, je crois, l’essentiel :
 Quelles polices de caractères (fontes) utiliser sur le Web ? - Alsacréations
 CSS - Les polices : quelle famille choisir ? - Éducation, société et technologie
 CSS - Les polices : quelle taille choisir ? - Éducation, société et technologie
Les deux dernières sont anciennes (2004) mais restent pertinentes.

Un autre bon point de départ pour la technique @font-face est Font Squirrel qui propose des kits font + css.

Google propose à sa façon inclure des polices personnalisés (Corrigé le 22/07/2017) : Google Font Directory

Ressources

Des ressources pour l’instant en vrac ...

*Design

 Red Hat Magazine
 Gentium — a typeface for the nations

 50 High-Quality Free Fonts for Professional Design
 The League of Moveable Type

Smashing Magazine propose régulièrement dans sa rubrique Free Fonts de très jolies polices :

 40+ Excellent Freefonts For Professional Design
 New High-Quality Free Fonts (2012 Edition) - Smashing Magazine

*Manuscrite

 Amandine.ttf ( http://www.philing.net/ )
 alamain1.ttf
 CRAYONL.TTF
 Cursive standard.ttf

*Générale

 Lavoisier
 http://dejavu.sourceforge.net/wiki/...
 Εταιρεία Ελληνικών Τυπογραφικών Στοιχείων : : Greek Font Society (Voir Artemisia)
 Crimson Text
 ParaType - Public Types Project
 http://www.framasoft.net/article258...
 http://vollkorn-typeface.com/
 M+ OUTLINE
 PT fonts
 Futura-Renner

http://www.sil.org/computing/catalog/show_software_catalog.asp?by=cat&name=Font

http://en.wikipedia.org/wiki/Category:Open_source_typefaces

http://police.planete-typographie.com/
How To Use @font-face In CSS And 21 Great Typefaces

Adobe fournis deux police en open-source :

 adobe/Source-Code-Pro
 adobe/source-sans-pro

*Open Font Library

 Open Font Library : http://openfontlibrary.fontly.org/
 Unicode Font Guide For Free/Libre Open Source Operating Systems

 Periodic Table of Typefaces on the Behance Network

*Fantaisie

 Lab fonts @ typOasis
 Typographie Les articles sur la typographie de Geoffrey Dorne recensent beaucoup de typo libre.
 Gaut Fonts @ typOasis
 Free fonts : original designs ! (Nombreux liens morts.)

 Lost Type Co-op

 The League of Moveable Type

Reproduction de typographie ancienne :
 The Fell Types modern revival fonts realized by Igino Marini using iKern < The Fell Types

 
A propos de INTRW

Journal web de Benoît LAURENT, entre photos, voyages et logiciels libres selon les périodes.

Fils de nouvelles RSS
Thèmes