Tag Archives: font hosting

Websafe Fonts and Other Options

[quotes_right]

  • Arial, Helvetica, sans-serif;
  • ‘Arial Black’, Gadget, sans-serif;
  • ‘Bookman Old Style’, serif;
  • ‘Comic Sans MS’, cursive;
  • Courier, monospace;
  • ‘Courier New’, Courier, monospace;
  • Garamond, serif;
  • Georgia, serif;
  • Impact, Charcoal, sans-serif;
  • ‘Lucida Console’, Monaco, monospace;
  • ‘Lucida Sans Unicode’, ‘Lucida Grande’, sans-serif;
  • ‘MS Sans Serif’, Geneva, sans-serif;
  • ‘MS Serif’, ‘New York’, sans-serif;
  • ‘Palatino Linotype’, ‘Book Antiqua’, Palatino, serif;
  • Symbol, sans-serif;
  • Tahoma, Geneva, sans-serif;
  • ‘Times New Roman’, Times, serif;
  • ‘Trebuchet MS’, Helvetica, sans-serif;
  • Verdana, Geneva, sans-serif;
  • Webdings, sans-serif;
  • Wingdings, ‘Zapf Dingbats’, sans-serif;

[/quotes_right]

Websafe Fonts

If you don’t use an HTML editor that readily reminds you of all available websafe fonts it can be hard to remember those. Here is a list of several sites that have some good reference info on this.

www.ampsoft.net/webdesign-l/WindowsMacFonts.html
www.w3schools.com/cssref/css_websafe_fonts.asp
www.fonttester.com/help/list_of_web_safe_fonts.html
web.mit.edu/jmorzins/www/fonts.html

Font Hosting Sites

Another thing to note is that if you need something a little more specific than the typical websafe font and don’t want to embed it all in a graphic, there are several font services — some free and some paid — that will serve the fonts to your website on demand.

Essentailly, all you do is put a link tag in the header of each page on which you use the font (<link href=”” />) and pull in the font as people visit your pages. Then you just call out the font in your CSS class (in your style sheet, within the <style></style> tags on your page, or inside of the style=”” attributes) like you normally would. Here are some places to find these.

Google.com/webfonts (www.google.com/webfonts)
Fonts.com (new.fonts.com/)
TypeKit.com (typekit.com/)