Typography is an element in web design that often doesn’t receive much of its deserved attention. It can be considered one of the main pillars of a well-designed website, as it is what defines the level of readability of every page. WordPress themes nowadays have plenty of options to tweak the typography of your site, providing an endless amount of fonts to choose from, and in some cases allowing you to pick the size of the body copy. For instance, our premium themes at CPOThemes come with a set of handpicked fonts from Google Webfonts, which let you set the mood for your site.
Getting the typography right can be difficult to achieve, as it can be tricky to choose a font that goes well with your image and is readable too. We will go over the basics of choosing a proper typeface, as well as explore a few tricks for making your site more readable to the user.
Serif Versus Sans-Serif
First off, it’s necessary to know the difference between Serif and Sans Serif typefaces. For the uninitiated, the term ‘serif’ refers to whether a font has line trailings on the edges of each symbol. From Wikipedia:
In typography, a serif is a small line trailing from the edges of letters and symbols, such as when handwriting is separated into distinct units for a typewriter or typsetter. A typeface with serifs is called a serif typeface. A typeface without serifs is called sans serif or sans-serif, from the French sans, meaning “without”. Some typography sources refer to sans-serif typefaces as “Grotesque” (in German “grotesk”) or “Gothic”, and serif typefaces as “Roman”.
Therefore, font such as Arial or Verdana are Sans Serif, while Times New Roman is Serif. Whether you use a font that is Serif or not can have a great impact on your site, as each one has different levels of readability. They are also chosen depending on the type of site and the intended tone of voice, as they can convey different moods.
When To Choose Font Type
When choosing a typeface for your WordPress site, the basic principle you should act on is that Serif fonts are more legible and readable than Sans Serif ones. This is attributed to the extra amount of detail they normally posess, making each glyph easier to recognize and thus allow for faster reading.
As such, as far as readability is concerned, Serif fonts should be chosen for the body copy. This is not a stric guideline though, and there are plenty of Sans Serif typefaces that are highly readable too. Some examples of great body copy are Open Sans, Droid Serif, or Helvetica Neue. All of them have an appropriate density, and have clearly define symbols that are easy to recognize.
Using The Appropriate Color
Just as it is important to get the right typeface for optimum readability, you should pick the appropriate color as well. Should your WordPress theme allow it, you should focus on choosing a neutral color for your body copy. A grayscale tone is almost always preferred, as it will not distract the user and offer a good amount of contrast. You should aim for a medium amount of contrast, as having it too high or low can make the text hard to read. A good color range to use on a completely white background is #333333 to #666666, as it will provide a nice balance between readability and elegance.
Getting the right typeface often boils down to trial and error, especially when using a WordPress theme with a wide selection of fonts. If needed, don’t hesitate to try different combinations until you reach a satisfiyng result.