Tell me more ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.
up vote 3 down vote favorite

I need to build a table which is populated over time. The same behaviour you have on flight comparison websites like skyscanner where the flights appear progressively in the page. I also need to provide an alternative page which would be accessible and which would work without Javascript. Do you have any recommendations or examples of this kind of behaviour (the one without JS)?

share|improve this question
What does the script version look like? Have you got a mockup? You possibly don't need to provide an alternative non-script one, but may be able to add into the script one so that it still functions without JS. But we'd probably need to see it to know if that's the case or not. – JonW♦ Jan 28 at 11:20
I don't have any mocks but we need the result table to refresh dynamically. – Julien Jan 28 at 11:55
1  
This seems more like a technical issue, really. If a user has javascript disabled, offering an alternative refresh button might be a simple and user friendly solution. – kontur Jan 28 at 12:01
Yes there's the technical issue but there's different ways to handle it in term of UX. I was thinking of this one: when the user finish to enter his details, we display an interstitial page with a message like "Please wait whilst we search for results". This page will refresh automatically every 5 seconds until all the results are available and then we display the final result page. It's kind of what edreams.net is doing. – Julien Jan 28 at 12:13
Is there any reason you need to progressively reveal results rather than just displaying them all at once? – dhmholley Jan 28 at 12:24
show 4 more comments

2 Answers

up vote 2 down vote accepted

You can refresh/redirect a page using META-tags, and go from there. Make sure caching is off if this turns out to be a problem; on the other hand: for a smoother experience, turn it on to create a more seamless refresh. Test if the updated data is properly represented, though.

<META HTTP-EQUIV="REFRESH" CONTENT="15;URL=yourpage.html">
<META HTTP-EQUIV="PRAGMA" CONTENT="NO-CACHE">
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">

If the data structure is predictable I would put this in an IFRAME with the scrollbars removed. Of course, if your data is variable (especially in the page height): don't do this.

Funny idea: supply a countdown on your page, even if it's the no-JS page. An animated gif with 15 frames, each lasting 1 second, would do the trick. For example:

"This page will reload in approximately [animated gif] seconds."

Lastly, always provide a reload button separately from the one in your browser. There are a huge amount of people out there that don't know what the browser controls do.

"This page will reload in approximately [animated gif] seconds, or [reload this right now]."

share|improve this answer
+1 that's the best way to do it. – obelia Jan 28 at 15:42
My answer in another question (ux.stackexchange.com/questions/30590/…) states why automatically updating without user interaction is almost never a good idea. As pointed out in the comment: If a user has javascript disabled, it is most likely because they object to these kind of dynamic methods. – kontur Jan 29 at 7:19
@kontur: Great advice. Of course, that doesn't apply to all situations. I have had the luxury of measuring such changes in a high-traffic e-commerce environment: preventing end-user disappointment by updating content is more important than preventing dynamic updates. – MHD Jan 29 at 9:08
@MHD yes, I suppose it is a matter of prioritizing. The countdown feedback to the user you suggested seems to be a good way to at least take some of the unpredicatablility out of the equation. – kontur Jan 29 at 9:33
up vote 1 down vote

A common fallback to disabled javascript interactive behaviour is to offer a button for manual reload of the page or parts of it.

This is a good solution because it:

  • communicates that there is likely more new items to load, so the user sees the point in reloading
  • shows that the page won't reload on its own, i.e. the user knows that it is up to them to reload
  • is not intrusive to the user experience compared, for example, to a page refresh at arbitrary time intervals
  • is better usability that to just silently fail or display a noscript warning message about missing javascript features
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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