Исследование. Кнопки

[ksoftware]

Раньше при создании программ для дексктопа я особенно не парился на счёт кнопок, так как использовал стандартные виндовые. В вебе кнопки могут быть какими угодно, поэтому надо разобраться с ними получше.

Постите всё, что знаете про кнопки. Какие они бывают? Как устроены? Какие где должны быть градиенты тени, рефлексы, бортики и т. д. и почему они

Comments

[shockone89]

Кнопки должны быть объемными.

[ksoftware]

Почему?

[sanch3z_ru]

Потому что кнопка - это объект реального мира. А в реальном мире почти все кнопки объемные.

[valiullin]

Не всегда есть смысл тащить объекты реального мира в веб.

[ksoftware]

То что надо!

[shockone89]

Перевод на хабре:
http://habrahabr.ru/blogs/design/103317/

[valiullin]

Мне кажется неправильно делать навигацию кнопкой.
Основная задача кнопки - выполнить действие.
Навигация всё же должна быть в виде ссылки.

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

[skrpnk]

В вебе системные кнопки бывают в пяти состояниях:
1. По умолчанию
2. При наведении
3. При нажатии
4. В фокусе
5. Выключенное

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

[valiullin]

Что-то я с трудом представляю как пользоваться клавиатурой для навигации.

[ksoftware]

Ну табом по кнопкам скакать...

[valiullin]

Это явный жесткачь.

[skrpnk]

Ну и очевидное: хочешь сделать, чтобы на кнопку чаще нажимали - сделай её большой и красивой.

Про размеры кнопки - к Фиттсу: http://habrahabr.ru/blogs/ui_design_and_usability/31519/

[ksoftware]

А про красивость что скажите?

[skrpnk]

Мне как пользователю больше нравятся системные кнопки из-за их узнаваемости и предсказуемости.

Если бы передо мной стояла задача оформить какую-то сверхважную кнопку, то я бы сделал её объёмной и избегал бы красного цвета как символа опасности (если, конечно, красный не основной цвет фирменного стиля или если это не кнопка «запустить ядерные ракеты» :)

[skrpnk]

Остальное - дело вкуса.