What Is The 80/20 Rule And How Can It Be Applied To Web Design?

  • Twitter
  • Facebook
  • Google+
  • Pinterest

Advertisement

The 80/20 Rule (also known as the Pareto Principle and Juran’s Principle) is a web design principle that focuses closely on how the context of the website can have a dramatic effect on the user experience, which ultimately effects the content or functionality of the website. A very basic definition of the Rule from Wikipedia states that “for many events, roughly 80% if the effects come from 20% of the causes”. The main reason that you have probably heard very little about this Rule is that it is something that designers have no control over; it’s something that occurs naturally.

So, how can we apply the 80/20 Rule to the user experience? Essentially, it is telling us that 20% of the functionality and features of a website will be responsible for 80% of any results or actions that are generated. Whilst it may seem difficult, figuring out the 20% of the web design that has such a profound impact can actually be quite easy with the use of web analytics, form submissions and session cookies. It is important to keep in mind, however, that some of the smaller tasks within the website (which are not tracked) can also have an impact that is much more difficult to analyse.

Even though this Rule is relatively unknown within the web design community at large, there is plenty of evidence in existing websites that suggests people are at least considering the value of it as a principle. An example of this is a drop down menu that allows a user to select which country they are from. Most designers understand that, 80% of the time, certain countries (such as Australia, New Zealand, USA, Canada and so on) will be chosen, and will include these above a line to make the user choice much easier. Other possible choices are included below this line, allowing the other 20% of users to search through for the country that is relevant to them.

The relevance of the 80/20 Rule can further be shown when we look at the ways in which a user’s eye is drawn to certain areas of the page. The name given to the reading and scanning habits that we believe users follow is known as the F-Pattern. This suggests that the content of a web design is read in an F-shaped pattern, meaning that the top left-hand corner is the most looked at, followed by the horizontal prongs that extend to the right-hand side of the page and the vertical prong that extends down slightly further. If we take this pattern to be the truthful way that a user’s attention is drawn, then the 80/20 Rule really is supported – the most intense areas of the web design represent the 20% of the page that the user interacts with 80% of the time.

One thing that many people wonder, with the advent of mobile website and application design, is whether the 80/20 Rule can apply to the mobile realm or whether we need to come up with a brand new principle. The important thing to take into account with websites and applications designed for mobile devices, however, is that they will only focus on the 20% that user’s focus on in a traditional web design. The main reason for this is that designers will have a much smaller screen to work with, therefore only the most important aspects will be included. In saying this, even the mobile version of a website will most likely follow the F-Pattern of user eye focus, meaning that there will still be 20% of the content that has much more impact. This content will just be much more condensed. This is why it is often recommended that designers create the mobile website before the computer one.

To further help you understand the 80/20 Rule, we have compiled a list of the ways that you can help to achieve it with your own web designs:

  • Analyse analytics and usability data to determine the 20% of your website that is most used.
  • Focus on the important aspects of your website or application, then work on enhancing those.
  • Don’t spend too much time optimising the content that falls in the 80% of your content that is often not used.
  • Simplify your web designs and layouts based on the content that falls under the 20% most used sections of your website.
  • Remove functionality or content that is not used often and is not critical to your website’s purpose.
  • Work on improving the functionality and design of the other 80% of content that could actually have a larger impact on conversions.

Whilst many critics will proclaim that the 80/20 Rule has no basis in web design and that it is not an accurate representation of how a user’s eyes are drawn to different areas of the page, there are an equal amount of advocates who strongly believe that following this design principle will help to garner much better results. So, what does this mean for designers and website owners who are looking for ways to boost their image? Essentially, it means you can choose to follow the Rule or to disregard it altogether.


Before you continue reading this post, I would like to recommend some of our other articles about this topic, such as 20 Great Examples of Parallax Scrolling Websites, 30+ Examples of Large Photography in Web design or SEO Tips for Web Designers: A Guide to Beautifully Designed Websites.

Dont forget to subscribe to our RSS-feed, become our fan on Facebook or follow us on Twitter.


Leave a Reply

Your email address will not be published.
Required fields are marked *