Рекомендации по выбору кнопки над ссылкой в ​​веб-формах

Question

Кажется, что кнопки и ссылки взаимозаменяемы в наши дни. Существуют ли рекомендации по выбору между ними с точки зрения пользовательского опыта? Это вообще имеет значение?

Как правило, я бы сказал, что чистая навигация всегда должна быть выражена ссылкой, а действие должно быть выражено кнопкой. Но есть очень много примеров и ситуаций, таких как страница Адреса доставки Google Checkout . Сохранить выполняет действие и использует кнопку. Редактировать - это ссылка, которая переносит пользователя на новую страницу. Оба имеют смысл. Однако delete выполняет действие со ссылкой.

Итак, когда, как и почему мы выбираем кнопки или ссылки?

Примеры сценариев:

Страница с сеткой пользователей:

• Функция добавления пользователя , которая переносит вас на новую страницу. Ссылка, потому что она перемещается.
• A функция сброса пароля , которая остается на той же странице. Кнопка, потому что это действие.
• Функция экспорта в csv , которая открывает окно загрузки, но остается на той же странице. Я не знаю.
• Пейджер внизу сетки, который использует AJAX для обновления сетки. Ссылки из-за существующего приоритета.

Мастер с функциями «Далее», «Назад», «Отмена» и «Готово». В то время как Next и Back, вероятно, должны быть ссылками, приоритет говорит, что все они должны быть кнопками.

Answer 1

Хорошие ресурсы: Нильсен (дух) и это обсуждение

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

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

Я согласен со всеми 5 вашими примерами, хотя Download CSV может быть безопасным и во многом зависит от того, как выглядит остальная часть пользовательского интерфейса (например, если он является частью панели действий, таких как «Download» | «Options») | «Закладка», а две другие - это ссылки, тогда ваша, очевидно, тоже должна быть ссылкой.

Answer 2

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

Таким образом, если в поле «Добавить пользователя» есть поле выбора, для которого добавляется тип пользователя, так как оно может определить, какую форму добавления пользователя использовать, тогда кнопку.

Для сброса пароля, поскольку он остается на той же странице, тогда кнопка может иметь смысл.

Я склонен делать Далее, назад и т. Д. В виде ссылок, поскольку у меня могут быть слова или изображения, но мне нравится рука, которая появляется для ссылок.

Экспорт в csv должен быть кнопкой, так как вы никуда не денетесь, просто делаете загрузку.

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

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

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

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