Web Design & The Gutenberg Rule

CATEGORY: Web Design

May 15

The Gutenberg Rule is one of the fundamental cannons of page construction. Introduced by Johannes Gutenberg , a 15th century goldsmith and printer, he developed this rule of thumb after observing how readers interact with content on a page. He discovered that it was common for readers to quickly scan the contents of a page from top left to bottom right to decide if the content was relevant or useful for their purpose.

In our online world, where attracting customers and keeping them engaged for as long as possible is important, implementing this principle could give your website that extra advantage. Knowing where to place key elements such as your contact information, social media links, content and other helpful pieces of information can help with time spent onsite, user experience, and conversions for your website.

How does the Gutenberg Rule Work?

The Gutenberg theory operates on a customer’s naturally ingrained visual habits while viewing information. When we read a book, for example, we start at the top left and work our way down to the bottom right. This is commonly know as “reading gravity.”

Web Design with the Gutenberg Rule


This simple model divides a page into four quadrants. The four quadrants do not need to be equal in size, but should be designed with visitor behavior in mind.

1. The Primary Optical Focus Area

This area should contain your logo or brand name, a call to action, or items that highlight the page topic to pique a visitors interest.

2. The Terminal Area

The Terminal Area acts as a conclusion to your page and should feature such call to action items as contact information, sign-up forms, purchase buttons, and “next” links.

3. The Strong Fallow Area

The Strong Fallow area is great for items such as log in and log out functions, registering for a site and social media buttons. Users are in the habit of looking in this area for this type of information.

4. The Weak Fallow Area

Given that this is the area of your page that the readers eye will slide past the easiest it is not recommended to put core page elements here.

Although there are exceptions to every rule, using the Gutenberg Rule when planning your next web design project could save you time and money.



recent posts