4. Screen typography is still evolving.
Different font vendors may require
different licenses.
Not all devices support all formats.
Font rendering is different from one
platform to another.
And not all fonts work well on screen.
14. Most fonts out there were designed
for other purposes.
All software and device issues aside,
that’s why not all fonts work well
on screens.
15. Vertical proportions
Look at the x-height — the height of the lowercase letters — to see if fonts will match
Verdana
Helvetica Neue
Times New Roman
Baskerville
Georgia
Lucida Grande
Help!
Help!
Help!
Help!
Help!
Help!
16. Comparison of four fonts at the same size
Note that the optical size also affects the space between lines
17. IlIlIlShapes
Straight lines and clear forms work better than subtle angles or curves
At small sizes, good hinting can keep these details from causing trouble
Georgia Optima Palatino
18.
19. Open spaces
Generous spacing within and around the letters will increase legibility
generosity
generosity
Open apertures Loose spacing
21. Choose families wisely
A wide range of weights make it easy to choose a suitable weight for each instance
22. Openype features for refined typography
Affiliate flag Affiliate flag
Ligatures
The 1980s The 1980s
Alternative number styles
Nicest egg Nicest egg
Swashes and contextual altenates
An EPUB book An epub book
Real small caps
→
→
→
→
25. Compensate for inconsistency
Adjust the size and line-height as needed to get contrasting fonts to work together
Who can turn the world on with her smile? Who can take
a nothing day, and suddenly make it all seem worth-
while? Well it’s you girl, and you should know it. With each
glance and every little movement you show it. Love is all
around, no need to waste it. You can have a town, why
don’t you take it. You’re gonna make it after all. You’re
gonna make it after all.
Who can turn the world on with her smile? Who can take a
nothing day, and suddenly make it all seem worthwhile? Well it’s
you girl, and you should know it.With each glance and every lit-
tle movement you show it. Love is all around, no need to waste
it.You can have a town, why don’t you take it.You’re gonna make
it after all.You’re gonna make it after all.
Who can turn the world on with her smile? Who can take
a nothing day, and suddenly make it all seem worth-
while? Well it’s you girl, and you should know it. With each
glance and every little movement you show it. Love is all
around, no need to waste it. You can have a town, why
don’t you take it. You’re gonna make it after all. You’re
gonna make it after all.
Who can turn the world on with her smile? Who can
take a nothing day, and suddenly make it all seem worth-
while? Well it’s you girl, and you should know it.With
each glance and every little movement you show it. Love
is all around, no need to waste it.You can have a town,
why don’t you take it.You’re gonna make it after all.You’re
gonna make it after all.
Helvetica Neue — size: 18px; line-height: 100%
Helvetica Neue — size: 18px; line-height: 20px
Gill Sans — size: 18px; line-height: 100%
Gill Sans — size: 20px; line-height: 100%
26. Be generous
If in doubt, slightly larger text size and extra line spacing will often be easier to read
33. Everyone’s racing to make better
fonts available to you
Hinting existing fonts to look better.
Revising outlines and spacing to look clearer
at small sizes.
Designing new fonts specifically for screen
display.
So speak up and tell us what you want!