Web Design 101: How Typography Affects Conversions

 
As an Internet marketer, conversion is our bread and butter. I can guarantee you spend a large part of your time pondering ways to optimize landing pages. Things like copy and design are the obvious features we all like to play around with.
 
But there is one element often underestimated in its affect on conversions.
 
I am talking about typography.
 
For most marketers, it is an unknown topic, but its importance in marketing has been scientifically proven. In this article, we are going to take an in-depth look at the world of typography and its ability to affect conversions.
 
So, consider your landing page. If, despite a powerful headline and a design structure that perfectly exemplifies all the important elements in your copy, you are failing to see any kind of substantial conversions, then please do read this article through to the end.
 
What is Typography?
 
Simply put, typography is where art meets text. It refers to the arrangement of type. It originated after the invention of movable type in the mid 15th century. Typography is a tool through which you can add personality and style to your text.
 
When visitors open your sales or landing page, the very first thing that happens is they look at the page as a whole. They scan how the information is presented, how the text looks, the size of the letters, the length of the lines etc., after which they unconsciously judge the likelihood of finding the solution to their problem on your website, based on the way the words appear on your page. It all happens within seconds. We all do it!
 
Understanding typography can help here. It is a tool that makes it easier for the reader to grasp and comprehend the information you are trying to convey.
 
Key Elements of Typography
 
There are several components that make up the art of typography. Let’s look at the primary elements:
 
Typeface – Typeface is not the same thing as font. It refers to a group of characters, letters and numbers that share the same design. For example Garamond, Times, and Arial are typefaces, not fonts – a very common misconception.
 
Fonts – A specific style of typeface with a set width, size, and weight. For example, Georgia is a typeface; 9pt Georgia Bold is a font. People in the type design community consider a font to be the delivery mechanism and a typeface to be the creative work.
 
Line Length – This refers to the distance occupied by text that is present between the right and left margins in one line.
 
Leading – It is the space between baselines (the lines upon which letters “sit”) and is expressed in points.
 
Kerning – This term refers to the white space between individual characters or letters. Many fonts come with a default kerning value that is best suited to make the space between letters look more natural.
 
Tracking – Also known as letter spacing, it is used to adjust the space uniformly over a range of characters. Tracking can affect the character density of the passage.
 
Why is Typography so Important?
 
If your copy is hard to read because the individual letters are too close together, the typeface size is too small, or the words are so close together that people find it hard to distinguish one word from the other, then your visitors will act in one of two ways.
 
They will either leave, causing your conversion rate to drop, or they will stay and struggle through the copy, most likely not reaching the end because it is exhausting. Afterward, what the visitor will remember is not the message you are trying to get across, but the effort it took to understand the copy.
 
Typography is crucial because it can make the whole process of understanding and comprehending information effortless. A typographically well-formatted copy ensures that the focus remains on the content and not on the effort required to read it.
 
If you study how humans read the web, a reading pattern is clearly evident. This pattern can be modified, but only with the help of a visual hierarchy. Typography can help you create a visual hierarchy by making the more important elements stand out through size, color, or style. For example, an excellent way to present benefits or product features is with bullets.
 
To truly master the art of creating the perfect visual hierarchy, we need to first understand how people organize and perceive information, and Gestalt’s Principles of Perception explain this very well.
 
As humans, we love to organize everything. This habit is as ingrained in our human psyche as perceiving faces in inanimate objects. Gestalts theory states that humans organize visual elements into groups based on five contexts:
 
Similarity
 
Continuation
 
Closure
 
Proximity
 
Figure and Ground
 
Now, for example, if you want to apply Gestalt’s theory in your copy, you could use the principle of similarity and make all of the elements on a page visually similar, except the call to action, which you could make different, causing it to stand out.
 
When organizing text, your goal should be to make the cognitive process of retaining information easier. You want to make sure that the “parts” which need the most attention are prominent.
 
What Does the Research Show?
 
In July 2012, Errol Morris ran an experiment in The New York Times titled “Are You an Optimist or a Pessimist?” Readers were presented with a passage from David Deutsch’s book The Beginning of Infinity. The passage was followed by two yes-or-no questions asking readers whether they supported Deutsch’s claim and how confident they were in their answer.
 
Here is the interesting part. Morris was not interested in what people thought about Deutsch’s claim or whether they were optimists or pessimists. He actually was interested in knowing if a typeface could influence how people perceived the presented information. In other words, can a typeface affect the credibility of written text?
 
What the 40,000 participants didn’t realize was that, while they were all presented with the same passage, it was in different typefaces. Six typefaces were utilized in this experiment: Baskerville, Helvetica, Comic Sans, Computer Modern, Georgia, and Trebuchet.
 
The results showed that statements in Comic Sans inspired the highest amount of disagreement. Helvetica was not far behind. They failed to ignite the believability factor with the readers.
 
The results showed that people were more likely to agree with the statement when presented in Baskerville.
Lesson for Internet Marketers
 
Here is what David Dunning, the psychologist who helped construct the aforementioned quiz, had to say about why Baskerville won:
 
“Fonts have different personalities. It seems to me that one thing you can say about Baskerville is that it feels more formal or looks more formal.”
 
Now take a look at your sales page. Does your font correctly reflect the message you are trying to portray? Think about your niche. Does your audience require a formal tone, and, if so, how well is your font setting that tone?
 
Does Font Size Matter?
 
To find out whether font size matters, Michael Bernard of Usability News (produced by the Software Usability Research Laboratory at Wichita State University) conducted a study comparing 8 popular online typefaces: Courier New, Georgia, Arial, Century Schoolbook, Times New Roman, Comic Sans, Tahoma, and Verdana. They were analyzed at 10, 12, and 14 point sizes. There were a total of 60 participants in this study.
 
Here is what they found: Verdana, Arial, and Comic Sans were the most preferred fonts at 10, 12, and 14 point sizes, respectively.
 
Texts in Times New Roman and Arial were read the fastest; and, even though the data showed that larger typefaces were more readable, the result was not statistically significant.
 
The study also showed Arial and Courier were the most legible typefaces, and Comic Sans was the most illegible one. Furthermore, Tahoma was found to be most legible at 10 point size, Courier at 12, and Arial at 14.