I'm using jquery-payment from Stripe. Should I switch?
You should be fine. I use it along with the technique in this blog post to make a nice stripe form that dynamically displays the card logo....
How to Correctly Detect Credit Card Type
11–20 of 67 posts
Re: How to Correctly Detect Credit Card Type
#12Another 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).
Re: How to Correctly Detect Credit Card Type
#13Earlier quoted context omitted.
I'd say in part because you want to give people a UX they are comfortable with. Sites for years have been asking for "Card type", and so a user may suspect something is wrong if they don't need to enter it and show no indication you know what it is.
That seems unlikely, but I've certainly been wrong about UI questions before. I'd be very curious if anyone has any data supporting this idea.
Unfortunately I don't have actual numbers for you, but a company I used to work for that did a fair bit of CPO had good data that removing that selector reduced conversions (the most interesting thing to come out of that study was that, at the time and with our client base, removing the actual card logos (e.g. leaving only the textual names) increased conversions).
Re: How to Correctly Detect Credit Card Type
#14There's a small bug with the security code tooltip. Click the ? to open the tooltip (shows AMEX), focus the card number field, select-all (cntrl-a/cmd-a), then type "4". It still shows AMEX in the tooltip instead of visa. Closing it and opening it will still show AMEX.
Re: How to Correctly Detect Credit Card Type
#15Another 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
The home page of this article has a section comparing text inputs vs drop downs [1].
Re: How to Correctly Detect Credit Card Type
#16Hi, my credit card company is not listed there, yet it exists: my IIN is 6371.
I'm afraid this is not completely accurate at all. There are many credit card IINs and those are just a very few and will not work with some international cards (including international visa cards). Those numbers are issued by the American Bankers Association - in accordance to ISO 7812. They are not attached to a credit card flag, but to a company and a single company can have only one IIN. What happens is that Visa is composed of many companies in many countries, that's why they have many IINs which may or may not start with the same numbers, there are no strict rules about that.
The number this website calls 'prefix' is actually named IIN and it's composed of 6 characters, not 4 (nor 2 or 3). They are disposed in groups of 4 for a variety of reasons and no issuer owns whole lots of IINs.
The only completely correct way to detect a credit card is to just contact ABA to obtain a list of issued IINs.
This is what an issued IIN looks like, we also have many:
https://drive.google.com/file/d/0B-Sa2A0cesh4eDVMY3NwQ3ZEVlZ...
I also built a thing to help me parse those numbers (ruby):
Re: How to Correctly Detect Credit Card Type
#17The root lesson here is pretty simple but important: you should usually avoid using regular expressions in places where readability and ease of update is a concern.
Using a complicated one line regular expression to do all the magic is fun, but its a nightmare to maintain and figure out how it works later on.
Re: How to Correctly Detect Credit Card Type
#18Another 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
I 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.)
Re: How to Correctly Detect Credit Card Type
#19Does this integrate with Recurly?
Re: How to Correctly Detect Credit Card Type
#20Why is detecting credit cards even useful?
I know what card I have, you telling me "Yep that's a VISA card" isn't really that helpful. Yes, I might enter the first four digits wrong and see the wrong card icon light up may help me a little, but aren't I just as likely to enter the last 12 digits wrong. In the case of VISA you're pretty much just telling me "Yep, that first one is a 4".