Yes/No button placement on confirmation dialog boxes

Question

I have seen various takes on the yes/no button placement on dialog boxes or confirmation messages over the years. For a long time, it seemed like I was almost always witnessing the "Yes" option being to the left of the "No" option.

However, it seems like there is a recent trend to place the rejection/"no" option to the left of the "yes" option. Google's Material Design specs even mention this, but they don't explain why (at least I couldn't find it).

From a UX perspective, is there a correct answer in regard to where the yes/no buttons belong on a dialog box in relationship to eachother?

Answer 1

Great question, really!

The problem does not lie in Yes or No. But if the action is Positive or Negative.

For example,

1. "Are you sure to permanently delete System32?"

   • Yes

   • No

2. "Are you sure you want to backup this photo?"

   • Yes
   • No

As you can see here, the principle of good design is violated. If you specify Yes or No in the UI of your website/app, you're likely to reuse it. Which causes most of the problem.

Regardless if the event is destructive or not, the User is confused with the Yes and No and might randomly click on one without reading.

A good designer will try to be accurate with the options he provides with the action to be performed.

For example,

1. "Are you sure to permanently delete System32?"

   • Delete Folder (Red Text)

   • Cancel (Accent Color)

2. "Are you sure you want to backup this photo?"

   • Backup to Google Drive.(Green Text)
   • Cancel (Accent Color)

The text color is completely optional. However the general rule of color psychology suggests that we all understand green is positive and red is negative.

Now however you place the options, if you have been specific and have stated in the option itself in what it'll do, the positioning will never be a problem.

However, I personally like positive actions to the Right and Negative towards the left.

Answer 2

To follow up on this, I realize the internet is inundated with articles discussing this topic. I posted this to start a discussion here to get various takes.

It seems like the general consensus is that so long as it is consistent in the application, either should work and there are arguments for both. If you are developing for a certain platform (i.e. Microsoft, Google, Apple), it is best to follow their respective design specs. User testing seems to be key in the decision as well if not developing for a platform in particular.

I have since found other articles on UX stackexchange, so I will go ahead and mark this as answered. Here is one I found the most helpful:

OK/Cancel on left/right?

Here is another interesting read:

http://www.nngroup.com/articles/ok-cancel-or-cancel-ok/