Fluid Web Typography - SXSWi 2010
by Jason CranfordTeague
- 9,513 views
Presented at SXSWi 2010 ...
Presented at SXSWi 2010
For almost 15 years, Web designers have had a list of 10 "Core Web fonts" to choose from. Many ask, "Why can't I just download a font file from my Web server the same way I can an image?" Well, actually, you can. The verbiage for font linking is a little different than images, but the syntax for Webfont linking has been around for over 10 years as a part of the CSS standard. Web typography expert Jason Cranford Teague shows you how to apply the principles of fluid typography, to choose, find and use Webfonts and create your unique typographic voice. Come and find out why 2010 is going to be the year of Web typography.
Accessibility
Categories
Upload Details
Uploaded via SlideShare as Adobe PDF
Usage Rights
© All Rights Reserved
Statistics
- Likes
- 41
- Downloads
- 482
- Comments
- 1
- Embed Views
- Views on SlideShare
- 8,348
- Total Views
- 9,513
1–1 of 1 previous next
• Flying cars
• Going to Jupiter
• Decent Web Typography
• Flying cars
• Going to Jupiter
• Decent Web Typography
• Space program not even ready to go to the Moon
• But things changed drastically last year for Web Typography…
• Space program not even ready to go to the Moon
• But things changed drastically last year for Web Typography…
"Year of Web Typography"
• Top 10 eCommerce Web site
• Recently relaunched with new design
• Enacting progressive Web typography
• Top 10 eCommerce Web site
• Recently relaunched with new design
• Enacting progressive Web typography
• Top 10 eCommerce Web site
• Recently relaunched with new design
• Enacting progressive Web typography
• Speaking in Styles
• Fluid Web Typography
• Writing CSS Visual Quickstart Guide
• Speaking in Styles
• Fluid Web Typography
• Writing CSS Visual Quickstart Guide
• Speaking in Styles
• Fluid Web Typography
• Writing CSS Visual Quickstart Guide
• Generic and Core Web fonts
• Web Safe Fonts
• Download Webfont for all current browsers
• Generic and Core Web fonts
• Web Safe Fonts
• Download Webfont for all current browsers
• Generic and Core Web fonts
• Web Safe Fonts
• Download Webfont for all current browsers
• Font foundries
• Free Webfonts
• Webfont service bureaus
• Font foundries
• Free Webfonts
• Webfont service bureaus
• Font foundries
• Free Webfonts
• Webfont service bureaus
establish your typographic voice
establish your typographic voice
establish your typographic voice
• Adds meaning beyond the words themselves
• Voice can even change meaning
• The fonts are a key part of typography
• Adds meaning beyond the words themselves
• Voice can even change meaning
• The fonts are a key part of typography
• Adds meaning beyond the words themselves
• Voice can even change meaning
• The fonts are a key part of typography
• Adds meaning beyond the words themselves
• Voice can even change meaning
• The fonts are a key part of typography
Say angrily
Say angrily
• Friendly
• Robotic
• Crazy
• Talk like Pirate
• Friendly
• Robotic
• Crazy
• Talk like Pirate
• Friendly
• Robotic
• Crazy
• Talk like Pirate
• Friendly
• Robotic
• Crazy
• Talk like Pirate
• Friendly
• Robotic
• Crazy
• Talk like Pirate
• Friendly
• Robotic
• Crazy
• Talk like Pirate
• Friendly
• Robotic
• Crazy
• Talk like Pirate
• Friendly
• Robotic
• Crazy
• Talk like Pirate
Typography is a quick inexpensive way to stand out in a crowd.
Typography is a quick inexpensive way to stand out in a crowd.
Typography is a quick inexpensive way to stand out in a crowd.
Typography is a quick inexpensive way to stand out in a crowd.
Typography is a quick inexpensive way to stand out in a crowd.
Typography is a quick inexpensive way to stand out in a crowd.
Typography is a quick inexpensive way to stand out in a crowd.
Typography is a quick inexpensive way to stand out in a crowd.
Typography is a quick inexpensive way to stand out in a crowd.
Typography is a quick inexpensive way to stand out in a crowd.
Typography is a quick inexpensive way to stand out in a crowd.
Typography is a quick inexpensive way to stand out in a crowd.
Typography is a quick inexpensive way to stand out in a crowd.
Typography is a quick inexpensive way to stand out in a crowd.
Typography is a quick inexpensive way to stand out in a crowd.
Webfonts applied specifically to fonts being downloaded using @font-face
Webfonts applied specifically to fonts being downloaded using @font-face
Webfonts applied specifically to fonts being downloaded using @font-face
…Let's start with what it is not.
…Let's start with what it is not.
styled using Cascading Style sheets.
styled using Cascading Style sheets.
That's what design is about
Design is about overcoming the limits of the medium.
I am here today with no less of a task than to change the way you view the limitation of Typography using CSS in regards to the limited font-family choices we seem to have.
That's what design is about
Design is about overcoming the limits of the medium.
I am here today with no less of a task than to change the way you view the limitation of Typography using CSS in regards to the limited font-family choices we seem to have.
When you choose your font, you do not change the meaning of the letter.. a A is still a A, but by changing it's skin, you change what it is saying, adding another level of communication.
but there are many ways to do this.
but there are many ways to do this.
but there are many ways to do this.
but there are many ways to do this.
but there are many ways to do this.
Everybody is surgically altered to look the same.
Everybody is surgically altered to look the same.
• Facebuster 400
• Helvetica Neue Thin Condensed
• Baskerville
• Facebuster 400
• Helvetica Neue Thin Condensed
• Baskerville
• Daniel
• Daniel
• Fertigo Pro
• Fertigo Pro
• Netto
• Netto
• ff-enzo-web
• ff-enzo-web
• ff-enzo-web
Webfonts applied specifically to fonts being downloaded using @font-face
Webfonts applied specifically to fonts being downloaded using @font-face
Webfonts applied specifically to fonts being downloaded using @font-face
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
webfont, web safe font, core web font, and generic (in that order)
BUT there are other fonts that we can rely on to be installed depending on the operating system.
BUT there are other fonts that we can rely on to be installed depending on the operating system.
redistribution if the packages are kept in their original format and filenames and not used to add value to commercial products.
redistribution if the packages are kept in their original format and filenames and not used to add value to commercial products.
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Andale Mono no longer installed with Windows,
Webdings does not work in many browsers
Impact and Arial black - primarily display fonts for headlines
Courier New - Monospace
Comic Sans- 'Nuff said
Only used because the perception is that is all that is commonly available
but many fonts are pre-installed from variety of sources
Only used because the perception is that is all that is commonly available
but many fonts are pre-installed from variety of sources
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
Weights & Styles
OS - Windows, Mac, or cross (Web safe)
Likelihood of availability
Sample Graphic
Font Name
OS
Installing Application, Installed
Adobe CS
Font Name
OS
Installing Application, Installed
Adobe CS
Font Name
OS
Installing Application, Installed
Adobe CS
Font Name
OS
Installing Application, Installed
Adobe CS
Font Name
OS
Installing Application, Installed
Adobe CS
Font Name
OS
Installing Application, Installed
Adobe CS
Font Name
OS
Installing Application, Installed
Adobe CS
Font Name
OS
Installing Application, Installed
Adobe CS
Font Name
OS
Installing Application, Installed
Adobe CS
Font Name
OS
Installing Application, Installed
Adobe CS
Font Name
OS
Installing Application, Installed
Adobe CS
Font Name
OS
Installing Application, Installed
Adobe CS
I can place this file on my server, and use @font-face in my CSS to download it
I can place this file on my server, and use @font-face in my CSS to download it
I can place this file on my server, and use @font-face in my CSS to download it
I can place this file on my server, and use @font-face in my CSS to download it
I can place this file on my server, and use @font-face in my CSS to download it
I can place this file on my server, and use @font-face in my CSS to download it
I can place this file on my server, and use @font-face in my CSS to download it
I can place this file on my server, and use @font-face in my CSS to download it
I can place this file on my server, and use @font-face in my CSS to download it
I can place this file on my server, and use @font-face in my CSS to download it
Provides some copy protection
difficult to convert from standard font formats
Provides some copy protection
difficult to convert from standard font formats
MTX font compression
URL Binding (root strings)
OpenType is a scalable format for computer fonts (also sometimes known interchangeably as "typefaces"), initially developed by Microsoft, later joined by Adobe Systems.
BUT THEY LACK Digital Rights Management. so anyone can use and take them even if they didn't purchase them.
OpenType is a scalable format for computer fonts (also sometimes known interchangeably as "typefaces"), initially developed by Microsoft, later joined by Adobe Systems.
BUT THEY LACK Digital Rights Management. so anyone can use and take them even if they didn't purchase them.
OpenType is a scalable format for computer fonts (also sometimes known interchangeably as "typefaces"), initially developed by Microsoft, later joined by Adobe Systems.
BUT THEY LACK Digital Rights Management. so anyone can use and take them even if they didn't purchase them.
OpenType is a scalable format for computer fonts (also sometimes known interchangeably as "typefaces"), initially developed by Microsoft, later joined by Adobe Systems.
BUT THEY LACK Digital Rights Management. so anyone can use and take them even if they didn't purchase them.
OpenType is a scalable format for computer fonts (also sometimes known interchangeably as "typefaces"), initially developed by Microsoft, later joined by Adobe Systems.
BUT THEY LACK Digital Rights Management. so anyone can use and take them even if they didn't purchase them.
-->
-->
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
I can place this file on my server, and use @font-face in my CSS to download it
"Bulletproof" by Paul Irish
Modified Bulletproof
Avoids local() problem
Converts to EOT Lite, SVG, and WOFF
Also allows screen optimization and Subsetting
To take care of licensing
To take care of licensing
sIFR - Flash
Cufón - JavaScript - can slow down overall JavaScript performance
FontSquirrel now includes Cufón support
sIFR - Flash
Cufón - JavaScript - can slow down overall JavaScript performance
FontSquirrel now includes Cufón support
The landscape is constantly changing, but I want to share with you what you should be looking for
in three places many of us will find webfonts:
• Font foundries
• Free fonts sources
• New Webfont service Bureaus
The landscape is constantly changing, but I want to share with you what you should be looking for
in three places many of us will find webfonts:
• Font foundries
• Free fonts sources
• New Webfont service Bureaus
...
Makes a speed guarantee
...
Makes a speed guarantee
“Your fonts will be served from a robust global network built with hundreds of servers located across North America, Europe, Australia, and Asia.”
http://typekit.com/tour/scalability
“Your fonts will be served from a robust global network built with hundreds of servers located across North America, Europe, Australia, and Asia.”
http://typekit.com/tour/scalability
“Your fonts will be served from a robust global network built with hundreds of servers located across North America, Europe, Australia, and Asia.”
http://typekit.com/tour/scalability
“Your fonts will be served from a robust global network built with hundreds of servers located across North America, Europe, Australia, and Asia.”
http://typekit.com/tour/scalability
“Your fonts will be served from a robust global network built with hundreds of servers located across North America, Europe, Australia, and Asia.”
http://typekit.com/tour/scalability
...
Interface a little tricky
...
Interface a little tricky
Good deal, but limited choices.
Good deal, but limited choices.
...
Good price and great interface.
...
Good price and great interface.
...
Good price and great interface.
Here are a few best practices I've developed for choosing the best fonts for your designs
Here are a few best practices I've developed for choosing the best fonts for your designs
think carefully about how you want your message perceived and choose typefaces accordingly
think carefully about how you want your message perceived and choose typefaces accordingly
think carefully about how you want your message perceived and choose typefaces accordingly
think carefully about how you want your message perceived and choose typefaces accordingly
think carefully about how you want your message perceived and choose typefaces accordingly
think carefully about how you want your message perceived and choose typefaces accordingly
think carefully about how you want your message perceived and choose typefaces accordingly
think carefully about how you want your message perceived and choose typefaces accordingly
think carefully about how you want your message perceived and choose typefaces accordingly
think carefully about how you want your message perceived and choose typefaces accordingly
cambria and georgia have similar line heights
As a result, they make consistent matches.
cambria and georgia have similar line heights
As a result, they make consistent matches.
cambria and georgia have similar line heights
As a result, they make consistent matches.
cambria and georgia have similar line heights
As a result, they make consistent matches.
cambria and georgia have similar line heights
As a result, they make consistent matches.
cambria and georgia have similar line heights
As a result, they make consistent matches.
cambria and georgia have similar line heights
As a result, they make consistent matches.
cambria and georgia have similar line heights
As a result, they make consistent matches.
cambria and georgia have similar line heights
As a result, they make consistent matches.
cambria and georgia have similar line heights
As a result, they make consistent matches.
cambria and georgia have similar line heights
As a result, they make consistent matches.
cambria and georgia have similar line heights
As a result, they make consistent matches.
A font without bold and italic will either appear normal or, worse,
the styles will be synthesized by the browser.
A font without bold and italic will either appear normal or, worse,
the styles will be synthesized by the browser.
A font without bold and italic will either appear normal or, worse,
the styles will be synthesized by the browser.
A font without bold and italic will either appear normal or, worse,
the styles will be synthesized by the browser.
A font without bold and italic will either appear normal or, worse,
the styles will be synthesized by the browser.
A font without bold and italic will either appear normal or, worse,
the styles will be synthesized by the browser.
A font without bold and italic will either appear normal or, worse,
the styles will be synthesized by the browser.
A font without bold and italic will either appear normal or, worse,
the styles will be synthesized by the browser.
A font without bold and italic will either appear normal or, worse,
the styles will be synthesized by the browser.
A font without bold and italic will either appear normal or, worse,
the styles will be synthesized by the browser.
A font without bold and italic will either appear normal or, worse,
the styles will be synthesized by the browser.
A font without bold and italic will either appear normal or, worse,
the styles will be synthesized by the browser.
A font without bold and italic will either appear normal or, worse,
the styles will be synthesized by the browser.
finer weights, strokes and serifs become blurry at smaller sizes.
finer weights, strokes and serifs become blurry at smaller sizes.
finer weights, strokes and serifs become blurry at smaller sizes.
finer weights, strokes and serifs become blurry at smaller sizes.
finer weights, strokes and serifs become blurry at smaller sizes.
finer weights, strokes and serifs become blurry at smaller sizes.
finer weights, strokes and serifs become blurry at smaller sizes.
finer weights, strokes and serifs become blurry at smaller sizes.
finer weights, strokes and serifs become blurry at smaller sizes.
finer weights, strokes and serifs become blurry at smaller sizes.
finer weights, strokes and serifs become blurry at smaller sizes.
finer weights, strokes and serifs become blurry at smaller sizes.
finer weights, strokes and serifs become blurry at smaller sizes.
finer weights, strokes and serifs become blurry at smaller sizes.
finer weights, strokes and serifs become blurry at smaller sizes.
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
More space, wider counters and widths, and taller x-height generally make copy easier to read
however, look for a good balance to make sure the font is also engaging to read
"Year of Web Typography"
• Links from lecture
• Hand out notes
• Handout of Websafe fonts
Questions?
• Links from lecture
• Hand out notes
• Handout of Websafe fonts
Questions?
• Links from lecture
• Hand out notes
• Handout of Websafe fonts
Questions?
• Links from lecture
• Hand out notes
• Handout of Websafe fonts
Questions?
• Links from lecture
• Hand out notes
• Handout of Websafe fonts
Questions?
• Links from lecture
• Hand out notes
• Handout of Websafe fonts
Questions?
To enter to win a free copy of my book, visit fluidwebtype.com