Web Typography Resources

Here are a host of links and resources to help you make best use of typography on the web.

Upcoming Webcasts

• More coming soon!

Web Typography Best Practices Webcast Recordings

• Part 1: Choosing and Combining Fonts for Websites
• Part 2: Setting Type for Web Sites
• Part 3: OpenType Features on the Web

Designing with Web Fonts in Adobe Photoshop

• Webcast Recording

How to Implement Web Fonts on your Website

• Webcast Recording

Tools

• FontFuse for pairing/combinations
• FontDropper experimenting with fonts applied to existing sites
• Designing & editing fonts: FontLab Studio, Fontographer, TypeTool, etc.
• Font Identification
  • Fount
  • Identifont
  • Typophile (go to Font ID forum area)
  • WhatTheFont

Web Typography General

• Elements of Typographic Style for the web
• Accessibility/legibility
• WebINK blog
• Nice Web Type

CSS 3

• CSS 3 fonts module
• OpenType support in Firefox

Font Selection & Combination

• Font Selection on Smashing Magazine
• 29 Principles for Making Great Font Combinations
• Hoefler & Frere-Jones on combinations (advanced font combinations)

General Typography

• The Elements of Typographic Styleby Robert Bringhurst
  • View/purchase on Amazon
  • Wikipedia article about the book
• Thinking with Type by Ellen Lupton
• How to Explain Why Typography Matters (to clients, etc.) by Thomas Phinney
• Typophile, the main online typography hangout
• I Love Typography
• Thomas Phinney’s blog

Licensing Issues

• Rick Santorum presidential website accused of font piracy
• Wizarding World of Harry Potter (NBC Universal) theme park sued for $2 Million for font misuse
• NBC sued for $2 Million by The Font Bureau

Setting Type on the Web

• Visual Hierarchy in Web Design great overview article
• The Contrast Rebellion: how many sites have inadequate contrast between text and background, and why that’s a huge problem. Join the rebellion!
• The Paragraph in Web Typography & Design great article by Jon Tan (although we disagree on using both first-line indent and extra line space at the same time)
• CSS3 Hyphenation Controls Fine tune as well as turn on hyphenation
• Hyphenation Browser Test by Eric Meyer. Verify if a browser supports hyphenation, and see effects of different settings in CSS and in the content.
• Line Height Sampler. W3 Schools interactive line height player.
• Ideal Line Length for Content by Russ Weakley, MaxDesign. How to control line length and what to set it to.
• Justification vs Ragged Right. Wikipedia article on justification.