Webbtypografi

ROBIN LANTZ JOHAN EKHAGER

Swiss style

90-talswebb

Fonter 1496-1996

Webbfonter 1996-2002

WebbutvecklingenApple:s designtrendTjänsterUpplösning

Förutsättningar

6 19 16 4.0

7 20 17 5.0

8 21 18 5.1

9 22 19 6.0

10 23

web fonts

Upplösning

Grafiska manualerWebbranchenWebbläsare & OSOverload

Motverkande faktorer

Grafiska manualer

Sökresultat:Gotham

Ingenting :(

Browsers renderar olika

Sökresultat:Alla typsnitt

5414 typsnitt funna :O

Tips och tricks

Regular eller BoldCondensedÄkta italics

Vikter

Ingen kerning

autokerning

manuell kerning

F l y g a n d e b ä c k a s i n e r s ö k a h w i l a p å m j u k a t u v o r

Flygande bäckasiner söka hwila på mjuka tuvor

Flygande bäckasiner söka hwila på mjuka tuvor

Tracking

line-heightline-height: 1;

line-height: 1.5;

line-height: 2;

Vivamus semper convallis massa, ut lacinia ipsum malesuada non. Aenean condimentum tellus vitae purus euismod ultrices. Fusce imperdiet arcu ut augue bibendum ut condimentum metus porta.

Vivamus semper convallis massa, ut lacinia ipsum malesuada non.

Aenean condimentum tellus vitae purus euismod ultrices. Fusce

imperdiet arcu ut augue bibendum ut condimentum metus porta.

Vivamus semper convallis massa, ut lacinia ipsum malesuada non.

Aenean condimentum tellus vitae purus euismod ultrices. Fusce

imperdiet arcu ut augue bibendum ut condimentum metus porta.

Finns alla glypher?

° “ # € % &

/ ( ) = ü œ

11pt på print

16px på skärm≈

Responsiv typografi

Denna text är skön eftersom den är mellan 45* och 75 tecken på varje rad. *Skriv gärna ut denna när ni testar på sajten.

45-75 tecken/rad

Alla fonter finns onlineBättre licensmodellerUtgångspunkt digitaltUpplösning

Framtiden

Fastna inte i gamla banor Ta hjälp av tjänsterDet finns inga genvägar...Tänk responsive

Sammanfattning

Tack! \o/