80/20 rule for web design

Recently learned some design principles, I found an interesting principle - 80/20 rule. Also known as the Pareto principle, the Juran principle, the critical minority and the minor majority theory or the sparse theory of factors.

In web and web application design, the 80/20 rule has a profound impact on user experience and ultimately the content utility and functionality of websites and web applications.

This article first gives the basic definition of the 80/20 rule, and then explains how the 80/20 rule works by case. Finally, through the collection of 80/20 rules knowledge summed up some experience to share with you.

What is the 80/20 rule?

The 80/20 rule was first summarized by the Italian economist Wefredo Pareto, but the Pareto principle was named by Joseph M. Giullan.

The following are two definitions of the 80/20 rule. First, from the design of universal principles in a book.

The 80/20 rule says that in any large system, about 80% of the utility is generated by 20% of the variables in the system.

Wikipedia defines the 80/20 rule as:

In many cases, about 80% of the impact is the cause of 20%.

As a designer, you will find that the 80/20 rule is not directly human-controlled and we observe that it is a natural occurrence.

Knowledge of the 80/20 rules gives us access to valuable information and helps us make decisions to improve design ease of use and utility.

Do not have to tangle with the hypothetical nature of the rules

Some critics consider the 80/20 rule to be just a hypothesis, a mere general theory of the system that in many cases does not apply.

But for the time being, aside from assuming hypotheses, theoretical concepts can help review and optimize designers and users of user interfaces and functions. Whether the theory is 70/30 or 90/10.

How to apply the 80/20 rule in user experience?

The 80/20 rule shows that 80% of the results are determined by 20% of the features and features that apply to all web sites, web applications, and software.

In some cases, it is easy to identify the 20% of the most important components. Through the web statistics, form submission and session cookies can be used to track the user's behavior, to help us understand the user which UI area has the most interaction.

However, these methods are difficult to analyze for some minor behaviors. At this point, ease of use research can come in handy.

Case: Identify the 80/20 rule

Whether intentional or inadvertent, a large number of cases can explain the status of the 80/20 rules in the hearts of UI and UX designers.

Take the most common pull-down menu in the UI for example, select the country entry in the registry. Most web site developers and content designers will find that some countries are 80% chance of being selected.

As the following figure, although not in alphabetical order seems to be inappropriate, according to the 80/20 rule, it is a convention to place the option that has the most number of options on the item side.

When choosing a new address in Amazon, the default option must be the highest selection rate. The following figure, the United States.

The following British business website is the United Kingdom as the default option.

The above examples illustrate the importance of optimizing the most commonly used functions and options.

Where do users usually look?

Internet users "F-type" reading and browsing habits have now been identified. While "F" is not always suitable for all environments, understanding this is about knowing the user's concern as the user interacts with your design.

The following figure shows the user attention to the heat map distribution:

Assuming that this diagram is a good illustration of the user's visual concerns, this is also supporting the 80/20 rule theory. The area of ​​most attention on the map accounts for 20% of the page, and the user 80% of the time is spent on the 20% area.

As a designer, mastered this knowledge, they will focus on enhancing and optimizing user habitual concern of the area.

Of course, the deciding user's focus is often on the design itself. "Type F" is just a basic guide and you can not dogmatically use the F-type to determine the 20% position.

Mobile Design Trends and 80/20 Rules

With the current popularity of mobile devices, many designers and developers try to design mobile page first. That is, before planning and developing a website, you should first make a mobile version of the page in order to reap the benefits.

In traditional websites and web applications, the area with the highest frequency of use and interaction is included in the 20% portion. When designing a mobile interface, just focus on that 20% portion.

Compared to the rich features provided in traditional websites, even though the mobile version of this website contains 20% of the most commonly used features, it can be said that this mobile version has most of the important features.

Let's take a look at this case:

The picture above is a picture of a website that looks like a clutter of joy. There are some areas on the site that guide users. This site design is definitely not the worst in the world, but in general it is not very focused and has too many options.

Compare the following mobile page:

In contrast, the mobile version of the interface is very simple, to guide users to find the most important information at first glance, rather than letting users feel overwhelmed.

Therefore, the compact mobile web application is a very good example. Designers devote most of their energy to the most important aspects of the project. That is, focus on features and content (20%) that users frequently use most of the time (80%).

Experience summary:

After understanding the principle of the 80/20 rule, designers can follow the following method, summarized as follows:

If possible, analyze site statistics and availability data carefully to determine what 20% of the features users most frequently use.

· Prioritize. Focus on the most important aspects of your web and web applications and continually reinforce them.

• Statistics out the most commonly used functions that fall under 20%, simplifying design and layout.

Remove unimportant features and content that are infrequently used.

· Do not devote too much time and money to features that are less commonly used, as your rewards may be very small.

For infrequent but important elements, try to improve its design and functionality, as these elements can have a large impact on interaction as frequency of use increases.

Although the 80/20 rule is an inherently flawed and controversial principle, it is not without merit. You can use the 80/20 rule when you are redesigning, reassembling, or even new projects.

The 80/20 rule guides users to the most important features and content and eventually increases the website's conversion rate.

-----------------------------------

My Authors Louis Lazaris, Freelance Writer, Web Developer. To learn more about Louis's articles and tutorials visit Impressive Webs.

Source: ksyoo