Web Design tips: Web page loading progress bar design

Article Description: Although loading on the entire page is a trivial matter, but because the load inadvertently caused by the loss of users is a big deal. Displaying progress in the Load page, giving promises, adding information or humorous content can make users less aware of the time that "awareness" is loading. But the real way to slow down is to load faster; Chic design can be a symptom, but loading speed

for loading (loading), presumably everyone is not unfamiliar. Every time I see the load page that keeps turning and turning circles, or is "Loading ..." back non-stop flashing three dots, the heart will be filled with all kinds of anxiety and resentment.
According to a survey, users can tolerate the maximum time of loading in: 6-8 seconds. 8 seconds is a critical value, if the load time is more than 8 seconds, most visitors will eventually choose to give up, unless he must open the page.

The above three kinds is the common loading way, if is me, I would like to see the third kind of progress bar, because I really do not know how long the first circle to calculate load success, also do not know the second point point to se years.

If this time, the interface in addition to see "load" things outside, whether it can divert the user's attention? Before we look at the screen, the screen will be buffered, and there will always be an ad. Every time I will endure the load of advertising, but if the ad is good, very attractive, it is not irritable, even in the comments to find the address of the load ads. The loading of the Web page takes on the role of loading ads.

Local load on the page can often see the first circle of the figure, but each time to see the circle is similar, if the form of a circle, may feel that "this circle and other seems not the same", through curiosity to reduce the anxiety of waiting.

Reduce user anxiety by giving a promise to indicate how long they will be loaded, telling the current progress (as a percentage of the process), and giving a reassurance. For example, the following ways:

One of the following progress bars has a different design:

Both of these deterministic progress bars indicate the current process, but the difference is that the first kind of progress bar content is pure color, the second progress bar content has animation effect, if this progress bar is suddenly stopped at some point, this time will cause the user to be troubled, in the end is the card dead or this section of the load relatively slow? If it is the next progress bar at a glance, if the card dies, the animation effect is gone, if there is still animation effect, it means that only this section of the load is relatively slow.

If the progress bar to do some more deformation, not only tells the user the current loading process, there is no appreciation of the meaning:

In addition to the progress bar deformation, you can also from the copy or pictures, this form of loading not to the user to bring the feeling of irritability, but feel that this load has a special temperament, not only deepened the impression, but also brought goodwill.

Use teaching or tips instead of loading, often seen in the game loading page. The general appearance of the content for game teaching or some tips small tips, and each time the content is different.

To reduce the user's anxiety, "enhance the user's expectations" is also a good way, in addition to their own website expectations, there is the "progress bar itself" expectations. If there is a different color in the percentage, then the user may be waiting to think: The next second will be what color, thus, it seems not so urgent.

Although loading on the entire page is a trivial matter, but because the load inadvertently caused by the loss of users is a big deal. Displaying progress in the Load page, giving promises, adding information or humorous content can make users less aware of the time that "awareness" is loading. But the real way to slow down or load faster; Chic design can be a symptom, but the speed of loading is the root of the cure.