You know those boxes on ecommerce sites where you specify how many items you want to order? What is the most UX friendly way?

Usually I trust on Amazon.com when it comes to UX, but they use a dropdown menu for order quantity. That just seem very user unfriendly to me. Personally I am leaning towards an input box with a + - on the right side. Is there any research done on this? If so, where can I find it?

Surfing on the web, I found most sites use either one of these: enter image description here


I've always found that it's extremely dependent on usage.

If you predominantly sell individual jelly beans in bulk, yes, I'm going to want to type out 34525. Not pick it out of a menu or click (+) 34525 times.

If you have a hard limit (No more than 10, increments of 5000) a combo box is needed to regulate input.

But in normal use, assuming most people will only buy 1-2 but some may buy more, give them both options with the previously suggested spinner box.

The reason I would say to avoid a pure text box in most cases is it doesn't give me a mouse only option. People moving but their hand will always be on the mouse. That is not necessarily true for the keyboard.

| improve this answer | |

unless you have some kind of specific limitations on quantity of your products (i.e. limit 2 tickets per order), i would just use a normal text field. If you do have limitations, a dropdown is probably appropriate since you have a finite number of options and you can only choose one.

| improve this answer | |
  • 1
    I find myself unwilling to use steppers next to input fields since their click targets are so small, and I often need to go more than just 1 or 2 increments. – sirtimbly Jun 8 '12 at 16:51
  • Text field with or without those + - buttons? I see some sites without it, but that forces the user to use the keyboard (if they want to order more). – Martijn Oud Jun 8 '12 at 18:14

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.