Serif or Sans-serif typefaces, which one is the best? This is one of the most common argument we get to hear in our web design industry. Let’s take a look at this debate.
When it comes to writing large chunks of texts, we are 100% sure we won’t be using the script (too curvy), decorative (too fancy), slab (too loud) or other such typefaces that are just too –much. This is just one of the basics of typography that we are all aware of. Once we’ve realized this (and let’s hope we have), we’re left with only two typeface styles to debate about and wrack our brains trying to decide just the right type (pun alert).
Let’s look at three case studies first:
- Victor says he prefers sans serif for his webpages because he believes it has more legibility, especially on the web. He also says it’s more modern.
- Alyssa says she’d stick to the serif since this traditional type has survived decades and is the type everyone is familiar with. She dismisses the notion that the “screens” have less resolution. Besides, now everyone “owns a smart display”.
- Fan says he’d stick to the classical serif simply because it suits the topic of his webpage (classical).
Although, all three of their viewpoints seem contrasting, and maybe contradictory, all three of them are correct in their own respective situations. Let’s see how.
Sans Serif DOES Improve Readability on a Webpage
Thanks to Matthew Carter and other designers like him who developed a web-specific typeface to address readability issues on screen. The fact of the matter is sans serif typefaces were intentionally created to go with screen display. Also, sans serif is clean, modern, and transferable. A serif typeface is not as transferable as a sans serif as we can observe in the picture below.
Notice how both of those typefaces with the same point sizes appear different. The serif typeface seems to lose quality around the edges since the thin and crisp letters tend to blur. Sans serif, on the other hand, retains quality despite the size. This is fairly useful on the web, since many users nowadays are viewing a multitude of webpage content using small hand-held devices that naturally shrink the text.
Serif is STILL Widely Used
Despite the allegations, serif is still one of the most popular and most familiar type styles of all times. Although it is believed that the serif is suitable on print designs such as magazines, newspapers or billboards, many websites continue to use it without any trouble at all. Look at the example below.
Notice how The New York Times makes use of serif in large and medium sizes for headings and body text. It seems like this typeface is more than something that’s “just good for print”. Additionally, the flat “hooks” and “strokes” of the serif letters actually aid the viewer by making each character more distinctive and thereby guiding the reader through the flow of sentences.
However…The Best Type MAY Have a Lot to Do With the Intended “Mood”
A typeface that looks great on one page may not look so appealing on another. There is a lot to consider when you decide which type to choose and it doesn’t always have to do with “legibility” or “readability”. Now that we have the “size effect” in mind (i.e. serif is best in larger font sizes on the web), we’re left with factors such as “audience” and “intended mood” to consider.
When it comes to web audience, the usual suggestion is to use the simplest typeface so it is easier for users to scan or read the content quickly. Put that way, we can all guess which typeface would win when it comes to “simplicity” –sans serif. Also, young children who are still learning to read or people who have some visual impairment need to be able to recognize letters in print or on screen. Again, sans serif wins here because of its simplistic appearance. It’s best to research your audience before you decide on which type to use.
Another thing to consider is the intended mood or feeling of the text to determine suitability. While serif has traditional and professional appeal, the sans serif typeface has modern and minimal appeal to it.
I can’t argue with the fact that The New York Times page above looks great in the serif typeface in the body text and headings. The designer did a great job of configuring the size and other attributes of a serif typeface to make it easily readable for web audience.
So, which is better? That entirely depends the feelings associated with the subject of the page and the amount of text you plan on placing on your pages. If your design requires small boxes of tiny text everywhere, a serif should aid readability. If you prefer the serif typeface because of the “mood” you want to set, go for it! So, it turns out Victor, Alyssa, and Fan all knew what they were talking about!
Here is an infographic that perfectly summarize the debate on Serif vs Sans Serif.