Ressources complémentaires sur la typographie

Sur [Typewolf](http://www.typewolf.com) vous pourrez trouver les typos en action sur des sites de qualité : association entre polices de caractère, interactions de la typo et du design, Typewolf est une vraie source d’inspiration.

Pour trouver des polices payantes

- [Typekit](https://typekit.com/) - [Webtype](http://www.webtype.com/) - [Fontdeck](http://fontdeck.com/) - [MyFonts](http://www.myfonts.com/) - [Fontshop](http://www.fontshop.com/) - [Ascender Fonts](http://www.ascenderfonts.com/store/search.aspx?q=Droid+)

Pour trouver des polices gratuites

- [Font Squirrel](http://www.fontsquirrel.com/) - [Googlefonts](http://www.google.com/fonts/) - [Typekit](https://typekit.com/) - [What’s the closest Google Font?](http://joelcrawfordsmith.com/new/font/avenir) permet de trouver une police gratuite proche de celle sur laquelle vous avez travaillé en local...

Pour associer des polices

- [Font Pair](http://fontpair.co/), pour associer des polices Google. Très bien fait. - [Font Pairing](http://www.ourownthing.co.uk/fontpairing/), une interface très pratique pour associer des polices Google. - [Fonts in use](http://fontsinuse.com/), un catalogue de polices de caractères dans leur contexte réel. Bonne interface de recherche et très utile pour trouver les polices qui vont bien ensemble. - [Fontwolf](http://www.typewolf.com/), le site de Jeremiah Shoaf, nombreuses polices en contexte réel, bon outil pour chercher de bonnes associations de polices de caractères. - [Typ.io](http://www.typ.io/) est une collection de sites avec infos sur les polices utilisées. Très intéressant si vous cherchez des associations de polices.

HTML et CSS

- [Métrique des fontes, line-height et vertical-align](https://iamvdo.me/blog/css-avance-metriques-des-fontes-line-height-et-vertical-align), excellent article par Vincent de Oliveira - [Caractères spéciaux et entités HTML](http://alexandre.alapetite.fr/doc-alex/alx_special.html)

Autres outils et références

- [The Elements of Typographic Style applied to the web](http://webtypography.net/toc/), l’ouvrage fondamental de Robert Bringhurst appliqué au web. - [The Elements of Typographic Style](http://www.amazon.fr/exec/obidos/ASIN/0881792128/jalfrezi-21/), par Robert Bringhurst : _si vous ne devez acheter qu’un seul livre sur la typographie, c’est celui-là !_ - [On Web Typography](http://www.abookapart.com/products/on-web-typography) de Jason Santa Maria est une excellente introduction à la typographie sur le web, et à la typographie en général. - [Thinking with Type: A Critical Guide for Designers, Writers, Editors, & Students](http://www.amazon.fr/Thinking-Type-Critical-Designers-Students/dp/1568989695/ref=pd_sim_eb_1/278-0457922-1340634), d’Ellen Lupton, un beau livre, très clair, très complet. - [The Geometry of Type: The Anatomy of 100 Essential Typefaces](http://www.amazon.com/Geometry-Type-Anatomy-Essential-Typefaces/dp/0500241422/ref=sr_1_1), de Stephen Coles analyse la façon dont sont construites 100 polices de caractères parmi les plus connues et c’est passionnant. NB: Aux USA le livre s’appelle “The Anatomy of Type” mais c’est le même ! - [Butterick’s practical typography](http://practicaltypography.com/), par Matthew Butterick, un livre en ligne (et en anglais) sur tous les fondamentaux de la typographie. - [Typedia](http://typedia.com/) l’encyclopédie communautaire des fontes. - [Type-Finder](http://www.type-finder.com/) vous aide à trouver les polices de caractères dont vous avez besoin : un petit questionnaire sur les caractéristiques souhaitées et il vous envoie une sélection de polices correspondantes. - [Glyphr](http://glyphrstudio.com/) est un outil en ligne qui vous permet de créer vos propres typo, très simple d’utilisation, design cool. - [Kerntype](http://type.method.ac/#), un site amusant pour s’entraîner au crénage (kerning), attention c’est addictif ! - [Shape Type](http://shape.method.ac/), un autre site pour apprendre en s’amusant, cette fois il s’agit d’apprendre à utiliser les courbes de Bézier pour former les lettres, vraiment très intéressant. - [Reference](http://practice.typekit.com/reference/), une liste d’articles, de livres, de sites… établie et mise à jour par Typekit, organisée par sujets (en anglais). - [The State of Web Type](http://stateofwebtype.com/beta/), un site toujours à jour sur la compatibilité navigateurs de toutes les fonctionnalités liées à la typographie, depuis les plus simples (font-weight) jusqu’aux plus pointues (kern, smcp, clig…) - [WhatFont](http://chengyinliu.com/whatfont.html) disponible pour Google Chrome et Safari vous permet d’avoir toutes les infos sur les polices de caractères utilisées par le site que vous visitez. Hyper utile dès que vous repérez une belle combinaison de fontes, un superbe titre, des italiques magnifiques, etc. Il suffit de cliquer sur le texte et les infos apparaissent. - [Fluid Type Scale Calculator](https://www.fluid-type-scale.com/) permet de générer une typographie fluide avec CSS clamp. Entrez vos paramètres, l'outil crée le CSS correspondant.

Tous les tags

accessibilite

animation

couleur

css

cssgrid

design

dom

flexbox

html

javascript

json

outils

pseudo-classes

pseudo-elements

sass

svg

typographie

video