SlideShare a Scribd company logo

Typography on the Web

Sara Cannon, profile picture
Sara Cannon

The document is a presentation by Sara Cannon at WordCamp Reno 2011 that discusses typography on the web, emphasizing its importance in web design. It includes various web fonts, CSS techniques, tips for optimizing legibility, and the use of web font services. The document also highlights resources and tools for web typography and stresses the significance of a well-crafted typographic style guide.

TechnologyDesign
1 of 152
Downloaded 599 times
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
TYPOGRAPHY ON THE WEB WORDCAMP RENO 2011 sara cannon / sara-cannon.com / follow @saracannon Saturday, June 4, 2011
ABOUT ME SARA CANNON Birmingham, AL @saracannon slideshare.net/saracannon sara-cannon.com I love WordPress! WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB FONTS USED IN THIS PRESENTATION: Chaparral Pro by Adobe http://typekit.com/fonts/chaparral-pro LEAGUE GOTHIC by e League of Movable Type http://typekit.com/fonts/league-gothic WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Web Design is 95% Typography WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Helvetica Neue Arial Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB e Beautiful Web WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Liquor Store FF Meta Serif Saturday, June 4, 2011
TYPOGRAPHY AND YOUR THEME http://www. jaxvineyards.com FF Din FF Tisa Saturday, June 4, 2011
TYPOGRAPHY AND YOUR THEME http://www.designmadeingermany.de/ FF Din Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB League Gothic Le Monde Courrier Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Craft your CSS WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB LINE-HEIGHT WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY AND YOUR THEME Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB LINKS: BORER-BOTTOM OR COLOR WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY AND YOUR THEME Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB LETTER-SPACING WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB FONT-STACK WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB OPTIMIZE LEGIBILITY WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB OPTIMIZE LEGIBILITY WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Web-Fonts WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB I Want To Go Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Font-Stacks Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB @font-face WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB @FONT-FACE WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Why shouldn’t I try to use my print fonts that I paid so much for? WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB FONT-HINTING FOR THE SCREEN WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Load Time WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Check your licensing WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Hand Code Font Face Kit Generator Typekit Or Other Paid Hosts Google Api WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB @FONT-FACE http://paulirish.com/2009/bulletproof-font-face- implementation-syntax/ WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB from: fontsquirrel.com WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Fontsquirrel.com @font-face Generator WOFF - e Emerging Standard Format. EOT (light) - Targets Internet Explorer. SVG - Targets Webkit Mobile Platforms (iPhone And IPad) WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB http://sprungmarker.de/wp-content/uploads/webfont-services/ Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB typekit.com WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Typekit Has 81 Participating Foundries WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Typekit Even Has Futura! WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Test and Tweak WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Check All Browsers Always. WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB TYPE CRUNCH!!! Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB DISABLE TYPEKIT JUST FOR IE6 - load IE6 Fonts in Style Sheet within Conditional Comments in the Header WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB DISABLE FOR ALL OF WINDOWS: User Agent WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB JUST FIREFOX CSS Hack WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB FIREFOX ON ALL OF WINDOWS User Agent WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB FIREFOX ON WINDOWS XP User Agent + CSS Hack WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB COMBATING FOUT Flash Of Unstyled Text WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY AND YOUR THEME COMBATING FOUT blog.typekit.com/2010/05/19/typekit-and-google/ WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY AND YOUR THEME COMBATING FOUT code.google.com/apis/webfonts/ docs/webfont_loader.html WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY AND YOUR THEME Typekit Default Embed: Webfont Loader Embed: WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY AND YOUR THEME WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY AND YOUR THEME github.com/typekit/webfontloader WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY AND YOUR THEME WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Take it Even Further WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB STYLING CONDENSED FONTS: Fallback with Fallback Without Webfont Loader Normal Webfont Loaser WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB USE THOSE STYLE SHEETS! WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Even More Custom Type Implementation WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB CSS3 WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB TEXT-SHADOW WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB http://mothereffingtextshadow.com/ Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB http://mothereffingtextshadow.com/ Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB ROTATE http://www.cssplayer.com/blog/date-display-technique- with-text-rotation/ WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB ROTATE WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB WordPress Plugins WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB PLUGIN: WP TYPOGRAPHY http://wordpress.org/extend/plugins/wp-typography/ WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB PLUGIN: DROP CAPS http://wordpress.org/extend/plugins/drop-caps/ • override their css with your own • works across browsers with not too much tweaking WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Neat Type Scripts WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB SCRIPT: LETTERING.JS http://letteringjs.com/ • Takes each letter in a headline and wraps it in a Span • Allows for individual letter manipulation • Not recommended for large chunks WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB SCRIPT: KERN.JS http://www.kernjs.com/ • Allows in-browser kerning of lettering • Generates code for kerned copy • Works with Lettering.js WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB SCRIPT: FIT TEXT http:// ttextjs.com/ • Stretches headline to t container • Useful for uid/responsive layouts WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Other Must Havesies WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB EXTENSION: WHATFONT http://chengyinliu.com/whatfont.html • Find out what fonts and their CSS others are using • Sharpen your ninja font-detection skillz! (yes that is a ninja skill) WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB EXTENSION: GOOGLE FONT PREVIEWER https://github.com/pamelafox/font-previewer- extension • Test run a font on your site without coding • using web-fonts only from Google’s web-font API WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB BOOKMARKLET: MIN http://min.artequalswork.com/ • Shows your site if it was just type • Gets rid of all images and leaves just the type layout • Analyze Typographic Hierarchy WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB e Future? WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB THE FUTURE? • Richard Ritter of Fontdeck.com @clanut •Open Type • Ligatures • Multiple Alphabet Sets • Multiple Numeric Sets • All through CSS Classes! WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB What Not To Do WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Style Your Website With Paparyus (Sorry Every Mediterranean Restaurant Website Ever) WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Use Non-Web-Licensed Fonts: Archer or GOTHAM (Sorry H&FJ Luvahz) WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Never EVER Use The Infamous Comic Sans (It doesn’t matter that you think it’s good for wire-framing) WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB It’s STILL Not Cool EVEN If You Think It Is IRONIC (Sorry Jorbin) WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB e Infamous Eye Bleed WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB EYE BLEED!!! AHHH THE BURNING! FREE SET OF STEAK KNIVES!!! Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB e Even More Infamous EYE BLEED WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB EYE BLEED!!! AHHH THE BURNING! FREE SET OF STEAK KNIVES!!! Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB What To Do WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Find An Appropriate Substitution For: GOTHAM By Using PROXIMA NOVA WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Check All Browsers Always. WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Create A Typographic Style Guide For Your eme WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB http://twentytendemo.wordpress.com/ Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB http://twentyelevendemo.wordpress.com/ Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Follow e Industry WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB blog.typekit.com Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB ilovetypography.com Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB typographica.org Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB webtypography.net Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Follow e Tweets WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB FOLLOW THE TWEETS @JasonSantaMaria @fontsquirrel @veen @typekit @brucel @h_ @ilovetypography @clagnut @jessicahische @fchimero WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Find Inspiration WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB siteinspire.net Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB typographyserved.com Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB ministryoftype.co.uk Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB dribbble.com Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB wordpress.org/showcase Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Find Cool Fonts WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB P22 UNDERGROUND by: P22 http://typekit.com/fonts/p22-underground Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Adelle by: Type Together http://typekit.com/fonts/adelle-web Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB http://typekit.com/fonts/ff-tisa-web-pro Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB “life is short, art is long” Typography is Everything. WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB ank You! sara cannon / sara-cannon.com / follow @saracannon Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Type Foundries WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB H&FJ WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Archer Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB GOTHAM Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Veer WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Adobe WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB e League Of Moveable Type WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Open Source! O (open Font License) theleagueofmoveabletype.com/manifesto WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Exljbris WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Lost Type Pay What You Want by Riely Cran & Tyler Galpin WORDCAMP RENO Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
TYPOGRAPHY ON THE WEB Saturday, June 4, 2011

More Related Content

PDF
5 Reasons Typography is Powerful
Big Fish Presentations
 
PDF
CakeStudio_Styleguide
Maria Merchant
 
PPT
Typography Intro
NCeLearning
 
PDF
Dominating the Web Typography
Eduardo Shiota Yasuda
 
PDF
Beautiful Web Typography: 7 tips on de-sucking the web
Pascal Klein
 
PPTX
Pelican Mapping - FOSS4G 2011
Glenn Waldron
 
PDF
UP200 dental 3d scanner with dental CAD
Dragon Cai
 
PPT
Shtanchaev_SPEKTR
shtanchaev
 
5 Reasons Typography is Powerful
Big Fish Presentations
 
CakeStudio_Styleguide
Maria Merchant
 
Typography Intro
NCeLearning
 
Dominating the Web Typography
Eduardo Shiota Yasuda
 
Beautiful Web Typography: 7 tips on de-sucking the web
Pascal Klein
 
Pelican Mapping - FOSS4G 2011
Glenn Waldron
 
UP200 dental 3d scanner with dental CAD
Dragon Cai
 
Shtanchaev_SPEKTR
shtanchaev
 

Viewers also liked (19)

PPTX
Special Photo Effects
Marco Belzoni
 
PPT
Human Action Recognition Based on Spacio-temporal features
nikhilus85
 
PDF
GLSL Shading with OpenSceneGraph
Mike Weiblen
 
PPT
Radiosity algorithm
Hung Sun
 
KEY
Interactive Graphic Storytelling: “How the Internet Impacts the Graphic Novel”
Shane Tilton
 
PPTX
Steel monkeys: Unity3D глазами программиста графики
DevGAMM Conference
 
PDF
Better Typography
markboultondesign
 
PDF
Woden 2: Developing a modern 3D graphics engine in Smalltalk
ESUG
 
PPTX
Shells
Mohit Sheode
 
PDF
Web Typography, A Long Dark
Ryan LaBouve
 
PPTX
Quadtree In Game
Dương Nyl
 
PDF
Typography Fundamentals
Steve Hickey
 
PPTX
What is 3 d modeling unit 66
Richard Marshall
 
PPTX
Orthographic projection
laura_gerold
 
ODP
Building a DIY 3D Scanner
MatthewShotton
 
PPTX
Chapter 11 biotechnology by mohanbio
mohan bio
 
PPTX
3D internet
Anurag Singh
 
PPTX
3D scanner using kinect
Mehdi Saman Booy
 
PDF
3D Laser Scanning
Ron Reed, MBA, PMP
 
Special Photo Effects
Marco Belzoni
 
Human Action Recognition Based on Spacio-temporal features
nikhilus85
 
GLSL Shading with OpenSceneGraph
Mike Weiblen
 
Radiosity algorithm
Hung Sun
 
Interactive Graphic Storytelling: “How the Internet Impacts the Graphic Novel”
Shane Tilton
 
Steel monkeys: Unity3D глазами программиста графики
DevGAMM Conference
 
Better Typography
markboultondesign
 
Woden 2: Developing a modern 3D graphics engine in Smalltalk
ESUG
 
Shells
Mohit Sheode
 
Web Typography, A Long Dark
Ryan LaBouve
 
Quadtree In Game
Dương Nyl
 
Typography Fundamentals
Steve Hickey
 
What is 3 d modeling unit 66
Richard Marshall
 
Orthographic projection
laura_gerold
 
Building a DIY 3D Scanner
MatthewShotton
 
Chapter 11 biotechnology by mohanbio
mohan bio
 
3D internet
Anurag Singh
 
3D scanner using kinect
Mehdi Saman Booy
 
3D Laser Scanning
Ron Reed, MBA, PMP
 
Ad

Similar to Typography on the Web (13)

PDF
Web Typography & Drupal: Putting Arial Out to Pasture
Jason Pamental
 
PDF
The State of Web Typography
Derek Bender
 
PDF
Beautiful Web Typography (#4)
Pascal Klein
 
PDF
Webtech ’09 – Die Zukunft des Webs beginnt jetzt
Eric Eggert
 
PDF
Sca typography matters_02
Blair Jarvis
 
PDF
You only like me for my body
Chiara Aliotta
 
PDF
Web typography
Idan Gazit
 
PDF
Beautiful Web Typography (#5)
Pascal Klein
 
PDF
Web Typography5 090725053013 Phpapp02
F Blanco
 
PDF
Web Typography with CSS3
Matthew Smith
 
PDF
Designing With Type :: FontConf 2010
Kyle Meyer
 
PPTX
Task 5 and 6
Emily Hooper
 
PDF
Type in your WordPress Themes by Sara Cannon WordCamp NYC
Sara Cannon
 
Web Typography & Drupal: Putting Arial Out to Pasture
Jason Pamental
 
The State of Web Typography
Derek Bender
 
Beautiful Web Typography (#4)
Pascal Klein
 
Webtech ’09 – Die Zukunft des Webs beginnt jetzt
Eric Eggert
 
Sca typography matters_02
Blair Jarvis
 
You only like me for my body
Chiara Aliotta
 
Web typography
Idan Gazit
 
Beautiful Web Typography (#5)
Pascal Klein
 
Web Typography5 090725053013 Phpapp02
F Blanco
 
Web Typography with CSS3
Matthew Smith
 
Designing With Type :: FontConf 2010
Kyle Meyer
 
Task 5 and 6
Emily Hooper
 
Type in your WordPress Themes by Sara Cannon WordCamp NYC
Sara Cannon
 
Ad

More from Sara Cannon (20)

PDF
Open Source Creativity
Sara Cannon
 
PDF
Design Strategy: How information Can Drive Your Designs Decisions To Success
Sara Cannon
 
PPTX
Sara cannon pushing the creative limit
Sara Cannon
 
PDF
Learning Through Stealing - How to Become Better At Your Craft
Sara Cannon
 
PDF
WordPress & User Experience - WordCamp London
Sara Cannon
 
PDF
WordPress & User Experience - WordCamp St. Louis
Sara Cannon
 
PDF
Typography and User Experience - WCSF
Sara Cannon
 
PDF
Typography and User Experience in Web Design
Sara Cannon
 
PDF
Smart Design - Content-first, Fast, Informed, Refined. WordCamp NYC 2014
Sara Cannon
 
PDF
Smart Design
Sara Cannon
 
PDF
SMART DESIGN - icon fonts, svg, and the mobile influence
Sara Cannon
 
PDF
IconFonts
Sara Cannon
 
PDF
The Future of UI - How Mobile Design is Shaping The Web 2
Sara Cannon
 
PDF
Designer vs Developer: BE THE UNICORN
Sara Cannon
 
PDF
Designer vs Developer: Creators in WordPress
Sara Cannon
 
PDF
Designing for The Modern Web
Sara Cannon
 
PDF
Responsive Design
Sara Cannon
 
PDF
Font Swoon - Advanced Web Typography
Sara Cannon
 
PDF
Design Swoon - Visual Trends & WordPress
Sara Cannon
 
PDF
UI Design for Themes and Plugins by Chelsea Otakan & Sara Cannon
Sara Cannon
 
Open Source Creativity
Sara Cannon
 
Design Strategy: How information Can Drive Your Designs Decisions To Success
Sara Cannon
 
Sara cannon pushing the creative limit
Sara Cannon
 
Learning Through Stealing - How to Become Better At Your Craft
Sara Cannon
 
WordPress & User Experience - WordCamp London
Sara Cannon
 
WordPress & User Experience - WordCamp St. Louis
Sara Cannon
 
Typography and User Experience - WCSF
Sara Cannon
 
Typography and User Experience in Web Design
Sara Cannon
 
Smart Design - Content-first, Fast, Informed, Refined. WordCamp NYC 2014
Sara Cannon
 
Smart Design
Sara Cannon
 
SMART DESIGN - icon fonts, svg, and the mobile influence
Sara Cannon
 
IconFonts
Sara Cannon
 
The Future of UI - How Mobile Design is Shaping The Web 2
Sara Cannon
 
Designer vs Developer: BE THE UNICORN
Sara Cannon
 
Designer vs Developer: Creators in WordPress
Sara Cannon
 
Designing for The Modern Web
Sara Cannon
 
Responsive Design
Sara Cannon
 
Font Swoon - Advanced Web Typography
Sara Cannon
 
Design Swoon - Visual Trends & WordPress
Sara Cannon
 
UI Design for Themes and Plugins by Chelsea Otakan & Sara Cannon
Sara Cannon
 

Recently uploaded (20)

PDF
cuic standard and advanced reporting.pdf
SimoneTitaniumTomase
 
PPTX
Understanding_Digital_Forensics_Presentation.pptx
ImranKhan423233
 
PDF
Unlocking AI with Model Context Protocol (MCP)
Brian McKeiver
 
PPTX
20250228 LYD VKU AI Blended-Learning.pptx
DatVoNgoc
 
PDF
Modernizing your data center with Dell and AMD
Principled Technologies
 
PDF
KodekX | Application Modernization Development
KodekX
 
PDF
Advanced methodologies resolving dimensionality complications for autism neur...
IAESIJAI
 
PDF
Review of recent advances in non-invasive hemoglobin estimation
IAESIJAI
 
PDF
Approach and Philosophy of On baking technology
30anthuong17
 
PDF
Spectral efficient network and resource selection model in 5G networks
IAESIJAI
 
PPTX
A Presentation on Artificial Intelligence
memembruh336
 
PDF
Per capita expenditure prediction using model stacking based on satellite ima...
IAESIJAI
 
PDF
Peak of Data & AI Encore- AI for Metadata and Smarter Workflows
Safe Software
 
PDF
How UI/UX Design Impacts User Retention in Mobile Apps.pdf
SynapseIndia
 
PDF
Encapsulation theory and applications.pdf
gurumoop
 
PDF
Mobile App Security Testing_ A Comprehensive Guide.pdf
flufftailshop
 
PDF
7 ChatGPT Prompts to Help You Define Your Ideal Customer Profile.pdf
SOFTTECHHUB
 
PDF
The Rise and Fall of 3GPP – Time for a Sabbatical?
3G4G
 
PDF
Reach Out and Touch Someone: Haptics and Empathic Computing
Mark Billinghurst
 
PPTX
Digital-Transformation-Roadmap-for-Companies.pptx
David Malick Dieng
 
cuic standard and advanced reporting.pdf
SimoneTitaniumTomase
 
Understanding_Digital_Forensics_Presentation.pptx
ImranKhan423233
 
Unlocking AI with Model Context Protocol (MCP)
Brian McKeiver
 
20250228 LYD VKU AI Blended-Learning.pptx
DatVoNgoc
 
Modernizing your data center with Dell and AMD
Principled Technologies
 
KodekX | Application Modernization Development
KodekX
 
Advanced methodologies resolving dimensionality complications for autism neur...
IAESIJAI
 
Review of recent advances in non-invasive hemoglobin estimation
IAESIJAI
 
Approach and Philosophy of On baking technology
30anthuong17
 
Spectral efficient network and resource selection model in 5G networks
IAESIJAI
 
A Presentation on Artificial Intelligence
memembruh336
 
Per capita expenditure prediction using model stacking based on satellite ima...
IAESIJAI
 
Peak of Data & AI Encore- AI for Metadata and Smarter Workflows
Safe Software
 
How UI/UX Design Impacts User Retention in Mobile Apps.pdf
SynapseIndia
 
Encapsulation theory and applications.pdf
gurumoop
 
Mobile App Security Testing_ A Comprehensive Guide.pdf
flufftailshop
 
7 ChatGPT Prompts to Help You Define Your Ideal Customer Profile.pdf
SOFTTECHHUB
 
The Rise and Fall of 3GPP – Time for a Sabbatical?
3G4G
 
Reach Out and Touch Someone: Haptics and Empathic Computing
Mark Billinghurst
 
Digital-Transformation-Roadmap-for-Companies.pptx
David Malick Dieng
 

Typography on the Web

  • 1. TYPOGRAPHY ON THE WEB WORDCAMP RENO 2011 sara cannon / sara-cannon.com / follow @saracannon Saturday, June 4, 2011
  • 2. ABOUT ME SARA CANNON Birmingham, AL @saracannon slideshare.net/saracannon sara-cannon.com I love WordPress! WORDCAMP RENO Saturday, June 4, 2011
  • 3. TYPOGRAPHY ON THE WEB FONTS USED IN THIS PRESENTATION: Chaparral Pro by Adobe http://typekit.com/fonts/chaparral-pro LEAGUE GOTHIC by e League of Movable Type http://typekit.com/fonts/league-gothic WORDCAMP RENO Saturday, June 4, 2011
  • 4. TYPOGRAPHY ON THE WEB Web Design is 95% Typography WORDCAMP RENO Saturday, June 4, 2011
  • 5. TYPOGRAPHY ON THE WEB Helvetica Neue Arial Saturday, June 4, 2011
  • 6. TYPOGRAPHY ON THE WEB e Beautiful Web WORDCAMP RENO Saturday, June 4, 2011
  • 7. TYPOGRAPHY ON THE WEB Liquor Store FF Meta Serif Saturday, June 4, 2011
  • 8. TYPOGRAPHY AND YOUR THEME http://www. jaxvineyards.com FF Din FF Tisa Saturday, June 4, 2011
  • 9. TYPOGRAPHY AND YOUR THEME http://www.designmadeingermany.de/ FF Din Saturday, June 4, 2011
  • 10. TYPOGRAPHY ON THE WEB League Gothic Le Monde Courrier Saturday, June 4, 2011
  • 11. TYPOGRAPHY ON THE WEB Craft your CSS WORDCAMP RENO Saturday, June 4, 2011
  • 12. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 13. TYPOGRAPHY ON THE WEB LINE-HEIGHT WORDCAMP RENO Saturday, June 4, 2011
  • 14. TYPOGRAPHY AND YOUR THEME Saturday, June 4, 2011
  • 15. TYPOGRAPHY ON THE WEB LINKS: BORER-BOTTOM OR COLOR WORDCAMP RENO Saturday, June 4, 2011
  • 16. TYPOGRAPHY AND YOUR THEME Saturday, June 4, 2011
  • 17. TYPOGRAPHY ON THE WEB LETTER-SPACING WORDCAMP RENO Saturday, June 4, 2011
  • 18. TYPOGRAPHY ON THE WEB FONT-STACK WORDCAMP RENO Saturday, June 4, 2011
  • 19. TYPOGRAPHY ON THE WEB OPTIMIZE LEGIBILITY WORDCAMP RENO Saturday, June 4, 2011
  • 20. TYPOGRAPHY ON THE WEB OPTIMIZE LEGIBILITY WORDCAMP RENO Saturday, June 4, 2011
  • 21. TYPOGRAPHY ON THE WEB Web-Fonts WORDCAMP RENO Saturday, June 4, 2011
  • 22. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 23. TYPOGRAPHY ON THE WEB I Want To Go Saturday, June 4, 2011
  • 24. TYPOGRAPHY ON THE WEB Font-Stacks Saturday, June 4, 2011
  • 25. TYPOGRAPHY ON THE WEB @font-face WORDCAMP RENO Saturday, June 4, 2011
  • 26. TYPOGRAPHY ON THE WEB @FONT-FACE WORDCAMP RENO Saturday, June 4, 2011
  • 27. TYPOGRAPHY ON THE WEB Why shouldn’t I try to use my print fonts that I paid so much for? WORDCAMP RENO Saturday, June 4, 2011
  • 28. TYPOGRAPHY ON THE WEB FONT-HINTING FOR THE SCREEN WORDCAMP RENO Saturday, June 4, 2011
  • 29. TYPOGRAPHY ON THE WEB Load Time WORDCAMP RENO Saturday, June 4, 2011
  • 30. TYPOGRAPHY ON THE WEB Check your licensing WORDCAMP RENO Saturday, June 4, 2011
  • 31. TYPOGRAPHY ON THE WEB Hand Code Font Face Kit Generator Typekit Or Other Paid Hosts Google Api WORDCAMP RENO Saturday, June 4, 2011
  • 32. TYPOGRAPHY ON THE WEB @FONT-FACE http://paulirish.com/2009/bulletproof-font-face- implementation-syntax/ WORDCAMP RENO Saturday, June 4, 2011
  • 33. TYPOGRAPHY ON THE WEB from: fontsquirrel.com WORDCAMP RENO Saturday, June 4, 2011
  • 34. TYPOGRAPHY ON THE WEB Fontsquirrel.com @font-face Generator WOFF - e Emerging Standard Format. EOT (light) - Targets Internet Explorer. SVG - Targets Webkit Mobile Platforms (iPhone And IPad) WORDCAMP RENO Saturday, June 4, 2011
  • 35. TYPOGRAPHY ON THE WEB http://sprungmarker.de/wp-content/uploads/webfont-services/ Saturday, June 4, 2011
  • 36. TYPOGRAPHY ON THE WEB typekit.com WORDCAMP RENO Saturday, June 4, 2011
  • 37. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 38. TYPOGRAPHY ON THE WEB Typekit Has 81 Participating Foundries WORDCAMP RENO Saturday, June 4, 2011
  • 39. TYPOGRAPHY ON THE WEB Typekit Even Has Futura! WORDCAMP RENO Saturday, June 4, 2011
  • 40. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 41. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 42. TYPOGRAPHY ON THE WEB Test and Tweak WORDCAMP RENO Saturday, June 4, 2011
  • 43. TYPOGRAPHY ON THE WEB Check All Browsers Always. WORDCAMP RENO Saturday, June 4, 2011
  • 44. TYPOGRAPHY ON THE WEB TYPE CRUNCH!!! Saturday, June 4, 2011
  • 45. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 46. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 47. TYPOGRAPHY ON THE WEB DISABLE TYPEKIT JUST FOR IE6 - load IE6 Fonts in Style Sheet within Conditional Comments in the Header WORDCAMP RENO Saturday, June 4, 2011
  • 48. TYPOGRAPHY ON THE WEB DISABLE FOR ALL OF WINDOWS: User Agent WORDCAMP RENO Saturday, June 4, 2011
  • 49. TYPOGRAPHY ON THE WEB JUST FIREFOX CSS Hack WORDCAMP RENO Saturday, June 4, 2011
  • 50. TYPOGRAPHY ON THE WEB FIREFOX ON ALL OF WINDOWS User Agent WORDCAMP RENO Saturday, June 4, 2011
  • 51. TYPOGRAPHY ON THE WEB FIREFOX ON WINDOWS XP User Agent + CSS Hack WORDCAMP RENO Saturday, June 4, 2011
  • 52. TYPOGRAPHY ON THE WEB COMBATING FOUT Flash Of Unstyled Text WORDCAMP RENO Saturday, June 4, 2011
  • 53. TYPOGRAPHY AND YOUR THEME COMBATING FOUT blog.typekit.com/2010/05/19/typekit-and-google/ WORDCAMP RENO Saturday, June 4, 2011
  • 54. TYPOGRAPHY AND YOUR THEME COMBATING FOUT code.google.com/apis/webfonts/ docs/webfont_loader.html WORDCAMP RENO Saturday, June 4, 2011
  • 55. TYPOGRAPHY AND YOUR THEME Typekit Default Embed: Webfont Loader Embed: WORDCAMP RENO Saturday, June 4, 2011
  • 56. TYPOGRAPHY AND YOUR THEME WORDCAMP RENO Saturday, June 4, 2011
  • 57. TYPOGRAPHY AND YOUR THEME github.com/typekit/webfontloader WORDCAMP RENO Saturday, June 4, 2011
  • 58. TYPOGRAPHY AND YOUR THEME WORDCAMP RENO Saturday, June 4, 2011
  • 59. TYPOGRAPHY ON THE WEB Take it Even Further WORDCAMP RENO Saturday, June 4, 2011
  • 60. TYPOGRAPHY ON THE WEB STYLING CONDENSED FONTS: Fallback with Fallback Without Webfont Loader Normal Webfont Loaser WORDCAMP RENO Saturday, June 4, 2011
  • 61. TYPOGRAPHY ON THE WEB USE THOSE STYLE SHEETS! WORDCAMP RENO Saturday, June 4, 2011
  • 62. TYPOGRAPHY ON THE WEB Even More Custom Type Implementation WORDCAMP RENO Saturday, June 4, 2011
  • 63. TYPOGRAPHY ON THE WEB CSS3 WORDCAMP RENO Saturday, June 4, 2011
  • 64. TYPOGRAPHY ON THE WEB TEXT-SHADOW WORDCAMP RENO Saturday, June 4, 2011
  • 65. TYPOGRAPHY ON THE WEB http://mothereffingtextshadow.com/ Saturday, June 4, 2011
  • 66. TYPOGRAPHY ON THE WEB http://mothereffingtextshadow.com/ Saturday, June 4, 2011
  • 67. TYPOGRAPHY ON THE WEB ROTATE http://www.cssplayer.com/blog/date-display-technique- with-text-rotation/ WORDCAMP RENO Saturday, June 4, 2011
  • 68. TYPOGRAPHY ON THE WEB ROTATE WORDCAMP RENO Saturday, June 4, 2011
  • 69. TYPOGRAPHY ON THE WEB WordPress Plugins WORDCAMP RENO Saturday, June 4, 2011
  • 70. TYPOGRAPHY ON THE WEB PLUGIN: WP TYPOGRAPHY http://wordpress.org/extend/plugins/wp-typography/ WORDCAMP RENO Saturday, June 4, 2011
  • 71. TYPOGRAPHY ON THE WEB PLUGIN: DROP CAPS http://wordpress.org/extend/plugins/drop-caps/ • override their css with your own • works across browsers with not too much tweaking WORDCAMP RENO Saturday, June 4, 2011
  • 72. TYPOGRAPHY ON THE WEB Neat Type Scripts WORDCAMP RENO Saturday, June 4, 2011
  • 73. TYPOGRAPHY ON THE WEB SCRIPT: LETTERING.JS http://letteringjs.com/ • Takes each letter in a headline and wraps it in a Span • Allows for individual letter manipulation • Not recommended for large chunks WORDCAMP RENO Saturday, June 4, 2011
  • 74. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 75. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 76. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 77. TYPOGRAPHY ON THE WEB SCRIPT: KERN.JS http://www.kernjs.com/ • Allows in-browser kerning of lettering • Generates code for kerned copy • Works with Lettering.js WORDCAMP RENO Saturday, June 4, 2011
  • 78. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 79. TYPOGRAPHY ON THE WEB SCRIPT: FIT TEXT http:// ttextjs.com/ • Stretches headline to t container • Useful for uid/responsive layouts WORDCAMP RENO Saturday, June 4, 2011
  • 80. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 81. TYPOGRAPHY ON THE WEB Other Must Havesies WORDCAMP RENO Saturday, June 4, 2011
  • 82. TYPOGRAPHY ON THE WEB EXTENSION: WHATFONT http://chengyinliu.com/whatfont.html • Find out what fonts and their CSS others are using • Sharpen your ninja font-detection skillz! (yes that is a ninja skill) WORDCAMP RENO Saturday, June 4, 2011
  • 83. TYPOGRAPHY ON THE WEB WORDCAMP RENO Saturday, June 4, 2011
  • 84. TYPOGRAPHY ON THE WEB EXTENSION: GOOGLE FONT PREVIEWER https://github.com/pamelafox/font-previewer- extension • Test run a font on your site without coding • using web-fonts only from Google’s web-font API WORDCAMP RENO Saturday, June 4, 2011
  • 85. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 86. TYPOGRAPHY ON THE WEB BOOKMARKLET: MIN http://min.artequalswork.com/ • Shows your site if it was just type • Gets rid of all images and leaves just the type layout • Analyze Typographic Hierarchy WORDCAMP RENO Saturday, June 4, 2011
  • 87. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 88. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 89. TYPOGRAPHY ON THE WEB e Future? WORDCAMP RENO Saturday, June 4, 2011
  • 90. TYPOGRAPHY ON THE WEB THE FUTURE? • Richard Ritter of Fontdeck.com @clanut •Open Type • Ligatures • Multiple Alphabet Sets • Multiple Numeric Sets • All through CSS Classes! WORDCAMP RENO Saturday, June 4, 2011
  • 91. TYPOGRAPHY ON THE WEB What Not To Do WORDCAMP RENO Saturday, June 4, 2011
  • 92. TYPOGRAPHY ON THE WEB Style Your Website With Paparyus (Sorry Every Mediterranean Restaurant Website Ever) WORDCAMP RENO Saturday, June 4, 2011
  • 93. TYPOGRAPHY ON THE WEB Use Non-Web-Licensed Fonts: Archer or GOTHAM (Sorry H&FJ Luvahz) WORDCAMP RENO Saturday, June 4, 2011
  • 94. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 95. TYPOGRAPHY ON THE WEB Never EVER Use The Infamous Comic Sans (It doesn’t matter that you think it’s good for wire-framing) WORDCAMP RENO Saturday, June 4, 2011
  • 96. TYPOGRAPHY ON THE WEB It’s STILL Not Cool EVEN If You Think It Is IRONIC (Sorry Jorbin) WORDCAMP RENO Saturday, June 4, 2011
  • 97. TYPOGRAPHY ON THE WEB e Infamous Eye Bleed WORDCAMP RENO Saturday, June 4, 2011
  • 98. TYPOGRAPHY ON THE WEB EYE BLEED!!! AHHH THE BURNING! FREE SET OF STEAK KNIVES!!! Saturday, June 4, 2011
  • 99. TYPOGRAPHY ON THE WEB e Even More Infamous EYE BLEED WORDCAMP RENO Saturday, June 4, 2011
  • 100. TYPOGRAPHY ON THE WEB EYE BLEED!!! AHHH THE BURNING! FREE SET OF STEAK KNIVES!!! Saturday, June 4, 2011
  • 101. TYPOGRAPHY ON THE WEB What To Do WORDCAMP RENO Saturday, June 4, 2011
  • 102. TYPOGRAPHY ON THE WEB Find An Appropriate Substitution For: GOTHAM By Using PROXIMA NOVA WORDCAMP RENO Saturday, June 4, 2011
  • 103. TYPOGRAPHY ON THE WEB Check All Browsers Always. WORDCAMP RENO Saturday, June 4, 2011
  • 104. TYPOGRAPHY ON THE WEB Create A Typographic Style Guide For Your eme WORDCAMP RENO Saturday, June 4, 2011
  • 105. TYPOGRAPHY ON THE WEB http://twentytendemo.wordpress.com/ Saturday, June 4, 2011
  • 106. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 107. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 108. TYPOGRAPHY ON THE WEB http://twentyelevendemo.wordpress.com/ Saturday, June 4, 2011
  • 109. TYPOGRAPHY ON THE WEB Follow e Industry WORDCAMP RENO Saturday, June 4, 2011
  • 110. TYPOGRAPHY ON THE WEB blog.typekit.com Saturday, June 4, 2011
  • 111. TYPOGRAPHY ON THE WEB ilovetypography.com Saturday, June 4, 2011
  • 112. TYPOGRAPHY ON THE WEB typographica.org Saturday, June 4, 2011
  • 113. TYPOGRAPHY ON THE WEB webtypography.net Saturday, June 4, 2011
  • 114. TYPOGRAPHY ON THE WEB Follow e Tweets WORDCAMP RENO Saturday, June 4, 2011
  • 115. TYPOGRAPHY ON THE WEB FOLLOW THE TWEETS @JasonSantaMaria @fontsquirrel @veen @typekit @brucel @h_ @ilovetypography @clagnut @jessicahische @fchimero WORDCAMP RENO Saturday, June 4, 2011
  • 116. TYPOGRAPHY ON THE WEB Find Inspiration WORDCAMP RENO Saturday, June 4, 2011
  • 117. TYPOGRAPHY ON THE WEB siteinspire.net Saturday, June 4, 2011
  • 118. TYPOGRAPHY ON THE WEB typographyserved.com Saturday, June 4, 2011
  • 119. TYPOGRAPHY ON THE WEB ministryoftype.co.uk Saturday, June 4, 2011
  • 120. TYPOGRAPHY ON THE WEB dribbble.com Saturday, June 4, 2011
  • 121. TYPOGRAPHY ON THE WEB wordpress.org/showcase Saturday, June 4, 2011
  • 122. TYPOGRAPHY ON THE WEB Find Cool Fonts WORDCAMP RENO Saturday, June 4, 2011
  • 123. TYPOGRAPHY ON THE WEB P22 UNDERGROUND by: P22 http://typekit.com/fonts/p22-underground Saturday, June 4, 2011
  • 124. TYPOGRAPHY ON THE WEB Adelle by: Type Together http://typekit.com/fonts/adelle-web Saturday, June 4, 2011
  • 125. TYPOGRAPHY ON THE WEB http://typekit.com/fonts/ff-tisa-web-pro Saturday, June 4, 2011
  • 126. TYPOGRAPHY ON THE WEB “life is short, art is long” Typography is Everything. WORDCAMP RENO Saturday, June 4, 2011
  • 127. TYPOGRAPHY ON THE WEB ank You! sara cannon / sara-cannon.com / follow @saracannon Saturday, June 4, 2011
  • 128. TYPOGRAPHY ON THE WEB Type Foundries WORDCAMP RENO Saturday, June 4, 2011
  • 129. TYPOGRAPHY ON THE WEB H&FJ WORDCAMP RENO Saturday, June 4, 2011
  • 130. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 131. TYPOGRAPHY ON THE WEB Archer Saturday, June 4, 2011
  • 132. TYPOGRAPHY ON THE WEB GOTHAM Saturday, June 4, 2011
  • 133. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 134. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 135. TYPOGRAPHY ON THE WEB Veer WORDCAMP RENO Saturday, June 4, 2011
  • 136. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 137. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 138. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 139. TYPOGRAPHY ON THE WEB Adobe WORDCAMP RENO Saturday, June 4, 2011
  • 140. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 141. TYPOGRAPHY ON THE WEB e League Of Moveable Type WORDCAMP RENO Saturday, June 4, 2011
  • 142. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 143. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 144. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 145. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 146. TYPOGRAPHY ON THE WEB Open Source! O (open Font License) theleagueofmoveabletype.com/manifesto WORDCAMP RENO Saturday, June 4, 2011
  • 147. TYPOGRAPHY ON THE WEB Exljbris WORDCAMP RENO Saturday, June 4, 2011
  • 148. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 149. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 150. TYPOGRAPHY ON THE WEB Lost Type Pay What You Want by Riely Cran & Tyler Galpin WORDCAMP RENO Saturday, June 4, 2011
  • 151. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011
  • 152. TYPOGRAPHY ON THE WEB Saturday, June 4, 2011