1

I'm working on a project and I found what I think is an issue.

The product is a kind of web editor. After making some changes, I go to change the page and get a confirmation dialog that says: "Page was not saved, Do you want to keep the changes?". The dialog has two buttons - Yes and continue without saving. See screenshot below.

Confirmation dialog

I'm really in doubt regarding that long button because it may cause confusion. Would it be more clear to change the buttons to Yes and Skip?

  • 2
    I'd say it's the 'Yes' button that is causing the confusion. You need to read the message, then read the buttons and finally re-read the message to be sure what 'yes' means. The 'continue without saving' button makes perfect sense just on its own. Removing words for that sake of brevity at the expense of clarity isn't something I'd go for. – JonW Nov 5 '14 at 18:38
  • 1
    I'd suggest changing the second button to "Saving is for chumps, I want to live dangerously." Also change "Yes" to "It's really important, try and save it again. Keep trying! Lives are at stake!" ... in all seriousness I think the Yes button is the issue... The green color + checkmark imply that it WAS saved, or something successful happened. – aslum Nov 5 '14 at 18:43
  • My issue here is not the buttons, it's the message. It's too long and confusing. If the message was, "Save changes?" the buttons would become much more clear. – IT Bear Nov 6 '14 at 5:34
1

Button should say what they do.

UXMovement has an article: Why Your Form Buttons Should Never Say ‘Submit’, which describes why providing generic terms...

gives users the impression that the form isn’t focused on a specific task. It also gives off the impression that your website isn’t user-friendly because you’re speaking in a technical way that most users aren’t familiar with.

When generic terms are used on buttons...

users could question what happens when they click the form button. This creates a level of uncertainty for users that designers can avoid by simply using a button label that describes the result of the user’s task.

You don't want to make your button less descriptive!

mockup

download bmml source – Wireframes created with Balsamiq Mockups

It doesn't have to be as lengthy, but don't hide it's purpose. "Don't save" is short and simple, but in the end there is nothing really wrong with your current label.

Having a way to back out of the action all together should be available (i.e., "Cancel") if, for example, the user accidentally clicked the button that caused this dialog to appear. Don't assume the "x" in the upper right corner is good enough.

"Yes" is also a problem, in which it doesn't tell the user what is going to happen. Label the button accordingly - for example: "Save".

@aslum also makes a very good point in the comments:

The green color + checkmark imply that it WAS saved, or something successful happened

Have an indication that the positive action (e.g., "Save") is the default action is good, but your current use of green and a checkmark do not favor the affordance of the button. Icons do not enhance usability.

  • i see what you saying there. i guess this is a good solution. thanks – evgeniy kazinec Nov 5 '14 at 18:59

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.