Content

4 tips to improve your web content

On average, visitors read only about 25% of the content on a webpage. Turn that around, and it means that 75% of the content you publish is essentially being missed. That’s not how it should be. Here are 4 tips to help you improve your website content.

Readable text, a clear structure, and visual elements that capture the user's attention can be crucial in determining whether someone stays on a website or moves on. And of course, the content itself needs to be relevant to the user. When you understand how people read and behave online, you can optimize your website and influence how users consume your content to a much greater extent. So let’s start by looking at how users actually read on the web.

How do users read on the web?

Most people can write, but expressing oneself and communicating to reach your target audience is not always that simple. The first thing to keep in mind is that users are much more likely to skim a text on the web than if they had read the same text in print. Their eyes jump around and scans a text to see if they find anything interesting. If they don't, they move on. When designing content for the web it's important to be clear and capture the reader’s attention quickly. The content experience consists of small components, everything from headlines and images to tone of voice and emotional cues, which together create an overall positive experience of the content.

Many may design their content based on how we read on a computer, but we mustn't forget how it looks on mobile. On mobile, people read somewhat differently compared with on a computer. Many, for example, are often on the move and have more distractions around them when they read on their phones. Having a simple, easy-to-read design that manages to capture and hold users' attention is therefore even more important. There are several ways to make your content more readable and get users to engage with it to a greater extent. Here are some tips to help you:

How to improve your web content:

1. Understand common reading patterns and take advantage of them

In studies using eye tracking, where the technology records and measures the user's eye movements when they visit a webpage, it has been observed that our eyes move in specific patterns depending on the type of webpage we are looking at

On pages with less text and only a few selected key elements, users have been seen to read in a Z-shaped pattern. Facebook's login page has taken advantage of this behavior. The visitor to the site begins their scanning at the logo in the top-left corner, then their gaze scans across the navigation in a horizontal line until it reaches the login button at the far right. Because in Sweden we read from left to right and from top to bottom, the gaze moves to the next line or element further down to the left. Finally, the gaze moves down to the bottom-right corner where a clear call to action to create an account has been placed

Z-pattern reading

On a webpage with a lot of body text, it has instead been observed that a majority of users read in an F-shaped pattern. They read the top lines and then skim more and more the further down the text they get. If you were to design your content according to the F-shaped reading pattern, for example, you could place the most important information high up on the page. Even in mobile we have a tendency to read in a more F-shaped pattern. There isn’t enough space to scan to the right and down (the Z-shaped pattern), rather it is the center of the screen that draws the eye If you want to change or influence any of the known reading behaviours you must adapt the content in a way that captures the reader’s attention inward into the text and further down the page. And that brings us to the next tip.

F-shaped reading pattern

2. Capture the reader's attention

When you structure content the right way and, for example, include graphic elements, you can change focal points and users' reading patterns. You create a visual hierarchy and in this way you can guide the user through an information hierarchy. It's not about tricking users into doing something, but about serving them what made them land on your site in the first place - by having the right things in the right place.

In general, people are more likely to fixate on particular scanning points or elements that stand out. These can include, for example, headings, leads, bulleted lists, new paragraphs and white space. Text that stands out because it is highlighted with color or typography—such as link text, captions or bolded words—can also be useful. It has also been observed that numbers placed within body text can draw the eye when scanning a webpage. By using different scanning points, you can thus draw readers into the text or down the page.

In our article - 5 tips for writing good headlines for the web - we give concrete tips and explain how to actually write a strong, effective headline.

Scanning points that attract the reader:

Headings
Leads
Bulleted lists
New paragraphs and white space
Calls to action
Text and words that stand out (e.g. through color, typography, link text, captions, bolded words, images, numbers)

How you use scanning points also matters. For example, it's important to choose the right kind of typography and pick a typeface and font size that offer good readability. For today's responsive web it's important to test that the fonts work well at different resolutions and screen sizes. There are also other aspects to consider from an accessibility perspective. For those with poorer vision or who for other reasons have difficulty reading on small screens, it's important that the fonts you choose can be enlarged. Language and how you phrase things also play a major role for readability. It's also about finding a good balance among all components. If you overload a text or page with too many different elements there's a strong risk that readability will still be lost. Moderation is simply best! People used to talk about the importance of "above the fold" and that users don't scroll. Although the area above the fold is still important, you can, with the help of scanning points, encourage the user to scroll and move further down a page

Generally people are more likely to notice particular scanning points or elements that stand out

3. Choose the right images and graphic elements

The choice of images and their placement also affects how visitors consume the content on your website. The right image in the right place, the image quality and what the image depicts can make or break even the most well-planned and structured site.

Images evoke emotions that affect the customer experience and how we act. For example, it has been shown that images of people facing the reader are perceived as more inviting. You can also direct attention to a specific part of the page if the person in the image is looking in a certain direction

If we also use images together with selected components, we can encourage action and increase conversions. You can also use moving material in the form of video to draw the eye and give an impression of what something is like

Things to consider when choosing images for the web:

Subject and composition - what does the image depict? The subject should be relevant to the product, service or your brand. Don’t include an image just because it’s cute, it must serve a purpose. Keep the composition simple and clear. If you are showcasing product images, a white background is, for example, a good choice

Placement - how is the image placed in relation to other components? Does the image’s subject lead the viewer’s eye in a certain direction, and if so, what is placed there? Use images to break up blocks of text and make them easier to read

Emotions - what feelings does the image evoke? Joy, compassion, surprise, security, etc. Consider what feelings you want to give your visitors and find images that fit that purpose

Sharpness and exposure - how sharp is the image? Pixelated or blurry images rarely appear professional, so make sure the image has good focus. Our best tip is to learn to take good photos yourself or hire a photographer

4. Remember that readability goes hand in hand with SEO

Designing readable texts is partly about clear typography, paragraphs that break up the text and graphic elements that catch the eye. But readability also goes hand in hand with search engine optimization. You may have heard that Google’s algorithm mimics our reading patterns? Google evaluates your website based on how usable and relevant it is to the user. Pages that are judged most relevant to the user and that best match the search term rank higher in the search results. A good idea is therefore to place search phrases, for example in headings, bullet lists or at the start of a new paragraph, which are also focal points for users’ reading behaviour.

In our article “5 things you must know about SEO” you’ll find more tips on how to optimize your website using SEO.

You’ve now received a few tips on the way to more user-friendly and readable content for your website. Also take a look at your own site — how are the pages and their content designed? Do they support users’ reading behaviour? Are you using any of the scanning points or can you change, remove or add something that makes readability easier?