la typographie web - clevertoday

CLEVER TODAY

La Typographie Web

CLEVER TODAY

Take the Quiz

CLEVER TODAY

1. Design is communication

CLEVER TODAY

1.L’importance

de la typographie

CleverToday

Le peu que nous lisons est déterminant.

On the average Web page, users have time to read at most 28% of the words

during an average visit.Nielsen Norman Group

CleverToday

La réduction progressive

CleverToday

Nous lisons ce que nous cliquons.

CleverToday

Notre compréhension est facilitée lorsqu’il y a harmonie entre le fond et

la forme.

CleverToday

Your font is your identity,it’s the ship of your message.

CleverToday

CleverToday

2. Choisir sa typo

CLEVER TODAY

2.

A. Rassemblement du matériel existant

B. Définition de votre message/marque

C. Exploration des providers de typographies

D. Création d’un style guide

CleverToday

A

Rassemblement du matériel existant

CleverToday

Exemple

CleverToday

Exemple

Nulla vitae elit libero, a pharetra augue. Fusce dapibus, tellus ac cursus

commodo, tortor mauris condimentum nibh, ut fermentum massa justo

sit amet risus. Curabitur blandit tempus porttitor. Donec id elit non mi

porta gravida at eget metus. Maecenas faucibus mollis interdum.

Vestibulum id ligula porta felis euismod semper.

CleverToday

Si vous avez déjà votre site.

CleverToday

Définition de votre message

B

CleverToday

Exemple

BaskervilleMaecenas sed diam eget risus varius blandit sit amet non magna. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Curabitur blandit tempus porttitor. Etiam porta sem malesuada magna mollis euismod.

CleverToday

Exemple

GothamMaecenas sed diam eget risus varius blandit sit amet non magna. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Curabitur blandit tempus porttitor. Etiam porta sem malesuada magna mollis euismod.

CleverToday

Exemple

BodoniMaecenas sed diam eget risus varius blandit sit amet non magna. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Curabitur blandit tempus porttitor. Etiam porta sem malesuada magna mollis euismod.

CleverToday

Exemple

Cooper BlackMaecenas sed diam eget risus varius blandit

sit amet non magna. Aenean eu leo quam.

Pellentesque ornare sem lacinia quam

venenatis vestibulum. Curabitur blandit

tempus porttitor. Etiam porta sem malesuada

magna mollis euismod.

CleverToday

Exemple

Comic Sans MSMaecenas sed diam eget risus varius blandit sit amet non magna. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Curabitur blandit tempus porttitor. Etiam porta sem malesuada magna mollis euismod.

CleverToday

Il n’y a pas de mauvaise typo,

il n’y a que des mauvais usages.

CleverToday

CleverToday

CleverToday

CleverToday

CleverToday

…

CleverToday

Exploration des providers de typos-

C

CleverToday

Pourquoi un provider de typos?

• Pas de gestion de droit (licence)

• Les fichiers sont sécurisés

• Facile à implémenter

• Souvent accompagné d’outils d’aide et de suivi

• Mais budget à prévoir

CleverToday

GoogleFont

707 familles Gratuit

TypeKit

1 200 familles Payant au forfait

Fonts

150 000 familles Payant

FontDeck

1 700 familles Payant à la vue

MyFonts

23 000 familles Payant à la vue

WebType

150 familles Payant à la vue

Les providers de typos

CleverToday

2. Choisir sa typo

but TypeCast

CleverToday

Concentrez-vous sur l’essentiel, choisissez en noir et blanc.

CleverToday

Explorez les graisses

Portez ce vieux whisky au juge blond qui fume

Portez ce vieux whisky au juge blond qui fume

Portez ce vieux whisky au juge blond qui fume

Portez  ce  vieux  whisky  au  juge  blond  qui  fumePortez ce vieux whisky au juge blond qui fume

Portez ce vieux whisky au juge blond qui fume

Portez ce vieux whisky au juge blond qui fume

CleverToday

Qualité

Personnalité

Lisibilité

Performance

Budget

CleverToday

Personnalité

CleverToday

Les plus utilisés sur GoogleFonts

CleverToday

Fluidité de la lecture

CleverToday

Rapprochements

a o 0 a o 0 a o 0Century Gothic Monaco Merriweather

CleverToday

Chiffres dansants

1234567890 1234567890Raleway Monaco

CleverToday

Les dates

12/03/2016 12/03/2016Charter STM Montréal

CleverToday

Les ligatures

Ça suffit! Ça suffit!Gill Sans Sevarek

Ça suffit!Informa Pro

Ça suffit!Tahoma

CleverToday

La performance

CleverToday

CleverToday

Qualité

CleverToday

Les combinaisons

CleverToday

CleverToday

CleverToday

CleverToday

CleverToday

CleverToday

CleverToday

Langages supportés

CleverToday

Création d’un style guide

D

CleverToday

La sémantique

CleverToday

CleverToday

CleverToday

CleverToday

INUTILE DE CRIER. VOUS AVEZ D’AUTRES MOYENS POUR VOUS

FAIRE ENTENDRE.

CleverToday

Inutile de crier. Vous avez d’autres moyens pour vous faire entendre.

CleverToday

TypeCast Style Guide

CleverToday

Le Futur

CleverToday

CleverToday

CleverToday

CleverToday

OpenType + CSS

CleverToday

CleverToday

Questions?

CleverToday

Merci :)