Before considering any design, whatever project you work on, you need to understand basic things about UX. And it’s never too late to learn them if you missed it before. The main thing to start with is to find the way how people scan web content. That will help to improve user engagement dramatically.
Before reading people usually scan the page. They quickly move with their eyes through information, only stopping at the parts that seem important to them. An interesting thing that eye tracking studies have shown that online readers scan information in the shape of the letter “F”. Did you know?
And this way was named F-Pattern. How does it work?
- The top of the “F” is formed when users start reading your headline at the top of your page. Also they might read what’s beyond — the description of the article.
- Then readers move their attention back to the left side of the screen and move their eyes down the page until they come across another heading or information that catches their eye.
- The second horizontal line of “F” is formed when users spend some time reading what they’ve found in so-called “topic-line” (which is vertical part of “F”).
Once the reader has gotten the information he wants, he will continue to scan the page, stop if there is anything else catch his eye. But in most cases, he will move to another page of your site or leave.
If your website layout and content do not match the F-pattern, the user will probably leave to a site where scanning is easier.
The benefits of F-pattern:
- It makes your design more intuitive
- You can prioritize your content and control where users spend more time
- Users get what they need faster
Advises based on F-pattern implementation:
- Put the most important elements first
- Generate engagement with your sidebar
- Use design elements and colors to highlight the F-pattern
- Make your header eye-catching
- Don’t ignore the bottom of your site. Make break ups using pictures or subheadings. It will make a site more visually appealing
Taking advantage of a pattern or layout that is proven to work can ensure you get the most viewers to your site. Once the viewers are at your site, the F-pattern makes sure they are viewing the most important information first. You can decide what information is most crucial.
World’s best practice:
- Place your logo on the top-left
- Place your contact phone on the top-right
- Use F-pattern for the content on your page
Use this information as a guideline to develop your website and content. Of course, there a lot of sites that use other patterns, but their success is based in most cases on the original design idea and unique techniques rather than on the pattern. And if you don’t have this outstanding design idea, make sure you use F-pattern to make users stay on your site.