In our real-time world the web is the place to look for information – this also applies for your corporate reporting audience: “88% of capital market stakeholders read the annual report from a screen as PDF or interactive online version”. (Comprend Capital Market Report 2015)
Despite the fact that information is predominantly received on screens most of today’s reports are still not designed for screen reading. This article outlines major differences of how content is received on a screen device compared to a hard cover print approach and hints on how to enhance screen readability of your reporting content.
Linearity of content
Printed reports often follow a linear thinking due to perception of being a linear medium.
Print publications are explored in a linear order, receivers tend to read from front to back. This behaviour is adopted from traditional books, where an arc of suspense is built in order to engage with readers. Similar to a film, this helps telling a linear story. On the web this linearity is discontinued! Web users select their individual way and make deliberate decisions what to read and where to continue. Neither a single starting point nor a typical journey is given.
Web users enter your online report in various different ways:
- Via the corporate website, linked to the report home or individual content pages
- Via search engine straight into an individual content page
- Via deep links from press releases, social media or emails
- Via cross referencing within the report (e.g. further reading boxes or GRI Index)
- Via the usual web-navigation on page
Digital formats tell stories in different ways, emphasing a strong visual appearance and parallax effects. Also the use of multimedia adds value in terms of impact and engagement. All content elements like images, text or tables resize according to browser width.
On screen content is rather scanned than read. The decision to stay on a page is made in seconds!
Web readers tend to:
Read purposefully. People often go online to find particular information or to complete a specific task. They’re action-oriented, always seek to get their attention as quickly as possible.
Scan copy. People don’t read every word, instead readers scan copy to find signposts like headings or links that tell them they’re in the right place to get the information they need.
Be sceptical. Because of the unregulated nature of the internet, people tend to be suspicious. Establish credibility by ensuring content is accurate and error free.
Start reading at different points. Reading a website is more like reading a magazine than a book. Users enter and leave the site at any point and they choose the way in which they navigate.
Want easy navigation. People follow straightforward paths, if they get stuck, they don’t often go back on themselves to find a different way to get to what they want.
Be impatient. People want answers to their questions and they want them now. If a site doesn’t come up with what they require, they are quick to leave.
What to have in mind when writing for the scan reader:
- Keep it simple. The more content you present, the less likely it is the user will explore it.
- Quickly understandable headings are most important for the reader to decide whether to continue reading or not.
- Support headings with informative intro text
- Use short sentences and more paragraphs
- Shorter line length, bigger line spacing
- Structure content with sub headlines, graphs or pictures
- At longer content always start with the most important bit.
- Try to offer further reading cross references to go on.
- Use accentuation (bold – not italic or underline)
- Use numerations / lists to summaries
Enhance text legibility on screen
When using typography on the web, there are many things to keep in mind in order to create a page that presents text it in a legible way. Legibility refers to how a typeface is designed and how well one individual character can be distinguished from another. Most important here font size and line spacing as well as total line length.
Serif vs. Sans Serif. What font face to use?
Online sans-serif faces are being used more often. While serifs help the readability in printed media, because they support the reading flow, it does just the opposite on the web. On screen, specially little serifs easily blur together, making it more difficult to read the text. Also, we typically don’t read large passages of text on a website, so sans-serif fonts do just fine in shorter chunks of copy and bigger font sizes.
How to ensure text legibility on screen:
- Choose font face for purpose: headline as eye candy – body text needs to be legible
- Always ensure high contrast of font on background
- Use bigger font-size for screen
- Avoid words in capital letters
- Avoid italic or underline
- Avoid corporate fonts especially in body text
- Provide enough spacing / line height
Use infographics to reduce complexity of information
A visual is always easier to digest, hence ideal to help web users to quickly find what they are looking for. The web offers additional ways how to structure information e.g. by layering information on multiple levels to both reduce complexity but still provide detailed insights.
Tips how to ensure readability of graphs
- Ensure high contrast for colours in graphs
- Colour should not convey meaning
- Use full space of the screen
- Crop images and graphs to fit for landscape sceens
- Offer additional enlarge option for small graphs
- If you make a tooltip or rollover, assume no one will ever see it
Twenty corporate reporting executives from four countries met on August 26 for our first Round-table on “Digital reporting” in Vienna. In this post, we have summarised the most important findings of the session “Digital information design”.