The F Pattern

What is the F Pattern?

Researchers have conducted eye-tracking studies which show that when someone looks at a webpage, their eyes move in an ‘F shaped’ pattern.

What this means for your website?

What this means is that the visitor to your web page looks first at the top left corner and then scans along to the right. They then drop their eyes to the next level, beginning on the left hand side and scan to the right again. So the main points of focus are the top left corner, top of the page and left hand side of the page, with studies showing only occasional glances towards the right as they move down the page.

How can this layout be used?

Using this layout therefore, doesn’t force the viewer’s visual flow as the eye tracking studies show it to be the natural scanning behaviour of most web surfers. To follow this affectively, priority text and images you want the viewer to see should be placed on the left of the screen, e.g. branding and navigation. Images grab attention much more than text, which will most likely be scanned, especially as the viewer scrolls further down the page. Some good uses of these most viewed places include using the top left corner for branding and the top right for social media links, as if in the side bar these are more likely to get attention.

Stand out

With knowledge of the F pattern, you can prevent your website from becoming repetitive and thus boring. It is good to add something unexpected to break the visitor's eye pattern and grab their attention. This is especially useful further down the page and in areas their gaze doesn't naturally reach. A catchy headline, image or anything visually unexpected will break their rhythm and regain attention.