Web Design Tips, Tutorials & More!

What fonts combine with what?

When you are using typography, there are certain ground rules people learn to enable them, use fonts with the best effect. The most important thing about the type and using a type on a website is that it needs to be readable.

The way you would start out choosing your fonts would be to decide on what family you want to use. Once you have decided on the family it is a good idea to keep the main section of your website to the 14 pt size. This means it is easy to be read by most people.  You have various families like Roman, which can come in either italic bold and plain ordinary.  Once you have decided on the family of the font you intend to use you decide which weight you are going to use although you can use different weights in different areas. This way you are sure you won’t be clashing in any section of the website.

While this cuts down on any problems it’s not very inspired.  Instead why not try to be a little experimental. Try putting two totally different type faces together. Find two fonts that are totally dissimilar. This actually works very well. Being totally dissimilar means almost a shock system in type and surprisingly they work in harmony most times. The thing is you shouldn’t use too many. I usually keep it to two and no more. Use a san serif with a serif. This works very well. In each kind of out of family combination you can use the same basic design roots of the two. This means they are on the same stem of the family but on a different root.

Try to keep the combination in proportion. This means it’s not a shock in change of size. By using these different proportions in kinds they will still blend together as they have similar heights and widths. This way you keep the rhythm of the type in the web site. The same applies to changing of color on the typeface. By changing colors you will disrupt the harmony.

It is important for the sake of ease of use to keep it simple. The KISS method works very well.  Clutter of fonts is not a good idea. Keep it to a maximum of two.  There really isn’t a need for more except to blow your ego up.  You really use font change to create emphasis more than anything else. Difference in color in typeface can be used to pull attention to something you want your visitors take notice of.

Where you choose to use different fonts is important. This creates an emphasis on an item in the text and also draws attention to the item.

There are several cheat sheets out there that will help you in combining fonts.

Overall your basic sizing of the font should be 14 pt for your normal text and anything above this should only be used as headings.


Leave a Reply