Make Sure You're Using Web-Safe Fonts

Optimize your site visitors' experience

Close-Up Of Wooden Letters

Daniel Koszegi / EyeEm / Getty Images

Text is one of the most important aspects of a site's look and feel. To ensure your site visitors see your website in the style you carefully designed, choose web-safe fonts.

A Short History of Fonts on the Web

For many years, web designers had to use the few fonts that were found on most computers. These were known as web-safe fonts. You might have heard this term in the past from a web designer as they tried to explain why a certain font could not be used in your site's design.

Web typography has come a long way over the past few years, though, and web designers and developers are no longer limited to a handful of web-safe fonts. The proliferation of web fonts and the ability to link to font files has opened up a new world of possibilities for website font usage. As useful as access to these font choices is, however, those tried-and-true web-safe fonts still have an important place in modern web design.

Various fonts on Mac desktop
Coyote Moon, Inc.

Linking to Web Fonts

To use fonts that aren't typically installed on most computers, either instruct your website to use an external online font file or include the font in your site's assets instead of looking on the site visitor's computer. This gives you almost limitless font choices, but that benefit comes at a price. External fonts need to load on a site, which affects how quickly your site loads.

Thus, web-safe fonts are a good choice if the page load time is a consideration. Because those font files reside on the visitor's computer, there is no performance hit when the website loads. This is why many web designers use a mixture of external web fonts and trusty web-safe fonts in their sites' font stacks. This approach offers the design punch of stylish fonts with an eye toward site performance.

Sans-Serif Web-Safe Fonts

This family is one of your best bets for web-safe fonts. Almost all site visitors will see these in the way you intended. Some common sans-serif web-safe fonts are:

  • Arial
  • Arial Black
  • Tahoma
  • Trebuchet MS
  • Verdana

They're simple, crisp, easy-to-read fonts without ornamentation.

arial

Other sans-serif choices offer good overall coverage but might be missing from some computers. Just remember to include one from the list above in your font stack as a backup.

  • Century Gothic
  • Geneva
  • Lucida
  • Lucida Sans
  • Lucida Grande
Lucida Sans

Serif Web-Safe Fonts

The serif font family is another popular choice for websites. Here are some of your safest bets in serif fonts:

  • Courier
  • Courier New
  • Georgia
  • Times
  • Times New Roman
Courier New font example

Below are some fonts that are installed on many computers but have less overall coverage than the list above. You can use these fonts reliably but should include a more common serif font (from the list above) in your font stack.

  • MS Serif
  • New York
  • Palatino
  • Palatino Linotype
Palatino font sample

Monospace Fonts

Although not as widely used as serif and sans-serif fonts, monospaced fonts are also an option. These feature equally spaced letters and don't have as wide acceptance across platforms:

  • Courier
  • Courier New
Courier New font example

These fonts also have some coverage:

  • Lucida Console
  • Monaco
Lucida Console font example

Cursive and Fantasy Fonts

Cursive and fantasy fonts are not are popular as serif or sans-serif fonts, and the ornate nature of these fonts makes them inappropriate in body copy. These fonts often appear in headlines and titles, and are set in large font sizes for short bursts of text. Stylistically, these fonts might look great, but readability outweighs style on the web.

Only one cursive font is available on Windows and Apple computers (but not on Linux): Comic Sans MS. It's encountered a lot of derision among designers lately, though (mostly owing to its overuse), so avoid it.

Smart Phones and Mobile Devices

If you design pages for mobile devices, your web-safe font choices are variable. For iPhone, iPod, and iPad devices, the common fonts include:

  • Arial
  • Courier
  • Courier New
  • Georgia
  • Helvetica
  • Palatino
  • Times New Roman
  • Trebuchet MS
  • Verdana

Web fonts are an excellent choice for multi-device design. Being able to load external fonts delivers a more consistent look from device to device. You can then temper those downloaded fonts with one or two web-safe choices to get the look and performance your site needs to succeed.