Disclaimer: This post contains affiliate links.
A few years ago, I looked into optimizing the font, typography, and paragraph spacing on my site to see if it had an impact on my site’s engagement and conversions. And to my amazement, it did.
It is something that is easily overlooked, since most people upload a website theme and accept the default settings.
As a web marketer, it is important to run split tests on a website to see how traffic, engagement, and conversions can be impacted.
- There were a few things that stood out when I ran the experiment.
- The impact from changing the font size
- The impact from changing the font typography
- The impact from changing the line spacing
- The impact of the font’s colour
- The impact of the background colour.
Why did I consider looking into this in the first place?
Originally, my website had an extremely high bounce rate. This was due to a few things, such as the theme that I was using at the time and its default settings.
The second was that I found people weren’t engaging with the content as well as they could have been. Which is when we started to run the split tests and looked into case studies where others had run similar tests and the results that they had achieved.
After running our own tests, we did see the bounce rate drop and engagement with the website increase.
What are some changes that you can make?
Line spacing
The amount of space between the lines can make it easier for people to scan and engage with the content that’s been published on the web page. Experiment with single line, 1.5 line and double-line spacing to see how it impacts engagement and time on site on your web page.
Paragraph digestibility
The last thing people want to read is a “Wall of text” when they visit a website. So paragraphs need to be published in a way that will keep the reader engaged.
A rule of thumb is to keep paragraphs to an average 3 lines, so it is easy for people to scan.
Paragraph width
You will also need to consider how wide the paragraphs on your web page should be to make it easy for the reader to engage with. I personally like 715px, however you should test the width to see what your audience engages with best.
Text alignment
You will need to test the ease of reading with your audience. In the English language, people read from left to right. So it is usually better to align paragraphs from left to right instead of having the paragraph aligned right to left or even centered.
The alignment will depend on the reading actions that you want the reader to take. So experiment with the alignment to see what generates the optimal result.
Text size
The minimum text font size that you should use on the web is 16px. This will make it easier for the reader that is engaging with the content on the web page.
You may experiment with other font sizes, such as 17, 18, or even 20px, depending on the type of typography that you use on the web page.
Test it to see if it impact’s engagement and conversions on the site.
[1,2]
Keep in mind the insight from usability expert Oliver Reichenstein says in “The 100% Easy-2-Read Standard”
[16 pixels] is not big. It’s the text size browsers display by default. It’s the text size browsers were intended to display… It looks big at first, but once you use it you quickly realize why all browser makers chose this as the default text size. [3]
Text colours
There isn’t just one colour that appeals to everyone. You should test different colour grades on certain parts of your text (or even the overall text) to see what kind of impact it has on your web page’s performance.
I usually stick to black text on a white background because it tends to work well for my campaigns. There are different grades of black and white that can be tested. I aim for the content to be as easy to read and engage with as possible. And I find that this combination tends to make it easy for the reader to scan and engage with the content on the web page.
Beware of fonts loading times.
One of the things with fonts is that they can add to the loading time of your web pages. So you want to
Cory Rylan shares insights in a typography case study test, in which he explains how he optimised the CSS loading for fonts that display on websites that he manages so that the sites can load as quickly as possible.
If you are looking for a WordPress solution, you can also check the insights from Specky Boy.
You can also learn more about font optimisation from Google’s Developer’s platform.
[4]
You need to have web traffic to test this.
You will only be able to get conclusive results if you already have web traffic going to the page. So look through your analytics to see which web pages are getting traffic, or pay for traffic to a web page and split test different versions of the page to see what the results are.
Once you have the results from the data, implement the result that had the most success.
Why should you prioritise optimising your typography, fonts, and paragraphs?
The optimisation changes will allow you to retain more traffic that hits your web page.
This increased engagement can have an impact on conversions, which will boost the revenue and profit for your web business.
The engagement improvements will also help to boost the SEO performance of the web page.
Conduct your own testing and share the results of your test in the comments below.
Thanks for reading.
References
[1] Conversion XL – The Effect of Typography on User Experience & Conversions
[2] Smashing Magazine – 16 Pixels Font Size: For Body Copy. Anything Less Is A Costly Mistake
[3] The 100% Easy-2-Read Standard – Oliver Reichenstein
Recommended web design resource: Design habits of businesses experiencing hypergrowth
Want to improve your conversions? Click here to start increasing your conversions with the insights from Conversion XL.
Join the newsletter
Get updates that will allow you to grow your website's income over the next 12 months.
Pingback: Get your site ready for mobile SEO? (Essential Mobile-first SEO tips!)