3 ms·
Another usability tip on credit card forms: Don't use drop-downs for the expiration date. People are just typing them directly off the card, let them type them
by birken 13y ago
Another usability tip on credit card forms: Don't use drop-downs for the expiration date.
People are just typing them directly off the card, let them type them. Don't force them to deal with large and annoying select boxes. Stripe checkout[1] is a good example of how to do it (though by no means were they the first to do this, just a popular example).
1: https://stripe.com/docs/checkout https://stripe.com/docs/checkout
- davekt 13y agoThe home page of this article has a section comparing text inputs vs drop downs [1]. [1] http://creditcardjs.com/#drop-down-for-expiration http://creditcardjs.com/#drop-down-for-expiration
- danielweber 13y agoI can type right into a drop down, and 99 times out of 100 it will do the right thing. (Sometimes it's weird with a list of states, where it might be sorted by the state abbreviation while showing the state name or vice versa.)
- josso 13y agoUnfortunately, many payment systems represent the dropdown for the months with zero-padding while others are without. Usually, typing the 0 (because it's on the card) will – if it's not included in the dropdown – not select the correct month. This can cause frustration for the end user. The best way to input credit card information, would be to only have text-fields.
- mrobins 13y agoagreed but on mobile I find spinning through the drop-down more annoying than typing the exp date.
- kalleboo 13y agoI really hate the spinner for all the date selectors on iOS - it's cute, but a keypad is way faster.