What is The "F" Pattern and why does your website need it?

Let's face it. You have about 3 seconds to impress your website visitors before they get distracted by those cute little kittens over on YouTube. For your website to be successful, you need to capture their attention right away. More importantly, you need to keep their attention long enough to convey your message, pique their curiosity, and perhaps even convert them into a paying customer via a successful call to action. It's a tall order. Thankfully, the folks over at The Next Web have summarized some pretty interested research for us on eye movement and how users quickly scan your website content. An unsurprising pattern has emerged called the "The F pattern".

Website visitors typically scan across the top of a web page, which is usually a page title or a headline of some sort. This makes up the top horizontal line of the capital "F". Visitors then scan down the left side of the page until they see something interesting. This makes up the vertical line of the capital "F". When they've found something interesting, they read horizontally again. This makes up the second horizontal line of the capital "F". Good web designers are able to maintain their reader's interest, converting a capital "F" into a capital "E"... followed by more and more horizontal lines of reading.

This is how people view your website... or at least how they *want* to view it. So what does that mean to us and how can we benefit from this information? Here we can take a lesson from physics... specifically the concept of "path of least resistance". Your users want to read websites using the "F" pattern. So, set up your content accordingly. This will allow your visitors to scan your content more easily, and you can thus convey more information in a shorter amount of time with less visitor frustration.

These tips deal with minute user experience improvements. However, for a website that gets thousands of visitors per day, following the "F" pattern can translate to a significant increase in sales. Low level concepts such are this are typically not withing the realm of knowledge of most casual website developers. But that's why you have Extra Nerds. Our developers eat this stuff up. We geek out on pixel perfection and nuance web development standards and techniques. In other words, you don't need to worry about any of this. Let us take care of it for you. When you're ready to start your next website, or if you want to revisit the layout of your existing website to move ore towards a content flow that follows the F pattern, then contact us.

Posted on May 6, 2015 .