Веб-юзабилити: сохранить и отменить ... или ... отменить и сохранить?

Windows и OS X всегда сталкивались с этим, но каково общее мнение о том, идет ли кнопка сохранения или кнопка отмены первой в веб-приложении?

[Сохранить] [Отмена]

или

[Отмена] [Сохранить]

Примечание: у меня есть эти кнопки в верхней части формы флеш справа.

9 ответов


следуя принцип наименьшего удивления: сделайте это способом Windows ([сохранить] [отмена]), если у вас нет оснований полагать, что пользователи Mac составляют большую часть вашей пользовательской базы.


инстинктивно я всегда ставлю кнопку Сохранить как правый элемент.

Я думаю, есть и другие вещи, чтобы рассмотреть. В первую очередь, нужна ли кнопка отмены или может быть более подходящим другой элемент (например, след хлебной крошки, указывающий на предыдущую страницу).

Edit:http://www.lukew.com/resources/articles/web_forms.html - раздел "первичные и вторичные действия" показывает, как визуальное взвешивание можно использовать для хорошего эффект.


ключ здесь в том, что мы говорим "веб" юзабилити. К этому моменту, я думаю, довольно ясно, что принципа наименьшего удивления ссылка в принятом ответе предполагает, что справа-прямое действие (сохранить), а слева-обратное действие (отменить), а не то, что предлагает принятый ответ.

веб-браузер является пользовательский интерфейс веб-пользователи наиболее привыкли, и 15+ лет веб-просмотра сделал это довольно ясно, что кнопка Назад находится слева от кнопки вперед. Он также jives с языками слева направо, для которых изначально был разработан веб. Правое-это то, куда вы идете, левое-то, где вы были.

даже в общем компьютерном жаргоне, передний Слэш,/, наклоняется вправо, а задний Слэш,\, наклоняется влево.

пользовательский интерфейс windows является выбросом здесь, и я думаю, что это плохое решение основывать свой дизайн пользовательского интерфейса на Microsoft старшинство.

Я мог бы указать, что ваше верхнее правое угловое расположение двух кнопок нестандартно, но я не думаю, что это влияет на порядок самих кнопок.


для всех горячих аргументов, которые может генерировать эта проблема, это, похоже, не имеет большого значения в реальной производительности человека. The преимущества и недостатки каждой работы, чтобы мыть. Пользователи появляются С равной вероятностью можно ожидать отмены слева или справа в веб-формах. Кажется, есть смещение в пользу отмены слева, если кнопки широко разделены, но вы не хотите этого делать, так как поставив кнопку Выполнить правые связано с медленными ответами и высокой частотой ошибок веб-формы.

Я бы сказал, что самое главное-быть внутренне последовательным в вашем приложении, и убедитесь, что отмена всегда помечена как "отмена" (а не, скажем, "возврат", как я видел в одном веб-приложении). В противном случае поместите кнопки рядом друг с другом и рядом с последним полем, на которое будет смотреть пользователь (которого, вероятно, нет в правом верхнем углу формы).

и не беспокойтесь об этом слишком много.


Это, вероятно, не большая разница в любом случае, если ясно, что делают кнопки. Мой личный голос был бы за сохранение слева, так как это то, что люди делают чаще всего, и люди читают слева направо.

кроме того, я бы также поставил некоторое пространство между кнопками, чтобы убедиться, что пользователи не случайно нажимают один, когда они пытаются щелкнуть другой.


зачем вообще нужна кнопка отмены?

в веб-форме пользователь почти всегда может отменить какое-либо другое действие. Установка "отмена" рядом с "сохранить" создает ситуацию, когда у пользователя есть хороший шанс запуск катапультируемого сиденья когда все они хотят сделать, это сохранить.


Я обычно ставлю кнопку, которая приведет к тому, что большинство действий произойдет дальше всего от центра. Если ваши кнопки вверху-справа, мой заказ будет [отмена][сохранить]


знакомство часто более важно, чем быть объективно правильным, поскольку незнакомые вещи часто, по умолчанию, менее полезны.

люди используют свой ПК с Windows или Mac больше, чем ваше приложение или веб-сайт. Так что, если бы я был на вашем месте, я бы выбрал порядок, который, как вы думаете, будет знаком пользователям, о которых вы заботитесь больше всего. Если это аудитория в основном mac, сделайте это так, как mac. Если в основном аудитория ПК, сделайте это способом ПК.


в нормальной форме, Save, должны быть под полями формы. Отмена должна быть слева или справа от сохранения, но не слишком близко чтобы избежать трагических ошибок. Луки Вт страница дизайна формы веб-приложения есть некоторые осветительные схемы.

ваша форма необычна тем, что вы хотите, чтобы кнопки были вверху. В таком случае мне нужно знать, как выглядит страница и как она будет использоваться. Но так как вы уже нарушаете любой поток между полями формы и Спасите, я подозреваю!--1-- > сохранить должно быть справа для поддержки естественного пути слева направо.

(Windows и Mac имеют разные стандарты для размещения кнопки в диалоговом окне, и у них обоих есть кнопки внизу. Эти стандарты не применяются к веб-страницам.)