Fonts used in Web pages

There are two main methods of displaying fonts in web pages: using fonts already on the user's device or downloading ones from the web.

Using the first method, if the user does not have the font on their device, the text will display, just not in the font you want. The second method's drawbacks are that the page takes longer to load properly while the font is downloading, and it is more expensive to implement.

Displaying fonts already on the users device

Traditionally Fonts used in web sites were only available from the users device, usually a desktop PC running Windows operating system. This meant that if you wanted Heading One to appear in Arial this would appear fine on a PC as Arial is a PC font. However your Apple audience would likely get the nearest Mac equivalent, possibly Helvetica.

This led to the techinique of using of what became known as "Web Safe Fonts" where a selection of fonts were used (with alternatives for Mac) that should be available on most PCs.

If you opt to use a font that is not a Web Safe Font, it is likely that many users may not have this font available to them. They will instead see the page in whaterver Web Safe Font the designer has specified as an alternative.

Displaying Web Fonts Downloaded from the internet

To ensure that a user has the correct font for viewing a page, it is now possible to link to fonts that are held online.  These are downloaded and displayed in the users browser. This technology has been around for a few years and is growing in use and availabilty. This method allows the use of fonts that would not otherwise be avaible on some devices.

Some of these fonts are free and others come with paid services.

There can be some issues using this technique; particularly a noticeable font switch.  This occurs when the browser displays the page in the failsafe font, and then swithces to the correct font once it has downloadeded.