Interruptions, Introductions & Seductions (Kerning 2016)

Transcript

1. ,Introductions, Interruptions & Seductions
   Richard Rutter, Clearleft
   Kerning 2016ɾFaenza, Italia

2. book.webtypography.net

3. None
4. None

5. Photo: Marc Thiele

6. It is only logical to say that a web designer

   should get good training in typography.”
   Oliver Reichenstein, Web Design is 95% Typography https://ia.net/know-how/the-web-is-all-about-typography-period “

7. Photo: Indra Kupferschmid

8. None
9. None
10. None

11. INTERR
    UPTION
    Immersion

12. None
13. None

14. Good quality typography is responsible for greater engagement during reading.”
    

    Dr. Kevin Larson (Microsoft) and Dr. Rosalind W. Picard (MIT) “

15. Good typography induces a good mood.”
    Dr. Kevin Larson (Microsoft)

    and Dr. Rosalind W. Picard (MIT) “

16. Good typography
    puts you in a
    good mood!

17. Body text sampler

18. Even if people are not consciously aware of the type

    they’re reading, they’ll certainly be affected by it.”
    Tobias Frere-Jones, Helvetica (dir. Gary Huswitt, 2007). “

19. bentonmodern.webtype.com

20. You can influence the way people feel.

21. I hate obtuse theoretical mathematics

22. This is a story about someone who lived in Happyland.

    His name was Mr Happy and he was fat and round, and happy. One day Mr Happy went for a walk in the woods.
23. None

24. TEDxBedford

25. helsenorge.no

26. mkshft.org

27. www.cleopatra-marina.gr

28. None
29. None
30. None
31. None
32. None
33. None
34. None
35. None

36. Beatrice Ward

37. People who love ideas must have a love of words.

    They will take a vivid interest in the clothes that words wear.”
    Beatrice Warde, The Crystal Goblet “
38. None

39. Photo: Adam Twardoch

40. Proxima Nova Proxima Nova Proxima Nova

41. googlesciencefair.com

42. None
43. None
44. None

45. Strangelove

46. None
47. None

48. bentonmodern.webtype.com

49. None

50. wellcomecollection.org/mindcraft

51. None

52. tuxedono2.com

53. <h1 class="swsh"> .swsh { font-variant-alternates: swash(1);
    }

54. <h1 class="swsh"> .swsh { font-variant-alternates: swash(1); @supports not (font-variant-alternates: swash(1))

    { body { font-feature-settings: "swsh" 1; } }
    }
55. None
56. None

57. <h1 class="dlig"> .dlig { font-variant-ligatures: discretionary-ligatures; font-feature-settings:"dlig" 1;
    }

58. None

59. <h1 class="ss01"> .dlig { font-variant-alternates: styleset(1); font-feature-settings:"ss01" 1;
    }

60. clagnut.com/sandbox/css3

61. clagnut.com/sandbox/css3

62. None
63. None

64. thegreatdiscontent.com

65. None
66. None
67. None
68. None
69. None
70. None

71. sizecalc.com

72. sizecalc.com

73. None
74. None

75. 32 24 19 16 13 iOS scale 68 42 26

    16 10 Golden ratio scale 36 24 18 16 14 Classical (diatonic) scale
76. None
77. None
78. None
79. None

80. h1 { font-size: 13vh; }

81. None
82. None
83. None
84. None
85. None
86. None
87. None

88. typecast.com

89. book.webtypography.net

90. None

91. Photo: Indra Kupferschmid

92. None

93. Which website will you be designing today?

94. “Have today’s designers “stopped dreaming?” Elliot Jay Stocks “Is web

    design losing “its soul?” Noah Stokes

95. Don’t be reverential, dogmatic, or ordinary. Interrupt, introduce & seduce.

96. Richard Rutter, Clearleft
    @clagnut
    Slides: webtypography.net/talks/kerning16