Thursday, April 8, 2010

web safe fonts

Its quite common now days to have custom type face for web design.

These browser supports TTF (true type) / OTF (open type) format:
  • Safari / Webkit 3.1
  • Opera 10 / Opera Mobile 9.7
  • Firefox 3.5 / Thunderbird 3 / SeaMonkey 2
  • Ie9 (maybe?)
  • Chrome 4
While IE 5/6/7/8/9 supports EOT (embeded open type) format.
@font-face will not work on chrome / safari if font-variant is set to small-cap.
Reference: http://webfonts.info/wiki/index.php?title=@font-face_browser_support

As for other browser, you may set alternative font-family of type face web-safe fonts:
Arial, Arial, Helvetica, sans-serifArial, Arial, Helvetica, sans-serif
Arial Black, Arial Black, Gadget, sans-serifArial Black, Arial Black, Gadget, sans-serif
Comic Sans MS, Comic Sans MS5, cursiveComic Sans MS, Comic Sans MS5, cursive
Courier New, Courier New, Courier6, monospaceCourier New, Courier New, Courier6, monospace
Georgia1, Georgia, serifGeorgia1, Georgia, serif
Impact, Impact5, Charcoal6, sans-serifImpact, Impact5, Charcoal6, sans-serif
Lucida Console, Monaco5, monospaceLucida Console, Monaco5, monospace
Lucida Sans Unicode, Lucida Grande, sans-serifLucida Sans Unicode, Lucida Grande, sans-serif
Palatino Linotype, Book Antiqua3, Palatino6, serifPalatino Linotype, Book Antiqua3, Palatino6, serif
Tahoma, Geneva, sans-serifTahoma, Geneva, sans-serif
Times New Roman, Times, serifTimes New Roman, Times, serif
Trebuchet MS1, Helvetica, sans-serifTrebuchet MS1, Helvetica, sans-serif
Verdana, Verdana, Geneva, sans-serifVerdana, Verdana, Geneva, sans-serif
Symbol, Symbol (Symbol2, Symbol2)Symbol, Symbol (Symbol2, Symbol2)
Webdings, Webdings (Webdings2, Webdings2)Webdings, Webdings (Webdings2, Webdings2)
Wingdings, Zapf Dingbats (Wingdings2, Zapf Dingbats2)Wingdings, Zapf Dingbats (Wingdings2, Zapf Dingbats2)
MS Sans Serif4, Geneva, sans-serifMS Sans Serif4, Geneva, sans-serif
MS Serif4, New York6, serifMS Serif4, New York6, serif




No comments: