For UX designers and web developers this means a couple of things: First, and probably most importantly is to ensure that the web page you are creating is as engaging as possible. Secondly, you need to ensure that the most important information on the page stands out.
It might be an odd concept for a designer to think about designing a web page that is easy for a user to skip through and pick up the odd bit of information from it. It’s ingrained in most designers minds that we must keep the user engaged and on the page for as long as possible.
Making a webpage or a website scannable isn’t just about delivering content and getting users from one place to another as quickly as possible, it’s to make the whole user journey a lot easier and convenient.
If you have an e-commerce site, you want to make it as easy as possible for any potential customers to get through the sales funnel quickly and easily. Designing with scannability in mind means ensuring that the user can glance at a web page and instantly see where they need to go to access the element they need to move onto the next part of their purchasing journey.
If you look at Netflix for example, their home screen doesn’t overload the user with information, only the essentials are shown, making it easy to scan. If a user is scrolling up and down wondering what to do next then there might be some issues that need addressing with information overload and how easy it is to scan.
Visual hierarchy is a technique where you arrange content on a web page in a way that follows the way people typically interact with it. People are used to seeing things laid out in a certain way. For example, if somebody were to land on a news article, they would expect to see a main image and headline, perhaps some facts about the author, time and date and then the main body content to follow.
By laying out the news article in an unorthodox way, you are putting the user on the back foot straight away. Before they can start to scan the content, they need to get to familiarize themselves with the layout. It may only be a split second but that jarring makes the news article less scannable.
Making use of white space is a great way of breaking up content and making it easier for the user to scan a page, it gives content space to breathe. Displaying too much information at once will cause content paralysis; the overwhelming feeling there is way too much content in front of me all at once.
Taking advantage of white space and breaking content up into sections will allow your user to digest the information a lot easier and in turn, making the page easier to scan.
A great way to find out if your web pages are scannable is to start putting them to the test. Start with the basics, is the font your using suitable? Is the size of the text large enough? Are you centre aligning large amounts of copy? (Left-aligned copy is naturally easier to read).
Once the basics have been checked and fixed, you can move on to using useful tools such as Hotjar to record visitors using your website. You could also set up user testing and ask a select audience to perform a list of tasks on your website. If you identify a pattern of issues or you notice the user struggling to get from point A to point B on your site then you know you have design issues that need addressing.
With people having less and less time in our ever increasingly busy world, scannability is becoming an important factor in the overall web design process. An easily scannable page for any potential customers will move them along the buying process and onto the next stage easier and in turn, will deliver better results. To discuss how we can help improve your website please get in touch!
Article Written by Matt Partridge
Web Developer & Digital Marketing Specialist
matt@madebyabstraction.com