For many years now, it has been widely accepted that you should only use web-safe fonts on your website. Web-safe fonts are fonts that are widely available for use among the various operating systems. This includes fonts such as Arial, Times New Roman, Georgia, Lucida, and more. Below is a more complete list of web-safe fonts from Windows, as well as their Mac equivalents.
Windows Fonts |
Mac Fonts |
Arial | Arial, Helvetica |
Arial Black | Arial Black, Gadget |
Comic Sans MS | Comic Sans MS |
Courier New | Courier New |
Georgia | Georgia |
Impact | Impact, Charcoal |
Lucida Console | Monaco |
Lucida Sans Unicode | Lucida Grande |
Palatino Linotype | Palatino |
Tahoma | Geneva |
Times New Roman | Times New Roman, Times |
Trebuchet MS | Trebuchet MS |
Verdana | Verdana, Geneva |
MS Sans Serif | Geneva |
What are my other options for fonts on the web?
Up until recent years, you could use other fonts, but other people would not be able to see those fonts on your website unless they had those fonts installed on their computers. This extremely limited the flexibility of website designs.
Now, there are many different methods for using custom fonts on your website, each with their own advantages and disadvantages.
Font Squirrel
Font Squirrel offers a quality selection of fonts that are freely available to use on your website. They even provide you with @font-face kits, which are zip files with everything you need to put the fonts on your website, including the appropriate file formats, the required CSS, and a demo file so you can see what the font will look like when viewed in your web browser.
Pros
- Free
- Very few or no licensing restrictions on most fonts
- No bandwidth or page view limit
- Offers a @font-face kit generator
- Quality not reduced by compression
- Does not require Javascript
- Hosted on your site
- Downloadable fonts to use in your concepts
- Fonts embeddable with CSS @font-face
Cons
- Relatively limited selection (does not include any commercial fonts)
- Does not offer well-known commercial fonts from Adobe and other foundries
Google Font API
Google offers an easy and free method to embedding fonts in your website through the Google Font API. Many of these fonts can be embedded at higher quality by using Font Squirrel, but Google is a great alternative for many that do not have the option to embed their own fonts using CSS and Font Squirrel.
Pros
- Free
- No licensing restrictions
- No bandwidth or page view limit
- Does not require Javascript code
- Loads fast
- Flexible embedding options
- Downloadable fonts to use in your concepts
- Can serve fonts over SSL
Cons
- Relatively limited selection (does not include any commercial fonts)
- Quality reduced due to compression
- Does not offer well-known commercial fonts from Adobe and other foundries
TypeKit
TypeKit was one of the first font services dedicated to serving custom web fonts to the masses. It boasts a selection of high quality fonts from well-established foundries, and includes many of the fonts that are available from Adobe, such as Futura, Myriad Pro, and more.
Pros
- Offers a Free option for smaller sites with limited custom font usage
- Paid plans are cheaper than other premium web font services, starting at $25/yr
- Quality not reduced by compression
- Offers well-known fonts from Adobe and other type foundries
- Can serve fonts over SSL
- Loads fast
Cons
- Plan pricing is based on page views
- Requires Javascript code on your site
- Kit Editor is easy, but has a bit of a learning curve
FontDeck
FontDeck is another subscription web font service that lets you pay only for the fonts you need and the bandwidth you use. Font prices start at $2.50/year (typical is about $7.50/year), and with that you get a very generous 1,000,000 page views per month limit. If you go over 1,000,000 page views per month (which is pretty rare), prices for additional page views start at $40 per month. This is by far one of the best font hosting options out there for businesses that needs a quality font and doesn’t get more than 1,000,000 page views per month.
Pros
- Large selection of fonts
- Offers some well-known fonts from Adobe and other type foundries
- Does not require Javascript code
- Quality not reduced by compression
- Flexible embedding options
- Can serve fonts over SSL
- Loads fast
Cons
- Can be costly if you have over 1,000,000 page views per month
FontSpring
Like FontDeck, FontSpring allows you to pay only for the fonts you use. However, there is only a one-time fee for the fonts you use, as opposed to a yearly subscription for each font. In addition, there are no page view or bandwidth limits since the font will be hosted on your own web server. Because of this flexibility, the fonts on FontSpring can be costly. We recommend this option for websites that plan on keeping the same design or fonts for over 3 years, depending on the price of the fonts and the expected traffic.
Pros
- Very large selection of fonts
- Does not require Javascript code
- Quality not reduced by compression
- Fonts embeddable with CSS @font-face
- Does not require Javascript code
Cons
- Does not offer well-known commercial fonts from Adobe and other foundries
- Can be expensive compared to other services, depending on usage needs
Conclusion
These web font services offer a range of flexibility depending on your needs. We recommend all of our clients to look at these services and the fonts they offer to decide which service is the best choice for their needs. If you are on a low budget, we highly recommend looking at FontDeck, TypeKit, and FontSquirrel. The Google Font API may be free, but in many cases the compression of the fonts degrades the quality. If you find a font you like on the Google Font API, look for that font on FontDeck, TypeKit, and FontSquirrel. There may be a slight file size trade-off, but the quality increase will be worth it in most cases.
Want to know what else Atomic can do for your business? Give us a call at (972) 668-3867.
Need Specific Help?
Interested in a specific topic? Review the topics below to get the info, news, and tips you need!