f-layout

F-Layout Scanning Pattern

by
Avatar_Dan_Campbell
  • F-Layout presents information to the user in a way that supports a natural and comfortable reading/ scanning action, which increases usability.
  • Sometimes referred to as the ‘triangle’
  • This layout highlights the best place to locate advertisement or call to action
  • This approach can switch the user off, so break the pattern by using objects like
    • Page width images/ advertising
    • Horizontal picture bar 
  • Remember that the user only focus on the grey area highlighted in Figure 1
  •  Think of the F-Layout as:
    • Vertical spine of the ‘F’ running from top to bottom
    • Horizontal lines of the ‘F’ are subheading
F-Layout Scanning Pattern Over Gestalt Layout
Figure 1) F-Layout Scanning Pattern Over Gestalt Layout