Entry 3

https://www.nngroup.com/videos/f-pattern-reading-digital-content/

The Nielsen Norman Group provides a great resource for all things accessibility, usability, or website design in general. In this article, author Kara Pernice describes what “F-Pattern” design is when talking about reading digital content and why it is an important design consideration.

The “F-pattern” is essentially the track that our eyes take when scanning webpages, articles, or other online content, whether it’s on the web or on a mobile platform. As the name would suggest, our eyes typically move the page in the shape of a capital “F”. We read the most important content at the top corner of the “F”, then move from left-to-right until we are ready to move downward toward the next horizontal line of the “F”. Now, this doesn’t mean there will only be two horizontal scans of a page, F-patterns can go very far down a page.

The important part, though, is why web designers make sure their content is organized in this pattern. As many languages read left to right, web content must be organized in the same way. Even the opposite is still effective, as an example, Arabic is a language that is read right to left, but a reverse F-pattern will work in that case. Generally, the most important, attention grabbing material should be at the top of the F, with secondary and tertiary information, images, design, and layout characteristics going lower. This hierarchy is very typical of good web design and is the basis for designing any page.

What’s so useful about this pattern is it helps for users of the web content to pick out the most essential content in an efficient way. Rather than guessing where to find, say, the “sign-up” link for a website about a charity 5K, users can just move down the F hierarchy until they find it. Users should be able to access all the essential content without having to really think about, making F-pattern considerations very important.

Leave a comment