Do users actually use the arrows in <input type="number">?

Question

Does the average user actually use these really tiny arrows?

Answer 1

The answer will depend on multiple factors:

• What is the allowed range for the input?
• How far is the wanted value from the current value?
• What is the input being used for?
• What type of navigation does the user prefer?

The smaller the change of value, the more likely users are to use the spinner.

If the number input is part of a larger form that requires typing for a different input, users are more likely to type the number since they are already using the keyboard.

A lot of times it will come down to user personal preference though, since some users prefer clicking a mouse while others prefer keyboard navigation.

Many sites use the spinner idea, but with a nicer design, like the following example:

This design gives users the option to change the value with a mouse click, and doesn't require navigating tiny buttons.

Answer 2

It depends on the variability of the outcome it gives and it is usually used after using the keyboard to input a number and increment afterwards in a controled manner.

Example. I am trying to move an object in illustrator , I know I want it 200px from the top but when I see how it looks I want to adjust just 1 - 2 pixels, so I use those arrows to make incremental slow changes that I preview in real time. How much more time would I waste typing 199 , 200, 201, 202 ?

Usability and visually wise it has room for a lot of improvement but it serves it's purpose where needed.