Typography on the Web - FITC Amsterdam 2015
3 likes2,281 views
This document discusses typography on the web. It provides an overview of the evolution of typography and web fonts from 1996 to the present. Key topics covered include the transition from basic web-safe fonts to services like Typekit that allow designers to use premium fonts on websites. The document also discusses considerations for choosing typefaces, the process of designing fonts, and resources for learning about typography.
Typography on the Web - FITC Amsterdam 2015
- 4. typography establish a tone add meaning roleofadesigner
- 5. hello »«
- 6. HELLO
- 7. lol ;)
- 11. We have just entered the era of non-boring typography TYPOGRAPHYONTHEWEB 1996 Andale Mono Times New Roman Georgia Verdana Arial Courier New Trebuchet MS Comic Sans Impact 200990K+ typefaces on the web Focus on structure: H1,H2… &
- 12. Web Design is 95% typography TYPOGRAPHYONTHEWEB 1996 2014
- 15. kerning, leading, uppercase… DESIGNCHOICES “Choosing typefaces relies on weighing the context of what you’re designing against your technical requirements, typographic knowledge, and gut instinct. Just as the best coffee machine won’t necessarily make you the best cup of coffee, good typography depends on the ingredients you choose, the particular combination of those ingredients, and the ways you combine them. Your typeface choices must fit the circumstances you need them for and so must your design.” Excerpt From: Jason Santa Maria. “On Web Typography.” “Choosing typefaces relies on weighing the context of what you’re designing against your technical requirements, typographic knowledge, and gut instinct. Just as the best coffee machine won’t necessarily make you the best cup of coffee, good typography depends on the ingredients you choose, the particular combination of those ingredients, and the ways you combine them.” “ C h o o s i n g typefaces relies on w e i g h i n g t h e context of what you’re designing a g a i n s t y o u r t e c h n i c a l r e q u i r e m e n t s , t y p o g r a p h i c knowledge, and gut instinct. Just as the b e s t c o f f e e machine won’t necessarily make you the best cup of coffee, good t y p o g r a p h y depends on the ingredients you c h o o s e , t h e p a r t i c u l a r combination of those ingredients, and the ways you combine them. Yo u r t y p e f a c e choices must fit the circumstances you need them for and so must your design.”
- 16. “Choosing typefaces relies on weighing the context of what you’re designing against your technical requirements, typographic knowledge, and gut instinct. Just as the best coffee machine won’t necessarily make you the best cup of coffee, good typography depends on the ingredients you choose, the particular combination of those ingredients, and the ways you combine them.Your typeface choices must fit the circumstances you need them for and so must your design.” FONT SIZE x 30 34px * 30 = 1020 pixels TRICK DESIGNCHOICES READ IT LOUD TRICK
- 17. picking the right typeface “Choosing typefaces relies on weighing the context of what you’re designing against your technical requirements, typographic knowledge, and gut instinct. Just as the best coffee machine won’t necessarily make you the best cup of coffee, good typography depends on the ingredients you choose, the particular combination of those ingredients, and the ways you combine them.Your typeface choices must fit the circumstances you need them for and so must your design.” “Choosing typefaces relies on weighing the context of what you’re designing against your technical requirements, typographic knowledge, and gut instinct. Just as the best coffee machine won’t necessarily make you the best cup of coffee, good typography depends on the ingredients you choose, the particular combination of those ingredients, and the ways you combine them. Your typeface choices must fit the circumstances you need them for and so must your design.” DESIGNCHOICES
- 19. DESIGNINGCHARACTERS “a A is a A”
- 22. FITC Amsterdam
- 23. FITC Amsterdam
- 24. FITC Amsterdam
- 25. FITC Amsterdam
- 26. FITC Amsterdam
- 27. FITCAmsterdam
- 28. FITC Amsterdam
- 29. FITCAmsterdam
- 30. FITC Amsterdam
- 31. DESIGNTRENDS
- 32. That’s why a typeface costs several hundreds of dollars CREATIVEPROCESS I DESIGNING A FONT IS A LOT OF WORK technology culture feeling emotion message
- 33. about 320$ per designer PREMIUMTYPEFACE II FOUNDRY - PARATYPE Futura
- 35. about 320$ per designer PREMIUMTYPEFACE II FOUNDRY - PARATYPE Futura
- 36. Be aware PREMIUMTYPEFACE vs FREETYPEFACE I BETTER QUALITY II MULTIPLE FONT STYLES III WON’T BE SEEN EVERYWHERE IV NO WORRIES OF LAWSUITS V LANGUAGES I DOES NOT INCLUDE ALL CHARACTERS II LACK OF CONSISTENCY III MAY REQUIRE ADDITIONAL LICENSE IV MAY BE A STOLEN DESIGN V LACK OF FONT STYLE OPTIONS
- 37. Typekit
- 38. Best friend of typographers and designers in general. TYPEKIT I 1000+ TYPEFACES II SUBSCRIPTION MODEL SINCE 2009 III CREATIVE CLOUD MEMBERSHIP INCLUDES A TYPEKIT PORTFOLIO PLAN IV FULL CATALOG FOR YOUR WEBSITES V 15 BILLION PAGE VIEWS/MONTH
- 45. You can create a 100% web safe visual workflow The classic customer quote: “The page of my website looked better in Photoshop” 99% of the time, this is because fonts look better in Photoshop. Design with the browser in mind. PHOTOSHOP&WEBFONTS
- 48. Use professional fonts in your publications TYPEKITDESKTOPFONTS PremiumfontsinPDF,ePUB,Word, Powerpoint…
- 49. TypekitLinKs
- 50. Typography is practice RESOURCES MY BLOG www.CreativeDroplets.com TYPEKIT LESSONS http://practice.typekit.com/ INSPIRATION http://fontsinuse.com/