WEB TYPOGRAPHY beyond Arial, Verdana & Georgia
A SKETCHY HISTORY         1996 • Core Fonts Developed by Microsoft        1998 • CSS2 introduced the @font-face rule      ...
WHAT TOOK SO LONG?    Three main reasons:         Foundries.         Licensing.          Pricing.
TODAY & YOU  Font Squirrel • Quality & Free for Commercial Use       @font-face kits and @font-face generator        Googl...
TRIVIA QUESTIONOf the websites discussed in the past few slides, which was acquired by Adobe last October?
ANSWER:  Typekit
THINGS TO WATCH FOR         TRUE OR FALSE: Embedded font sizes are            consistent across browsers. • FALSE     TRUE...
ONE MORE THING...      Lettering.js
Upcoming SlideShare
Loading in …5
×

Web typography

994 views
907 views

Published on

Published in: Technology, Art & Photos
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
994
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Web typography

    1. 1. WEB TYPOGRAPHY beyond Arial, Verdana & Georgia
    2. 2. A SKETCHY HISTORY 1996 • Core Fonts Developed by Microsoft 1998 • CSS2 introduced the @font-face rule 2005 • sIFR (Scalable Inman Flash Replacement) October 2008 • Font Squirrel goes live 2009 • Typekit goes liveMay 19, 2010 • Google Introduces their Font API & Directory May 2010 • Fonts.com Web Fonts goes live
    3. 3. WHAT TOOK SO LONG? Three main reasons: Foundries. Licensing. Pricing.
    4. 4. TODAY & YOU Font Squirrel • Quality & Free for Commercial Use @font-face kits and @font-face generator Google Web Fonts • Reliability & Free includes 436 Font Families & Growing as Google Funds Fonts.com Web Fonts • Affordable & Quality$10/month for 20,000 fonts & 250,000 page views/month Typekit • Highest Quality & Affordable$49.99/year 707 Font Families & 500,000 page views/month
    5. 5. TRIVIA QUESTIONOf the websites discussed in the past few slides, which was acquired by Adobe last October?
    6. 6. ANSWER: Typekit
    7. 7. THINGS TO WATCH FOR TRUE OR FALSE: Embedded font sizes are consistent across browsers. • FALSE TRUE OR FALSE: When using embedded fonts, font-families (fall-backs) are not necessary. • FALSE Example: WRONG: font-family:Avenir LT W01 55 Roman;RIGHT: font-family:Avenir LT W01 55 Roman, "Helvetica Neue", Arial, Helvetica, sans-serif; MOST IMPORTANT!Avoid using font-weight with embedded fonts.
    8. 8. ONE MORE THING... Lettering.js

    ×