Fonts
Fonts on the Web
When a viewer is visiting a website, their browser applies the websites font from the viewers computers font library. If the viewer does not have the correct font installed, a substitute default font is used.
For this reason custom fonts are not common on the web and it is best practice to design your website around web safe fonts - fonts that nearly every computer has installed. There are some solutions around this problem as described below. Web Safe Fonts
| Font Name: (PC / Mac) | Font-Family |
| Arial, Arial, Helvetica | sans-serif |
| Arial Black, Arial Black, Gadget | sans-serif |
| Comic Sans MS, Comic Sans MS5 | cursive |
| Courier New, Courier New, Courier6 | monospace |
| Georgia1, Georgia | serif |
| Impact, Impact5, Charcoal6 | sans-serif |
| Lucida Console, Monaco5 | monospace |
| Lucida Sans Unicode, Lucida Grande | sans-serif |
| Palatino Linotype, Book Antiqua3, Palatino6 | serif |
| Tahoma, Geneva | sans-serif |
| Times New Roman, Times | serif |
| Trebuchet MS1, Helvetica | sans-serif |
| Verdana, Verdana, Geneva | sans-serif |
| Symbol, Symbol | Symbol |
| Webdings, Webdings | Webdings |
| Wingdings, Zapf Dingbats | Zapf Dingbats |
| MS Sans Serif4, Geneva | sans-serif |
| MS Serif4, New York | serif Custom Fonts as Images |
A common practice is to place a transparent PNG of text in your desired font to replace the standard heading. This is not the best solution as search engines such as Google do not read graphics and the page can also take much longer to load.
Also clients are not able to change the text of the graphic easily unless they have appropriate graphic software and the knowledge to use it. Custom Fonts in CSS
It is possible to include a custom font so that the font is read from your website and not applied from the viewers computer font library. However, every font comes with copyright, even the free ones. There are very few publishers who allow there fonts to be used in this way as it is easy for individuals to copy the font into their own font library. Custom Fonts using Typekit
Typekit provide a large library of fonts that can be used on your website. They store the font files on their own servers. With a little bit of script on a website, it generates the correct font in a way that cannot be copied.
This is a great solution to the web's font problems, however, a live preview is not displayed until the save button is pushed when editing the font. More information and pricing can be viewed at typekit.com.