14

We have a bit of a discussion regarding the use of wait/load indicators in a project I am working on.

The scenario:

  • A click on an "open document" link possibly leads to a 2-5 second wait before the user can see the document contents.
  • Some coworkers are of the opinion that we in this case should display a waiting page with a load indicator right away and then use AJAX to load the document content (all the documents are HTML) into the page.
  • My opinion is that since the sole purpose of the click is to display the document, just handle this as a normal page load and let the browser do the wait indication.

Does anyone have any advice? Is there any research that indicates what solution is best?

|improve this question
  • 4
    So, the web browsing experience is so "bad" that every aspect of browsing is being customized to the hilt. What's so wrong with the way that web browsers load an HTML document? Literally, the primary purpose of a web browser is to load and display an HTML document. °_° – sirtimbly Jun 5 '15 at 18:55
  • Exactly my thoughts. – codeape Jun 5 '15 at 21:13
16

As a page loads on Pinterest and Facebook they both show solid blocks where regular content will show up. Handling a page load this way provides better feedback than just a loading message/animation.

In the case of Pinterest, they calculate the dominant image color and set that as the block loading color. Facebook simply shows a blue block and thick solid lines where text will be displayed.

Why not customize the experience for your users as well. Small interactions like this help delight users.

Even though these examples are for content and not the whole page I think you can get some inspiration from them. enter image description here enter image description here

Further reading: Facebook content placeholder deconstruction

|improve this answer
  • 3
    +1, very interesting. I never considered these methods from a UI/UX perspective, they just felt that natural. I suppose that's an indicator of great design. – Alan Jun 5 '15 at 13:10
  • 1
    Facebook, on some browsers, show some placeholder content. Instead of a white square, it shows a light gray sqaure where the photo is, shows a rectangle where the title will be and a few rectangles on the text content. – Ismael Miguel Jun 5 '15 at 15:35
5

Unfortunately, the browser experience of loading page is pretty bad. On most browsers it's just a blank white page with a very tiny indicator near the top url bar. Many users may not even see this spinner. To them there is no information at all.

If you are able to provide your own spinner, you are providing extra information that the browser doesn't give. You are giving reassurance that the system is working, that their connection hasn't died, that their computer didn't freeze, that the reason it is taking a long time is expected and normal.

It's the same effect as the Facebook finding that users attributed slowness to the app on the left, and to the system on the right: Loading indicators

In this case, you want to provide a clue to the user as to why the loading is taking a long time. It is because they requested a document that must be retrieved, not because the system is being slow.

|improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.