When I set out on my Photoshop adventure all those years ago, web designers were confined to using ‘Web Safe Fonts’ i.e. fonts that were common across many user’s computers. Type used in designs and websites would reference and use those fonts which were on the viewer’s computer. This left a limited pool of fonts to choose from. The likes of Courier New, Times New Roman, Comic Sans, Impact, Georgia, Trebuchet, Webdings and of course the staples, Arial and Verdana.
There were alternatives available for using fonts in designs which fell outside of the web safe font family. Replacing the text with images was an option and of course ‘sIFR’ (flash based font replacement) for those who remember it. But these were poor alternatives.
Today, thankfully, us web designery types have a host of beautiful ‘Web Fonts’ to choose from. So, what’s a ‘Web Font’? In basic terms a web font allows a designer to use a font within a design which does not also have to be installed on a viewer’s computer. There are many different options but my service of choice is Google Web Fonts.
Typefaces can be broken down into four basic groups:
Serif, Sans Serif, Script and Decorative.
A serif is a small line attached to the end of a stroke in a letter (see image below). A typeface with serifs is called a “Serif” typeface and a typeface without serifs is called “Sans Serif”. Sans is from the French sans, meaning “without”. Sans Serif typefaces can also be referred to as “Grotesque” or “Gothic” and Serif typefaces can also be referred to as “Roman”.
Script typefaces are a form of handwriting or penmanship style and include calligraphy, cursive, and manuscript writing. And finally, Decorative typefaces, also known as ornamental or display typefaces can be artistic and eye-catching in a way different to Serif, Sans Serif or Script. Examples of decorative type fonts include stencil fonts, western fonts and circus font styles.
So here’s my top 11 Google Web Fonts.
SERIF GOOGLE WEB FONTS
SANS SERIF GOOGLE WEB FONTS
SCRIPT GOOGLE WEB FONT