Do you know that most web users naturally scan your webpage in an F shape? It’s a good idea to bear this in mind when it comes to your website and where you place your content.

The F shape in web design

Most western web users do not read every word of a webpage, even if they find it interesting; they scan webpages, looking for point of interest.

What is the F shape?

The F shape when it comes to scanning a webpage is the direction and areas that web users look, or scan, when they come to look at, hopefully to read, a webpage.

  • First, they scan the top area in a horizontal line, from left to right – the top bar of the F.  
  • Next, they scan a lower section, still in a horizontal line, from left to right – the lower bar of the F.  
  • Finally, they scan the left-hand side of the website in a top to bottom direction – the vertical stick of the F.

What if my content isn’t in an F shape?

If your content isn’t in the F-shape formation then some of it will be missed by a web user having a quick scan.

There are two schools of thought as to whether webpage content should be in an F shape or not. One school believes that to aid the user digest as much of the content as possible, the F shape should be adhered to.

The other school of thought is that the F shape of content should be avoided, to stop the web user from purely scanning.

Tips to make content easy for users to read

What most UX designers agree on is that content, whether in an F shape or not, should be as easy as possible to digest. And many make much use of the F shape by situating the most important content where the user is most likely to look and linger, in a way that feels intuitive.

Even if you are using the F shape, there are few things you can do to make content stand out, help the user and ensure you’re directing them to where you need them to go.

  • Use headings and sub headings  
  • Make links bold or in a different colour 
  • Use meaningful words for click buttons, CLICK HERE, READ MORE, etc. instead of GO  
  • Bold, don’t capitalise, important words and phrases 
  • Use lists and bullets 
  • Cut unnecessary words and content

A good web developer will work with you to hone your content to ensure it’s set out and organised in the most intuitive way for browsers with your design and your content working perfectly together. They will also work with a professional content writer for digital to ensure every word works to get your message across, as well as direct the user journey.

Just be aware of the F shape and that F could stand for FAST as the user quickly scans a webpage and moves on. The question you need to ask is, how do you get your message across the most effectively before they do so, or direct them to where you want them to go?

CloseComment or share
  • Facebook logo
  • LinkedIn logo
  • Medium logo
  • Twitter logo

< Read more articles on our Web Academy