Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
BEYOND THE SYSTEM FONT




by sara cannon / sara-cannon.com / follow @saracannon
BEYOND THE SYSTEM FONT




        SARA CANNON
        Scout Branding Company

        twitter: @saracannon

        blog:...
BEYOND THE SYSTEM FONT




TYPOGRAPHY
BEYOND THE SYSTEM FONT
BEYOND THE SYSTEM FONT




   WEB
TYPOGRAPHY
BEYOND THE SYSTEM FONT
BEYOND THE SYSTEM FONT


       ADOBE:
BEYOND THE SYSTEM FONT


          HF&J




NO @FONT-FACE
 EMBEDDING!
BEYOND THE SYSTEM FONT




SITE EXAMPLES
BEYOND THE SYSTEM FONT




http://lostworldsfairs.com/
BEYOND THE SYSTEM FONT
BEYOND THE SYSTEM FONT




http://www.designmadeingermany.de/magazin/5/
BEYOND THE SYSTEM FONT
BEYOND THE SYSTEM FONT




http://sxsw.beercamp.com/
BEYOND THE SYSTEM FONT
BEYOND THE SYSTEM FONT
BEYOND THE SYSTEM FONT




 http://typekit.com/gallery
BEYOND THE SYSTEM FONT
BEYOND THE SYSTEM FONT




“I WANT TO GO
 BEYOND THE
SYSTEM FONT!”
BEYOND THE SYSTEM FONT




CUFON / FLIR / SIFR
BEYOND THE SYSTEM FONT




 FONT-STACKS
BEYOND THE SYSTEM FONT




 @FONT-FACE
BEYOND THE SYSTEM FONT




  HAND CODE
   TYPEKIT
FONTSQUIRREL /
 FONTSPRING
 GOOGLE API
BEYOND THE SYSTEM FONT




 TYPEKIT.COM
BEYOND THE SYSTEM FONT
BEYOND THE SYSTEM FONT




   TYPEKIT HAS   68
PARTICIPATING FOUNDRIES
BEYOND THE SYSTEM FONT


       ADOBE:
BEYOND THE SYSTEM FONT


        VEER:
BEYOND THE SYSTEM FONT




      DEMO
BEYOND THE SYSTEM FONT
BEYOND THE SYSTEM FONT




TYPEKIT + MOBILE
BEYOND THE SYSTEM FONT

       IPHONE




      ANDROID
BEYOND THE SYSTEM FONT
BEYOND THE SYSTEM FONT
BEYOND THE SYSTEM FONT



COMBATING FOUT


           Flash

           Of

           Unstyled

           Text
BEYOND THE SYSTEM FONT



 COMBATING FOUT




blog.typekit.com/2010/05/19/typekit-and-google/
BEYOND THE SYSTEM FONT



COMBATING FOUT




github.com/typekit/webfontloader
BEYOND THE SYSTEM FONT



COMBATING FOUT

TYPEKIT DEFAULT EMBED:
BEYOND THE SYSTEM FONT



COMBATING FOUT

TYPEKIT DEFAULT EMBED:
BEYOND THE SYSTEM FONT



COMBATING FOUT

TYPEKIT DEFAULT EMBED:




WEB FONT LOADER EMBED:
BEYOND THE SYSTEM FONT



COMBATING FOUT

TYPEKIT DEFAULT EMBED:
BEYOND THE SYSTEM FONT



COMBATING FOUT




github.com/typekit/webfontloader
BEYOND THE SYSTEM FONT



COMBATING FOUT
BEYOND THE SYSTEM FONT



COMBATING FOUT



code.google.com/apis/webfonts/
docs/webfont_loader.html
BEYOND THE SYSTEM FONT



COMBATING FOUT
BEYOND THE SYSTEM FONT



TAKE IT FURTHER

Styling Condensed Fonts
BEYOND THE SYSTEM FONT



TAKE IT FURTHER
BEYOND THE SYSTEM FONT




SAD CHRISTMAS!
BEYOND THE SYSTEM FONT




TYPE CRUNCH!
BEYOND THE SYSTEM FONT



WINDOWS?

Disable Typekit IE6
Disable Typekit for Windows
Use Google Font API for Windows
BEYOND THE SYSTEM FONT
BEYOND THE SYSTEM FONT
BEYOND THE SYSTEM FONT


USER AGENT
BEYOND THE SYSTEM FONT



FOLLOW THE INDUSTRY

blog.typekit.com
fontsquirrel.com/blog
BEYOND THE SYSTEM FONT



RESOURCES

WEBFONT LOADER:
code.google.com/apis/webfonts/docs/
webfont_loader.html

github.com/t...
BEYOND THE SYSTEM FONT



  THANK YOU!
Upcoming SlideShare
Loading in …5
×

Beyond the System Font - Advanced Web Typography

10,912 views

Published on

  • Be the first to comment

Beyond the System Font - Advanced Web Typography

  1. BEYOND THE SYSTEM FONT by sara cannon / sara-cannon.com / follow @saracannon
  2. BEYOND THE SYSTEM FONT SARA CANNON Scout Branding Company twitter: @saracannon blog: sara-cannon.com
  3. BEYOND THE SYSTEM FONT TYPOGRAPHY
  4. BEYOND THE SYSTEM FONT
  5. BEYOND THE SYSTEM FONT WEB TYPOGRAPHY
  6. BEYOND THE SYSTEM FONT
  7. BEYOND THE SYSTEM FONT ADOBE:
  8. BEYOND THE SYSTEM FONT HF&J NO @FONT-FACE EMBEDDING!
  9. BEYOND THE SYSTEM FONT SITE EXAMPLES
  10. BEYOND THE SYSTEM FONT http://lostworldsfairs.com/
  11. BEYOND THE SYSTEM FONT
  12. BEYOND THE SYSTEM FONT http://www.designmadeingermany.de/magazin/5/
  13. BEYOND THE SYSTEM FONT
  14. BEYOND THE SYSTEM FONT http://sxsw.beercamp.com/
  15. BEYOND THE SYSTEM FONT
  16. BEYOND THE SYSTEM FONT
  17. BEYOND THE SYSTEM FONT http://typekit.com/gallery
  18. BEYOND THE SYSTEM FONT
  19. BEYOND THE SYSTEM FONT “I WANT TO GO BEYOND THE SYSTEM FONT!”
  20. BEYOND THE SYSTEM FONT CUFON / FLIR / SIFR
  21. BEYOND THE SYSTEM FONT FONT-STACKS
  22. BEYOND THE SYSTEM FONT @FONT-FACE
  23. BEYOND THE SYSTEM FONT HAND CODE TYPEKIT FONTSQUIRREL / FONTSPRING GOOGLE API
  24. BEYOND THE SYSTEM FONT TYPEKIT.COM
  25. BEYOND THE SYSTEM FONT
  26. BEYOND THE SYSTEM FONT TYPEKIT HAS 68 PARTICIPATING FOUNDRIES
  27. BEYOND THE SYSTEM FONT ADOBE:
  28. BEYOND THE SYSTEM FONT VEER:
  29. BEYOND THE SYSTEM FONT DEMO
  30. BEYOND THE SYSTEM FONT
  31. BEYOND THE SYSTEM FONT TYPEKIT + MOBILE
  32. BEYOND THE SYSTEM FONT IPHONE ANDROID
  33. BEYOND THE SYSTEM FONT
  34. BEYOND THE SYSTEM FONT
  35. BEYOND THE SYSTEM FONT COMBATING FOUT Flash Of Unstyled Text
  36. BEYOND THE SYSTEM FONT COMBATING FOUT blog.typekit.com/2010/05/19/typekit-and-google/
  37. BEYOND THE SYSTEM FONT COMBATING FOUT github.com/typekit/webfontloader
  38. BEYOND THE SYSTEM FONT COMBATING FOUT TYPEKIT DEFAULT EMBED:
  39. BEYOND THE SYSTEM FONT COMBATING FOUT TYPEKIT DEFAULT EMBED:
  40. BEYOND THE SYSTEM FONT COMBATING FOUT TYPEKIT DEFAULT EMBED: WEB FONT LOADER EMBED:
  41. BEYOND THE SYSTEM FONT COMBATING FOUT TYPEKIT DEFAULT EMBED:
  42. BEYOND THE SYSTEM FONT COMBATING FOUT github.com/typekit/webfontloader
  43. BEYOND THE SYSTEM FONT COMBATING FOUT
  44. BEYOND THE SYSTEM FONT COMBATING FOUT code.google.com/apis/webfonts/ docs/webfont_loader.html
  45. BEYOND THE SYSTEM FONT COMBATING FOUT
  46. BEYOND THE SYSTEM FONT TAKE IT FURTHER Styling Condensed Fonts
  47. BEYOND THE SYSTEM FONT TAKE IT FURTHER
  48. BEYOND THE SYSTEM FONT SAD CHRISTMAS!
  49. BEYOND THE SYSTEM FONT TYPE CRUNCH!
  50. BEYOND THE SYSTEM FONT WINDOWS? Disable Typekit IE6 Disable Typekit for Windows Use Google Font API for Windows
  51. BEYOND THE SYSTEM FONT
  52. BEYOND THE SYSTEM FONT
  53. BEYOND THE SYSTEM FONT USER AGENT
  54. BEYOND THE SYSTEM FONT FOLLOW THE INDUSTRY blog.typekit.com fontsquirrel.com/blog
  55. BEYOND THE SYSTEM FONT RESOURCES WEBFONT LOADER: code.google.com/apis/webfonts/docs/ webfont_loader.html github.com/typekit/webfontloader TYPEKIT FONT EVENTS: gist.github.com/401726
  56. BEYOND THE SYSTEM FONT THANK YOU!

×