Often the subject of fonts and what to use on a website comes up. Any graphic designer used to printing tends to have few thousands fonts they keep in their back pocket but how does this work with a website?

When building a website the main way to create the look and feel that you want the user to see is to write it in a style sheet, these are called a CSS (cascading style sheet).

CSS tells the user browser (such as Internet Explorer, Safari, etc.) how all the parts of the website should look; the browser then converts this into the actual final image the user sees.
So how do fonts fit in?

When a browser doesn’t recognize any font you told it to use it goes back to the basic fonts, in other words if the browser doesn’t recognize that new and pretty font you have no idea what the final user will see.
So there are two options:

1. Include the text in a picture, this option works for elements such as banners but it’s very unworkable for the main text of the website or
2. Use the standard fonts that all browsers recognize.

Here is a sample of the fonts all browsers recognize:

Font family

Font families are groups of fonts that are similar to each other, these are very useful because if a browser doesn’t recognize the first font on the list it will pick the next one and the next one, this allows the outcome of what the viewer sees to be what the designer wanted even if his browser doesn’t have a specific font. These are the main font families:

I hope this helps.