Jacob Nielsen :: Scrolling and attention

I present to you my second translation - a new article by Jacob Nielsen, published yesterday.

Internet users spend 80% of the time, studying the information on the "first screen". Despite the fact that they also use scrolling, only 20% of their attention falls on what is located below the “first screen”.

In web design there is a big mess with the so-called. “First screen” and the importance of displaying the most important information in the area initially visible by the user. (Ie, in fact, the definition is: “first screen” means “visible without additional actions.”)
')


At the time of the birth of the Internet, users often did not use scrolling at all. They simply looked at the part of the page that was visible to them, and decided to stay on the page or not. Thus, in usability studies of that period (1994-1996), sites often did not succeed if important information was outside the “first screen”, since most users did not see it.

Such an unwillingness to scroll through the pages was quite natural at that time, since most often the computers of the users were slow. Dialog boxes and the entire multimedia system worked perfectly, without requiring scrolling. (Of course, users sometimes came across scrolling text fields, but they didn’t need to use scrolling to see buttons and options, and it was for this reason that users could make decisions based on what they saw.)

However, in 1997, I abandoned the principle of avoiding pages that require scrolling, because users had to adapt to scrolling on the web. It was a rare case when the principles of usability quickly changed. Generally speaking, usability provisions remain stable after many years: 80% of the principles of the 90s are still in force.

Of course, today users will use scrolling. However, you should not forget about the “first screen” and create infinitely long pages for two reasons:

• Long pages are still a problem, since users have a limited amount of attention. People prefer those sites that allow them to achieve their goals and do it quickly. In addition to the basic reluctance to read a lot, there is also an unwillingness to scroll.
• From the point of view of keeping users' attention, the information on the “first screen” is more valuable than anything else below.

So, of course, you can place information below the “first screen” and not limit yourself to creating pages containing only a couple of bytes of information.

In fact, if you have a long article, it would be better to present it as a scrollable area than to split it into several pages. Scrolling is better than paging because it is easier for users to scroll through a page than to think about whether to go to the next page of a split article. (That is, the fact that scrolling is simpler implies a design that follows the usability guidelines for scrollbars, etc.)

But no, understanding that users are scrolling does not free you from prioritization and the belief that everything that really matters remains on the “first screen”.
The theory of informational needs suggests that people decide whether to continue walking the page (including scrolling down), based on the sensations of what they see at the moment. In other words, the user will scroll the page only if written will convince him of the value of the rest of the page.

Eyetracking

Last month we conducted a fairly large study of user behavior on various sites. In order to determine if the “first screen” is still relevant, I partially analyzed the results of the study - a total of 57,453 fixations (cases where the user looked at something on the page - the average fix length is less than half a second) .

For greater objectivity, I analyzed data on 21 users who viewed 541 pages, although our research was much bigger. To convince you that I did not specifically limit the sample, let me explain why I excluded some parts of the study from this analysis.

Because our goal for our research was to obtain relevant information for our annual seminars, we aimed large parts of the research to test:

• sites with new navigation features;
• corporate blogs, interesting FAQs, etc .;
• web applications.

This data is great for researching and testing sites containing the elements that we want to explore. For example, in order to understand the effects of a carousel for our navigation workshop, we must track the eyes of users facing the carousel. In order to do this, we ask them to use the sites, some of which may contain a carousel, but we do not tie their attention to this design element.

When we consciously ask people to test sites containing design elements that are interesting to us, we cannot say that the behavior of these people is typical of any sites. Returning to the carousel example, people may scroll less often than usual if the carousel has stopped their attention at the top of the page.

Our research provided the user with the opportunity to visit any site for a wide range of workshops on the fundamental principles of web usability. Such unlimited tasks are an excellent source of information, which I analyze in this article, because these studies test the usual sites that people use, unlike those sites that we chose because of the presence of any design features.

Focusing attention

The table below shows the distribution of user fixes by stripes on a page, each 100 pixels high. The columns represent the total time of a look at the bars divided by the number of fixations. (In other words, two fixations of 200 ms each are the same as one fixation of 400 ms.)



Even if 5% of the total time spent by the user on a page is below the 2,000-pixel mark, there is a tendency for the information far from the top of the page to be scanned very superficially. Some pages are too long (in my example it is often more than 4,000 pixels), and thus, these 5% of user attention are distributed over a very large surface.

In our study, the time users browse the pages is as follows:

• "First screen": 80.3%
• Anything lower: 19.7%

We used a device to track the eyes at a monitor resolution of 1024 × 768 pixels. Today, many users have gotten more monitors, and we have done a lot of research with large monitor resolutions. However, using a larger diagonal monitor would not change our results; this change would only increase the user's attention spent on the “first screen” simply because more information would get into the initially visible area.

Scrolling behavior

Sometimes users read the entire page. It happens. Seldom.

More often, we see one of the two types of behavior shown in the viewing schemes:



The view diagrams show where the three users looked, being on the pages in three different tests (one participant per page). Each blue dot represents a single fixation, the larger dots represent a longer viewing time.

In the image on the left, the user scrolled the page very far away, and, suddenly, he saw an interesting thing. Such a visual pattern gives us a lot of fixations, which are far beyond the “first screen”. We often see this pattern in a well-designed FAQ, despite the fact that the best FAQs show the most frequently asked questions at the top of the page (so that users do not have to scroll for a long time).

The left-side view also illustrates another interesting point: the last item in the list often attracts extra attention. Undoubtedly, the first few items are most important, but more attention is paid to the last item than to the previous one. (This also explains why the chart shows more attention on the 701-800 pixel zone than on the 601-700 pixel zone: the lower part of the monitor that we study belongs to this area.)

Attention to the end of the list is also reinforced by the effect of primacy, which says that the last thing that a person saw is put off in the mind as particularly important.

Two other diagrams show the most common scrolling behavior: intensive browsing at the top of the page, moderate viewing at the middle and very superficial at the end. (I selected examples in which users scroll the page to a greater or lesser degree - often they don’t look at the end of the page because they don’t scroll so far.)

It is as if users were on a page with a certain amount of fuel in the tanks. As they move down the page, they use this fuel, and sooner or later they will run out of fuel. The initial amount of this fuel in the tank may be different, depending on the motivation and interest of each page inherent to a particular user. In addition, the fuel can evaporate or refuel depending on how relevant the information on the page is for the user.

In any case, the user's attention eventually ends, and the further the user goes through the page, the less time he spends on each additional information block.

The average layout shows a page with 50 sofas:

• The top 2 lines received an average of 5 to 10 fixations on each sofa;
• the next 4 - from 2 to 4 fixings on the sofa;
• the next 8 are usually 1 fixation per sofa;
• The bottom 3 lines received 2 fixations on one couch, and none on the remaining seven.

This is just a rough model, and users will differ depending on the content of the page. For example, the sofas Cameon Loveseat and Custom Hugo Loveseat got 4 fixings for two, despite the fact that they are located at the level of 2,750 pixels below. It can be assumed that the user found these 2 sofas particularly attractive.

findings

The conclusions are simple: the most important information for users or your business should be on the “first screen”. Users will view the page and lower, but not quite the way they look at the "first screen".

People will view the page very deep down under 2 conditions:

• the layout is made in such a way that the user himself wants to scroll the page;
• Initially visible information will make the user believe that the page is worth the time spent scrolling.

Source - http://www.useit.com/alertbox/scrolling-attention.html