Last week, I did a deep dive into all the different reasons why scannability is essential for well-performing websites. Now, it’s time to give you a rundown of some of the most important tips and tricks I use when I want to improve scannability.
They are:
- Cut down your content
- Use visual hierarchy in typography
- Use the introvert pyramid writing method
- Break up the content with whitespace and images
- Embrace scanning pattern conventions
- SEO friendly content writing tips
1. Cut down your content
Cutting down the content should be the first thing on your list if you want to improve scannability. Decreasing the copy on a page will improve scannability and the overall user experience of the page. It’s the easiest way to enhance the experience for your visitors. After all, the less there is for people to read, the more likely they will read and consume the content.
“If something requires a large investment of time — or looks like it will — it’s less likely to be used.”
Steve Krug, Don’t Make Me Think
It’s a sign of quality writing when you get to the point as quickly as possible. Which further improves your overall impression. Keep your messages on point by removing as much content – and copy – as possible.
“Get rid of half the words on each page, then get rid of half of what’s left.”
Steve Krug, Don’t Make Me Think
One idea per paragraph
One great pro-tip when it comes to quality writing for the web is to keep one idea per paragraph. Web paragraphs are typically much shorter than traditional essay or book paragraph. Use this to your advantage. Cover more points quicker.
(Click on the image to zoom.)
2. Use visual hierarchy
There are a variety of different design concepts you can leverage to improve scannability. When the size, color, or font-weight clearly indicates the most important element, it’s easier for a visitor to scan the key pieces of information. If everything on this page were the same, nothing would stand out, and you couldn’t scan the headlines. To improve scannability, use these elements strategically to break up chunks of texts and highlight key pieces of information.
(Click on the image to zoom.)
Blogs are a great example of visual hierarchy. You can always quickly identify what the titles and headlines are. And, you can instantly scan blog posts to get a general idea of what’s discusses. The same concepts can be applied to landing pages, homepages, etc.
Number your main points such as headlines
Another quality pro tip is to use numbers in your headlines. They have been proved to improve scannability and readability. Numbers capture attention and keep the reader oriented.
3. Use the introvert pyramid writing method
The inverted pyramid comes from journalism and news reporting. It has become a highly popular method in online writing too.
The concept is simple, you provide the most crucial information first to grab people’s attention. You answer the questions of Who? What? Where? When? How? and Why? to provide the reader with the information they need to know first. Only then you provide the additional and trivial details as you continue writing, eventually getting to the least important information that would be ‘the nice to know stuff‘ – such as background information.
“[The introvert pyramid] format is valued for two reasons. First, readers can leave the story at any point and understand it, even if they do not have all the details. Second, it conducts readers through the details of the story by the end.”
Wikipedia
The inverted pyramid is a preferred writing method online. It allows the visitor to quickly scan the top of the content to get a general idea. This lets the visitor decide whether or not they found the right information and should continue reading. It also emphasizes that vital information will be easiest to locate, such as through headings.
Fun fact: The term “bury the lead” comes from writers not using the inverted pyramid method and so not including the attention-grabbing and vital elements of the story in its opening paragraphs.
4. Break up the content with whitespace and images
Images, photos, and illustrations are your friends! Images improve communication with readers and visitors. First of all, they communicate points and ideas much quicker than words. Second, they help the reader visualize points and ideas too. Third, they’re great for added context and improved clarity.
Graphic elements especially are a fantastic tool for breaking up content. Simple visual cues like arrows, spirals, or patterns help in guiding a person’s eye around a page. At the same time, photographs or illustrations are great in making a point visually instead of verbally.
“Long spans of dense text are daunting and unapproachable to readers. Write short headings, short sentences, and short paragraphs that are easy to read—and more visually appealing.”
Microsoft, Scannable Content
Whitespace has a similar effect as images since whitespace also helps break up the content. Designers use whitespace to create page sections and/or to guide a visitor’s eye. Cluttered designs are intimidating and daunting. They force a visitor to put in mental effort in making sense of it which they never are willing to do. Naturally, it’s just about impossible to get a visitor to reading anything if there is no spacing around words. That’s because you’re making them work. Which they won’t do because they don’t have to. So, they will bounce.
But, if there is plenty of white space and graphical elements to make the reading experience smoother, the visitor will, in fact, stick around to hear you out. All this further improves scannability too.
5. Embrace scanning pattern conventions
There are several common scanning patterns, such as:
Simply put, designing a layout that will fit into one of those patterns will ensure your visitors will have a much easier time scanning your page. Whereas a layout, no matter how creative, that makes it difficult for visitors to scan, will get in the way and negatively influence the user experience and website metrics. Using traditional web conventions helps improve scannability too.
6. SEO friendly content writing tips
Lastly, let me give you a few pro tips for leveraging a few tricks that will improve scannability and your SEO results.
- Use bulleted or numbered lists
- Emphasize with bold or italics
- Use subheadings
Search engines, like Google, factor in user experience into their SEO rankings. People are more likely to read bolded texts or a list than a paragraph of text because they stand out. It goes back to the visual hierarchy from the second tip. These three ideas improve scannability which also improve the overall experience. Those two factors also positively affect your SEO rankings.
Additionally, SEO spiders understand that subheading, bolded texts, and lists are created for emphasis. That’s why the information – and the keywords found within them – are more heavily weighted by search engines as well.
The takeaway
Frankly, I could go on with more tips to improve scannability. Scannability is a critical aspect of a high-quality website. The above six tips are a great starting point. Use these points to evaluate whether or not your website’s scannability can be improved further.
