I have a widget that helps looking for posts in my site.

Here's a picture of the widget (site's not online yet)


I want to use html5 session storage to store the widget options among pages.

When a new page is load, the widget switches to the saved state and shows the results made with the saved options.

I'm in doubt among 2 solutions about when storing the widget data:

  1. To store the widget state when the user trigger a search (the blue button) so that the new page shows the results of the previous page, with the drawback that if the user doesn't trigger the search before changing page, those option changes are not saved so the user will find options different from the one he left in the previous page.

  2. To save the state when the user changes the option and load the new page with the results. the drawback is that again if the user doesn't trigger the search before leaving the page, this time he will find results that differs from the ones he had in the previous page, because they are calculated using the stored options.

So, is it better consistency in the results or in the options?

One solution could be to trigger the search on every option change, but i'm afraid to overload the server too much with the ajax requests.


If not the Google introducing new way of searching, where results show automatically even before you press enter key, I would be sure this is not the way to go. Personally, I hate when Google does that. Loading data, making a request to server, processing it in javascript and populating the page with it usually comes up with some major lag - this is a bad user experience. I can stand it, and I actually expect it, when I press the enter key - the lag assures me the app is working. But if I'm in middle of typing, switching radio buttons and the interface becomes unresponsive, it's really not cool.

That's why I recommend you this solution:

  1. Make a request to server only when the blue button is pressed.
  2. Every time another button is pressed (or filter typed; any option changed) store options in cookies. 2a. Additionally, when options are changed, blink the blue button to indicate the need of pressing it.
  3. When another page loads, load options from cookies.
| improve this answer | |
  • So your suggesting solution 1, I also eventually ended up using that one! (didn't think about blinking button though, nice one!) Instead of cookies i'm using html5 sessionStorage :) – Bakaburg Sep 4 '12 at 23:39
  • I think I actually used both 1 and 2. I see only one drawback: if a user changes some settings, doesn't press the blue button, reads the results and forgets about changing settings (that could be hard because of the blinking button, but let's assume this), then refreshing the page or going on another page, he could be surprised that settings changed. Best solution to that is represent data in such a way, that the user clearly sees it's e.g. sorted ascending, not descending. – Markus von Broady Sep 5 '12 at 7:29
  • ah sorry i missed "another" in your answer and i though you meant the search button. Yep, maybe show different color code when the search results need refresh could be an idea. Already now I switch the search button color to either green, orange or red in case of succes, no results, or server problems. It remains switched for only one sec. Maybe I could left it switched until a change in the options is made and then switch it back to blue! I wonder how this will stack against user. they will have to understand that they have to change something to activate the button again – Bakaburg Sep 6 '12 at 1:13
  • maybe I could put a tooltip on hover on the switched button, explaining that they have to change something! – Bakaburg Sep 6 '12 at 1:15
  • 1
    Changing button color - I don't think that's intuitive. I would rather blink the button just because a user can't miss a moving or blinking button. To tell about success or fail, I'd simply show a new text line, colored red or green with message from the server. You could also disable the button after every search, or change it's caption to "refresh" (useful if data shown often changes, e.g. auction bids) or change it's caption and action to "next page". – Markus von Broady Sep 7 '12 at 8:42

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.