Web-safe fonts

This MedLibrary.org supplementary page on Web-safe fonts is provided directly from the open source Wikipedia as a service to our readers. Please see the note below on authorship of this content, as well as the Wikipedia usage guidelines. To search for other content from our encyclopedia supplement, please use the form below:

Web-safe fonts are those fonts likely to be present on a wide range of computer systems, and are used by web content authors to increase the chance that content will be displayed in their chosen font. If a visitor to a website does not have the specified font, their browser will select an alternative — in the case of dingbat typefaces the alternative is unlikely to have similar characters at the same code points.

Contents

CSS Generic Font Families

The most safe option is to use the generic font families as defined by the CSS. These are: sans-serif, serif, monospace, cursive and fantasy. One of them should always be specified as a last resort for every font-family CSS property. Sans-serif is regularly specified in CSS as the default for generic font families, as sans-serif fonts are more easily readable on screens.citation needed

Examples

sans-serif
serif
monospace
cursive
fantasy

Microsoft's Core Fonts for the Web

Microsoft has started a Core fonts for the Web initiative. However, despite the name, only some of the fonts defined there are web-safe indeed. These are: Arial, Courier New, Georgia, Times New Roman, Verdana, Trebuchet MS (more recently) and Lucida Sans (to some extent).

Examples

Arial
Courier New
Georgia
Times New Roman
Verdana
Trebuchet MS
Lucida Sans
Note: These examples may not display properly in all browsers/operating systems

Unicode Fonts

Only two fonts available by default on the Windows platform, Arial and Lucida Sans, provide a wide Unicode character repertoire. A bug in Verdana (and the different handling of it by various user agents) hinders its usability where combining characters are desired.

Dingbats

No dingbats font, including Webdings, can be considered web-safe.

Workarounds

A common hurdle in web design is the programming of mockups that include non-web-safe fonts. There are a number of solutions for situations like this. One common solution is to "slice" out the text and reference the particular font along with a similar replacement. For instance, if a heading contains a Windows Vista-specific font, the programmer would write the code such that the heading is physical text (rather than an image) and references the particular font. If the font is not present on a viewer's computer, the website falls back on a similar font or set of fonts that are similar or are suitable replacements.

Another practice is to use image replacement techniques. These methods store the text in question as physical text and then overlay the text with an image containing the text typed out in the correct font. This is good for search engine optimization and aesthetic purposes, though the text cannot be selected (for say, copy and pasting). However it should be noted that Mozilla Firefox for instance has the option Copy on the right click contextual menu for a highlighted image which copies the alt attribute to the clipboard.

A new technique in the web design community is the use of Flash-based solutions such as sIFR. They work similar to image replacement techniques, though the text is selectable and rendered as a vector. The downside to this method is that the tools needed to create sIFR files are generally not readily available for free.

This Digital typography-related article is a stub. You can help Wikipedia by expanding it.

External links

Wikiversity
At Wikiversity, you can learn about: Web Design

Wikipedia content modification information:

  • This page was last modified on 29 July 2008, at 22:00.

Wikipedia Authorship and Review

Wikipedia content provided here is not reviewed directly by MedLibrary.org. Wikipedia content is authored by an open community of volunteers and is not produced by or in any way affiliated with MedLibrary.org.

Wikipedia Usage Guidelines

This article is licensed under the GNU Free Documentation License. It uses material from the Wikipedia article on "Web-safe fonts".

The URL for this specific entry is:

All Wikipedia text is available under the terms of the GNU Free Documentation License. (See Copyrights for details). Wikipedia® is a registered trademark of the Wikimedia Foundation, Inc.