Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

When I'm casually surfing the internet, I stumble upon random buttons that I'm not really sure if they're going to open up a modal or just slide down a div so I just get scared of clicking them in fear of having the page to refresh and load the DOM again making me wait extra seconds in the void.

This is a true phenomenon that I have observed with clients. If my clients of X website knew that Y button will just fadeIn() a small div, they are more likely to click on the button and see what happens.

share|improve this question
    
Well, I have the habit to look upon the status bar at the bottom, true link show the post back url, ajax button/link don't. –  RMalke Mar 8 '13 at 19:32
    
I find your use case quite bizarre. Your clients will click random buttons on the website? Don't you want users to click the buttons they need to click to achieve their goal? –  Steve Mar 9 '13 at 11:27
    
@Steve the question is, how can one differentiate between a tab button or a normal button. If the content is 0.001ms away, I would rather click it than not. –  Wololo Mar 9 '13 at 22:25
add comment

2 Answers 2

Users on general wouldn't know the difference between a javascript-library-enabled partial undisclosure of an element and a refresh of the page. There are no conventions around for letting the user know the difference. And I agree, with todays heavy web apps which takes three four seconds to load, it really would be useful to know the difference. Or not.

The real problem here is not wheather it's an AJAX load or a full refresh. the problem is the very long loading times. That's the problem we should adress in terms of User Experience. It's not an issue how to differenciate post backs from client side scripting with button color, label or title-attributes. We need to focus on the problem and not solve the symptom.

But this won't be solved in a flash. So in the meanwhile I would suggest an intense color (red!) for the button who makes the full post back, and a less prominent color for "lean reload" (gray!).


Good and important question!

share|improve this answer
add comment

Some UI hints that may help:

Ellipses and Arrows

Historically, Ellipses have been used to indicate the presence of a modal popup. Example: File->Print... indicates that a dialogue box will open for the user. Ellipses would probably suggest an AJAX action.

Submenus are usually hinted using arrows.

Tabs

If the page is meant to represent a single record but the record has information divided into different groups, the groups may be represented as tabs. Since all of the data is part of a single object, it is expected to load without refreshes.

Some of the stackexchange websites use tabs to represent different sections of the website. The sections are not part of the same document / object, and so are not expected to load without refreshes.

Button text

The default unstyled submit button has had a long enough history with full page refreshes that "Submit" by itself should probably suggest a page refresh. I don't think the converse is true, though.

Multi-part forms usually have buttons that indicate a final action, "Submit", with buttons before that for "Next". From the user's perspective, you should be able to "take back" the "Next" action before the final Submit. Refreshing gives a sense of finality to it, so you probably want "Next" to be in Ajax.

Feed-like interfaces

Applications like twitter and facebook that have a dynamic Ajax stream suggest that the submit button is also Ajax. In both applications, the button "activates" only upon entering text into the feed interface. A visual suggestion that the button is linked to the stream is also helpful. With twitter, there is no other place for your posted data to go but the central stream. With facebook, the post button is placed immediately above the stream, looking like an element inside the stream itself. In both, the color of the activated button looks like the links in the stream itself.

I'm not sure how this applies to stackexchange's "post your answer" button. The plain styling and finality of the wording suggests that the page will refresh, but the presence of the post textarea in the stream suggests that the text will appear in the stream shortly.

I'll post and see which it is .

share|improve this answer
add comment

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.