Website Fonts
Question: Why is our website not displaying with the right fonts?
Answer: A web browser as an application that runs on the visitor's computer. The fonts that it has access to are the ones installed on that machine. Therefore, although your graphic designer may have chosen to make your page mock-ups look fantastic using some funky fonts, that is of no use unless those fonts are installed on the visitor's computer. As a result, it is necessary to specify a sequence of fonts in order of preference, e.g.
font-family: Trebuchet,Verdana,Arial,Helvetica,sans-serif;
so that the browser will work its way through the list until it finds one that is installed.
Question: OK. So which fonts are installed on everyone's computer?
Answer: None. But all computers have an implementation of a serif and a sans-serif font.
Longer Answer: There are many fonts which are common to a specific Operating System, e.g. Windows machines, or all OSX machines, but there are an increasing number of visitors using a variety of other systems and devices, e.g. Linux, Solaris, Unix, Psion and various handheld devices. The truth is that the browser pool is diversifying.
Microsoft did start a project called "core fonts for the web" in 1996 with the aim of promoting a standard set of 10 fonts to be found on all web browsers. They went most of the way towards making the fonts public domain, but abandoned the attempt in 2002. Some have criticised this action as yet another attempt to resist computer inter-operability, which is certainly not in their long term interests.
The plain fact is that most fonts out there that people have heard of are copyrighted, and therefore need to be licensed, and royalties must be paid. Whilst this situation persists, there will be no common ground for fonts on browsers.
Question: Why not just use graphics instead?
Because graphics are not text, and they will make your web pages inaccessible to both humans and search engines. Replacing text with graphics in order to get a prettier font is just an example of bad web design. Text is crucial on a page. If it can be selected with a mouse one character at a time, then a search engine will be able to read it, and that means that people will be able to find you. Sure, there are alt attributes that are designed to help, but that's all they can do: help. They can't compensate for the fact that the text is missing and has been replaced with an image.
To see how your website looks to a blind/visually-impaired person or a search engine (they are very similar!) switch off all your images and disable all your styles (alternatively, visit your site in a text-only browser, e.g. lynx). If you can still use the site, then you are accessible.
Question: What about the future?
The World Wide Web Consortium have been talking about having downloadable fonts for some time, but seem no closer to making a decision about anything. Even if downloadable fonts are included in CSS3, it could be several years before a sufficient percentage of visitors have the capability to make it worthwhile. There are still many corporations who have yet to upgrade to IE7.
Scalable Inman Flash Replacement
A new open-source project has started up with the aim of permitting designers to replace actual text elements on a page with Flash equivalents, using any font. To quote from Wikipedia:
"The new technology requires JavaScript to be enabled and the Flash plugin installed in the reading browser. If either condition is not met, the reader's browser will automatically display traditional CSS based styling instead of the sIFR rendering. sIFR is not designed for body copy text as rendering greater bodies of text with Flash place formidable demands on the computer"
This sounds like it could be ideal for replacing headline fonts and menu items, but we have yet to see how it will work in practice.
| More Information | http://en.wikipedia.org/wiki/Core_fonts_for_the_Web |
| http://en.wikipedia.org/wiki/Scalable_Inman_Flash_Replacement | |
| Solution | For the moment just specify either 'serif' or 'sans-serif' |