448

You can tell if it's a Visa or MasterCard based on the number it starts with, i.e. 4 for Visa, 5 for MasterCard. Why do most billing forms request the type of card?

  • It's not a barrier for bots (to my knowledge).
  • It's redundant information.
  • It's an additional button to click for someone about to pay for something.

Why? If it's for consistency of experience for users:

"Wait, why wasn't I asked what type of card I had? Everyone always asks that! Something's fishy here."

Why not just show them "Visa" (or whatever card symbol that they have) as they start typing?

Improve this question
37
  • 6
    @tim.baker I'm not sure it's a duplicate, but it is highly relevant (this question is 'why do forms ask for card type' whereas that question is 'should I autodetect card type'.). Highly related, but not a duplicate in my opinion.
    – JonW ♦
    Jan 31, 2014 at 13:11
  • 23
    For that matter, why do credit card forms prohibit me from entering spaces in my credit card number? It's much easier for me to double check the number when I have spaces than when I have a single 16 digit number. Though the forms that have separate boxes for each 4 digits are even worse from a usability perspective.
    – Johnny
    Feb 1, 2014 at 6:35
  • 6
    Deduce the credit card company based on the first digit? Bad idea. The moment the convention changes (in other words, if Visa starts running out of numbers, and starts beginning credit cards with an 8, e.g.), then you have a maintenance nightmare nightmare on your hands. It's only redundant information as long as the convention never changes – and conventions do tend to change over time. There was a time when all U.S. area codes had a 0 or 1 as their middle digit, for example, which is why we didn't need to dial the area code for all long distance numbers back then.
    – user11900
    Feb 2, 2014 at 9:37
  • 3
    @J.R.: I don't think Visa is likely to run out of numbers before the Sun expands and destroys the Earth.
    – Wooble
    Feb 3, 2014 at 17:47
  • 3
    @J.R. The numbering system isn’t a convention. It’s based on an international standard, and, as a result VISA can’t unilaterally change to putting an 8 on the front. Deducing the card type from the IIN range (the IIN is the prefix on the front of the card number, and is the thing covered by the standard) is a perfectly valid thing to do.
    – al45tair
    Feb 4, 2014 at 11:33

10 Answers 10

Reset to default
510

Why do credit card forms ask for Visa, MasterCard, etc.?

The simple answer is that 10-20 years ago, no one knew any better and it sort of just became the convention.

A slightly more complex answer indirectly deals with PCI (Payment Card Industry) compliance. If you want to accept credit cards online, you have to have an IMA (Internet Merchant Account). You may obtain your IMA through a bank or PSP (Payment Service Provider).

For the sake of this scenario, we will assume you are not PCI compliant and elect to go through a PSP to obtain your IMA and to process credit card transactions. At that point, you are at the mercy of whatever PSP you choose to go with. If their credit card form asks for the card type, then by proxy you are asking for the card type. Obviously, you decide what PSP you want to use, so you can find one whose credit card form has the functionality you want.

The good news is that the convention is changing to more of a user experience convention.

Designmodo has a great article called The Ultimate UX Design of: the Credit Card Payment Form.

Here are some quotes from that article:

Help people succeed

Will you help your users succeed in their purchase, or rather make it really hard for them? It’s up to you.

If you ask for tons of optional information, therefore risking distraction, have unclear labels, or don’t inform what type of credit card you accept, your call to action is obscure and data transfer isn’t safe… don’t be surprised if many people will leave the process without completing the payment.

You’re not helping them. You’re creating additional obstacles.

Amazon Credit Card UI Design Pattern

Amazon tries to be as simple as possible

They also minimized the information needed to just “Card number”, “Name on card” and “Expiration date” fields. In most cases they don’t even ask for the infamous CVV code (though how they manage to proceed with the transaction without the CVV is somehow mysterious).

Amazon tries to help their customers to go through the process as quickly as possible.


Do the job for them

Gumroad choose the same way of pointing out to the user that they know what kind of credit card you’re using.

Gumroad Credit Card UI Design Pattern

Technically it’s rather simple. Credit card numbers are created in a consistent way. American Express cards start with either 34 or 37. Mastercard numbers begin with 51–55. Visa cards start with 4. And so on. This information can be used to detect what type of credit card someone is using simply by looking at their credit card number.

Comments to this answer, since removed, brought up another question:

Do you have to display credit card logos?

With respect to displaying credit card logos @ChrisLively mentioned the following:

The reason sites put the logos up and ask the user to select is because VISA, MC and others either require it or give slightly better rates when you do. Period.

He did not cite a source, but @alastair mentioned the following later:

The bit about displaying logos is part of the scheme rules (requirements of which are typically passed on to merchants by their acquirer); MasterCard’s website mentions that it’s compulsory. I’m not sure where VISA and AMEX mention it (or whether they mention it) on their websites.

In the MasterCard Acceptance Mark Uses source @alastair cited, it says the following:

Display the Acceptance Mark at parity with all other acceptance marks/symbols/logos also displayed (with the exception of MasterCard POI locations in the U.S., where a specific regional Standard that permits otherwise exists. Refer to MasterCard Rules, Rule 5.11.1 "Discrimination" of Chapter 15, "U.S. Region Rules").

This is sort of confusingly worded. Due to the use of the word parity in that statement, it seems to me that you only have to show their logo if you show other logos, as parity means equivalent to, or a state of equality. I could be wrong though, it doesn't seem to be very clear.

Later on the same page, it seems to clarify things a little bit more:

Use on Internet Merchant Locations

At internet merchant locations, cardholders must be able to determine immediately that the particular brand is accepted. The most effective way to ensure this is to display the appropriate Acceptance Marks on the merchant's home page. At the very least, the appropriate Acceptance Marks always must be displayed where payment options are presented.

So here, the last sentence MasterCard states that Acceptance Marks always must be displayed where payment options are presented. However, they don't tell you what happens if you don't.

In conclusion, it seems that you should display credit card logos, but I'm not sure if it's an actionable offense if you don't. If anyone has a source that clarifies whether or not it is, I'd love to know and update this section.

The last thing I want mention piggybacks the original question by asking:

How can I automatically detect the credit card type so I don't have to ask for it in the form?

So for those who are curious about or don't know what the breakdown of the credit card is, I found an article on Mint.com that has an info graphic that breaks things down rather well. As a bonus, it also shows you how validate a credit card number with your mind by using the Luhn algorithm:

Mint.com: Cracking the Credit Card Code Info Graphic

Now, as you should have noted from the info graphic, we are able to determine the type of a credit card by looking up the first 6 digits of the card number. These first 6 digits make up what is called the credit card's IIN (Issuer Identification Number) or BIN (Bank Identification Number).

There are a few ways you can perform a lookup of an IIN:

  1. Make your own database comprised from the known IINs listed on Wikipedia for you to query. This list is pretty much outdated, however.

  2. Use BinBase's lookup feature.

    a. You only get a limited amount of free lookups and then you have to purchase a license.

  3. Go through ISO by purchasing ISO/IEC 7812-1:2006 and/or ISO/IEC 7812-2:2007.

    a. ISO/IEC 7812-1:2006 specifies a numbering system for the identification of issuers of cards that require an issuer identification number to operate in international, inter-industry and/or intra-industry interchange.

    b. ISO/IEC 7812-2:2007 is one of a series of International Standards describing the parameters for identification cards, and the use of such cards for international and/or inter-industry interchange. It describes the application and registration procedures for numbers issued in accordance with ISO/IEC 7812-1.

Improve this answer
18
  • 2
    I still dislike the use of the word “convention”, since it really was just collective laziness and/or ignorance. A convention is something people agree upon. However, your answer is now much improved so I've up-voted it.
    – al45tair
    Feb 6, 2014 at 9:18
  • @alastair - I hear you. I think some people think of it in terms of it meaning the same thing as a standard or best practice, but that really isn't the case. One of the definitions of convention states that it is a practice established by usage. That's why I said it became a convention due to the, as you stated, ignorance. I did find a decent article talking about the differences between convention, best practice, and standard. Take a look and tell me what you think. That said, thanks for the upvote!
    – Code Maverick
    Feb 6, 2014 at 15:29
  • Interestingly that Design Modo article misses a trick; if you’re using drop-downs for the expiry date, you should ask for the year first. That way you can provide a sensible set of months if they pick the current year. (Yes, people routinely try to use expired cards...)
    – al45tair
    Feb 6, 2014 at 15:38
  • 1
    AFAIK (but I may be wrong) the CRV code is not required and only optional, but useful in case of fraud/dispute. It you as a merchant didn't ask for it, the transaction will go through but will be at a riskier position.
    – Alejandro Mezcua
    Feb 8, 2014 at 19:53
  • 1
    @AlejandroMezcua You are correct
    – Izkata
    Feb 8, 2014 at 20:31
77

This is also a way to let the user know which cards are supported by the merchant. If you only see Visa and Mastercard options available, you won't pull out your Amex and punch all the numbers in just to have the site tell you they don't accept Amex.

Many sites do not accept Amex or Discover because of the extra fees they charge for processing. Users with Amex cards will usually check the list first preferring to use their Amex, but if it's not listed they will (begrudgingly, in my experience) fall back to their Visa or MC.

Improve this answer
13
  • 9
    This, I think, is the most convincing UX reason. By forcing the user to select card type first, also reduces the risk of pulling the wrong card out your wallet and charging something to it by mistake.
    – calum_b
    Jan 31, 2014 at 9:35
  • 6
    While I agree with most of what you said, you don't have to process the card to see if it's a valid number. That's what the Luhn check is for. So you can prompt the user to enter a valid card before processing. Also, they don't have to type all of the numbers before telling them it's not supported if you choose not to have card type as a field. They need only to type in the first couple digits for that.
    – Code Maverick
    Jan 31, 2014 at 13:43
  • 18
    There's no reason to have a UI control for this. Just have a few small card logos indicating what the vendor accepts. Unlike a popup you can just look at the icons at a glance, rather than having to click on something to see the list and you get the visual logo that matches up with what's on the card itself. Less work for the user for more clarity.
    – BergQuester
    Jan 31, 2014 at 14:40
  • 5
    Why do I have to click a combo box to see what types of cards are supported? The "accepted payment method" logos are small enough to fit in the payment screen. I'd rather look at the logos, see my card is supported, pull it out and start typing away.
    – pwned
    Jan 31, 2014 at 16:44
  • 9
    This is just an attempt to justify poor UX after the event. There’s no reason to ask people what type of card they have; not only can you detect it automatically in many cases, but you’ve already shown people card logos at that point (you have to; it’s part of the card acceptance agreements), so they know what you support.
    – al45tair
    Feb 3, 2014 at 18:08
44

It probably is possible to design a system that figures that out on its own but it isn't great systems design to set it up that way. Different cards have different numbers of digits and it is best to explicitly state how the system should parse the values and number of digits it should expect. In the case of an error, it makes error handling easier as well.

If the consumer says it is an American Express card yet enters more than 15 digits, you can check against the first digits of the card to cross-check the type of card and, if that matches, give an error that extra digits were entered. Without that cross-check, the source of the error may be harder to figure out.

Also, it simply a way to verify the credit card. It's a check. It's also very helpful for the consumer. If he intends to pay with his Visa and he grabs his wallet and starts type 5455... he may then say "Whoa I didn't want the MasterCard."

The number of digits really isn't an issue. The first set of numbers determine the type of card so they don't need all the numbers.

Improve this answer
21
  • 8
    That said, many systems systems can handle all of the above without having to ask the user what card it is. Inline validation to show the card type automatically as the user types would essentially accomplish the same as above without burdening the user.
    – DA01
    Jan 31, 2014 at 3:10
  • 57
    Sorry, but IMO it doesn't make much sense... There is already a lot of redundant information to check for errors from the supplier (number + name + date + CSV) to see if it was a valid card. It's just another barrier for the user because that's how it's been done. Avoid setting up as many barriers as you can.
    – Francisco Presencia
    Jan 31, 2014 at 3:48
  • 12
    I, too, disagree. Luhn's algorithm is already used in credit card numbers, so the user can't typo the number and still have it be valid (probably), and you can display the type of card as they type. I don't see what advantage you're getting from forcing them to pick.
    – Phoshi
    Jan 31, 2014 at 9:37
  • 2
    @nmclean: There are very few people who look only at the keyboard while typing.
    – MSalters
    Jan 31, 2014 at 14:53
  • 3
    @MSalters There are very many people who use credit cards.
    – nmclean
    Jan 31, 2014 at 14:54
18

My answer won't be voted up but you need this one if people from China is in your customer base, which is roughly 20% of earth's population.

Most online transactions in China are though 'UnionPay' system in a certain stage, and most of them are not MasterCards, none are VISA cards (due to some nasty competition issue between UNIONPAY and VISA). It is a monopoly, but that's a fact of life. Many users do not know that they need a MASTERCARD or VISA in order to pay outside of China, and those who do, do not know whether your website is outside of China.

So in the world's largest e-commerce market, billions of users are paying online with a card that has only UnionPay logo, unfit for most international online transactions, everyday. When they visit your website, which may be even in Chinese but doesn't process payment in China (and not through UnionPay), having to choose VISA/MASTERCARD effectively turn the problem "Your website doesn't process my payment" to "Your website doesn't support my card", which gives the user a clue to seek a solution on his own (let's find a card that is supported by this site) instead of sitting there frustrated.

The same may even be true in other countries int the second / third world, that most of the bank cards floating around being used for payment everyday are not one of MASTERCARD/VISA.

You can argue that you let them type the card number. If it is neither MASTERCARD nor VISA, nor anyone your system supports, you can display a message saying "We only support this, this and this, and your card is not one of them". If you added this in your question, I wouldn't need to post this answer.

On a side note, equipped with billion-numbered users, UnionPay wish to be accepted as an international payment method, direct in competition with MASTERCARD, VISA and American Express. I hope they are not so easily accepted, because that would be a wrong lesson, that "You can win the world with China's government-lead monopoly business".

Improve this answer
10
  • Not upvoting, but that's basically because this kind of national systems should be sorted out first. In the Netherlands, I'd expect to pay by something called iDeal (which uses the two-factor authorization of my bank and is a lot safer). A Credit Card form should only appear in the payment flow after these national options have been skipped.
    – MSalters
    Jan 31, 2014 at 9:44
  • 2
    In Germany, credit card payments are unusual too. But the customer doesn't choose from a list saying "sofortüberweisung or lastschrift or master card or visa", he chooses from a list which says "sofortüberweisung or lastschrift or kreditkarte" and after I have chosen Kreditkarte, I still get the question about Mastercard or Visa.
    – Rumi P.
    Jan 31, 2014 at 15:28
  • "online transactions in China... none are VISA cards" is a strange assertion, but it depends on what you really mean. Many credit cards are dual UnionPay/Visa or UnionPay/something, and services like Alipay and 99Bill allow you to pay using Visa online too. It's usually only debit cards that are UnionPay-only.
    – Xiaofu
    Jan 31, 2014 at 17:11
  • I haven't see a new VISA card issued for almost a year now. I remember in 2004 when I got my first credit card, there are more dual VISA/Unionpay than MASTERCARD/Unionpay, but now they are Matercard/Unionpay. If you know a bank still issuing VISA/unionpay in 2013? And, it is veritable that most bank cards are not associated with either (although most credit cards are, it is actually not required - I have Bank of American /debit/ card that can do VISA).
    – Tankman六四
    Feb 1, 2014 at 14:40
  • Similarly in India, Maestro is common
    – Rishi Dua
    Feb 1, 2014 at 18:23
8

The last time I paid an invoice with PayPal it automatically detected the type of card I was entering. I was a bit surprised to not have to enter my card type but I was reassured after seeing the correct card type highlighted.

TL;DR the whole thing but here is an article with a few other examples I found after a quick search: http://webstandardssherpa.com/reviews/auto-detecting-credit-card-type

From my perspective it is nice to have the card type automatically detected but I can see how it might be more complex to implement. For the majority of projects I'm involved in, implementing this would fall under the "will it make us more money?" objection and likely wouldn't be a priority. Your situation may be different and I would welcome this as a standard practice.

Improve this answer
4
  • It will make more money if the system is used and if its use makes money. The objection might be "how much more money compared to alternative ways to spend resources" and it should be easy to overcome.
    – Roman Boiko
    Jan 31, 2014 at 7:21
  • My point was there likely won't be any lost sales/transactions from not implementing the automatic card type detection. In the future that may not be true if it catches on and becomes standard.
    – marshalld
    Jan 31, 2014 at 15:35
  • 2
    It's almost certainly less work to implement this than to figure out if it's worth bothering or not.
    – SamB
    Feb 1, 2014 at 2:07
  • Though note that the code on the link you gave doesn’t actually work properly for some cards — e.g. Maestro cards are all over the number space, but are processed by Mastercard (and typically you can tell the card processor that they’re Mastercard cards to do that).
    – al45tair
    Feb 3, 2014 at 18:06
8

Many early e-commerce systems were fairly unsophisticated and were just text boxes that passed payment data along, so they had to record the card type to pass along to the payment processing system. I think that has just become a standard that has stuck.

Payment processing systems need to know what type a card is so that they can pass it on to the relevant payment system (Visa, Mastercard or AMEX, or in some cases a country-specific system like Switch or EMV). Unfortunately, it is quite difficult to determine from the card number exactly which type of card you have been presented with; there is a database of “IIN numbers”, which form the first part of the card number, but it is not easy to get hold of.

FWIW, all card numbers starting with the digit “4” belong to the VISA system. Card numbers starting “34” or “37” belong to American Express. The other card schemes are trickier and tend to be rather fragmented (in particular, Maestro is part of the Mastercard system, but for historical reasons there are Maestro-branded cards dotted all around the number space; as a result, it’s probably best to regard cards as Mastercard unless they belong to a range you know isn’t Mastercard’s).

See Wikipedia’s list of IINs for more information.

Improve this answer
4
  • This is the only correct answer, and has only three votes, as opposed to 330 votes for the huge wrong answer with all the graphics, above.
    – al45tair
    Feb 3, 2014 at 17:48
  • 1
    @alastair This is not "the only correct answer"; the accepted answer also states "that is what the convention was" which is just as valid as this answer. You may consider huge answers with graphics less desirable, but I prefer the inclusion of references, especially the link to the article which describes how the convention is shifting. I guess my point is: You stated your opinion as fact when 330 others have already disagreed; maybe try to be a bit more open minded.
    – Jesse Webb
    Feb 3, 2014 at 22:27
  • @JesseWebb “That is what the convention was” is simply not an answer to the OP’s question. It’s also wrong. It’s never been a “convention”.
    – al45tair
    Feb 4, 2014 at 7:58
  • 3
    I went with the answer I did because I addressed the question of why some sites ask for the card type. The accepted answer addresses why sites no longer need to ask. It is well put together and I don't begrudge the points, I just took a different approach. I was working with ecommerce in the 90's and I can tell you it wasn't convention, it was that the expectation of quality wasn't as high and some people got away with unsophisticated HTML forms that leveraged an out-of-the-box CGI that mailed them the info or saved it to a file or db. Laziness in a market that accepted it - that's it
    – Daniel
    Feb 4, 2014 at 14:56
7

It sends a signal on which payment methods you're accepting. Arguably, it could be equally well-accomplished by displaying the logos, but this way the customer who tends to ignore any extra information and immediately proceeds to fill in the numbers won't be told "Sorry, we don't accept Discover round here" after they've gone through the whole process of pulling the card out and entering the numbers in.

Improve this answer
2
  • That’s a justification for including it, but it isn’t why it’s there.
    – al45tair
    Feb 3, 2014 at 18:03
  • The real answer is that it doesn't have to be there, but is a nice UI hint.
    – dangerous-when-sober
    Aug 5, 2017 at 0:51
7

The fact that your credit card has been issued by Mastercard, Visa or American Express is not necessarily related to the method of payment. While this is true for chip-less cards, it is not for cards which embeds a chip.

The Europay Mastercard Visa (EMV) standard specifies how the chip should behave, and one of the features of these chip is to support multiple applications. Each application is tied to a specific method of payment and depends on your credit card issuer and your bank .

The form asking you to select between Mastercard, Visa, etc. does not asks you for the card issuer, which can indeed be deduced from the card number, but for the method of payment, even offline.

With chip cards this is (generally) automatically selected by the physical payment terminal, depending on the card and the terminal capabilities. For example, when I use my card in France, it use the "CB (Carte Bleue)" application, common to all (or most) card issued in France, but if I use my card in the USA it will use the Mastercard application which is understood by both my card and the payment terminal. The application ID is printed on the ticket.

Offline, there is no mean to know the list of applications supported by your card which tells how the payment system should behave, so it needs to asks you. Most people will use the card issuer's method whose logo is printed on the card (Mastercard, Visa, etc.), but other methods could be available.

It is really frequent in multiple countries to have a payment method different from the card issuer's one, even if both could work to fulfill your payment (see Zhang Weiwu's answer related to China).

Depending on the payment method you choose, the payment system will have an according behavior (e.g. two-step authentication, ...).

Improve this answer
3
  • 1
    You realize, of course, that it is impossible to make a chip-based payment merely by entering the number printed on the card, and so all of the material about chip-based payment is irrelevant to the question, right?
    – SamB
    Feb 1, 2014 at 2:10
  • My point was on the variety of possible payment methods available with a single credit card, with the chip's applications as an illustration of this behavior on physical terminals.
    – strnk
    Feb 1, 2014 at 10:43
  • This is completely irrelevant to the question posed by the OP. Quite why six people would up-vote it I don’t know.
    – al45tair
    Feb 3, 2014 at 18:04
5

Many of the answers I've seen have been very enlightening but I want to throw another angle based on my own experience.

Many forms which are prevented to the user to collect money need to be signed off by banks and financial institutions involved. These often have very strict guidelines surrounding layout and format of the fields. Any deviation from this layout will prevent them from endorsing (or sometimes accepting payments) from your application.

As such a standard template is often kept.

Improve this answer
4
  • That makes sense, do you have evidence that banks want to sign off on payment pages? Can you link to it?
    – Aaron Hall
    Jan 31, 2014 at 13:27
  • I don't I'm afraid - I had a quick google but I'm afraid I couldn't find any to hand. I'm simply going from projects I've worked on previously. I'll try and track some down.
    – Liath
    Jan 31, 2014 at 13:29
  • Good idea, I'd like to see an example but I'm sure it's out there somewhere. Banks or more specifically card processors can be very picky about situations where a physical card isn't taken as payment. I've even run into an issue where we couldn't put the word "BETA" next to a logo due to the card processor's terms.
    – marshalld
    Jan 31, 2014 at 15:45
  • This isn’t the reason. Card processors do check card forms, but they don’t care whether you have a question about card type on them or not. They do need that information, however, and they usually (and stupidly IMO) rely on merchants to supply it.
    – al45tair
    Feb 3, 2014 at 18:02
0

For many sites it might be lazyness/cargo culting.

But for many the real answer is so they can charge credit card fees. We can't tell the difference between a Visa credit card or a a Visa debit card (same for all brands) based on the card number itself, so we have to rely on the users telling us.

As ever, follow the money.

Edit: I've designed at least three checkout systems for multi-million user websites. This is the reason it's been included, much as I'd like to be able to get rid of it...

Edit2: Stackoverflow question on how you can't tell debit apart from credit cards https://stackoverflow.com/questions/1479363/how-tell-the-difference-between-a-debit-card-and-a-credit-card

Improve this answer
8
  • It is possible to distinguish between Visa and Visa debit/delta based on the number… it’s just difficult. And while I like your conspiracy theory, in actual fact the reason people ask for it is that they have to pass it to their card processor (see @Daniel’s answer, above).
    – al45tair
    Feb 3, 2014 at 18:00
  • @alastair Sorry, miss-read your comment - how do you distinguish between a credit card and debit card?
    – edeverett
    Feb 3, 2014 at 18:07
  • Sadly, the answer is that you need a database of IIN numbers, which is hard to get. The American Bankers Association is responsible for distributing it, and probably won’t give it to you. But it is possible.
    – al45tair
    Feb 3, 2014 at 18:13
  • There’s also Wikipedia’s IIN list, which is useful but, of course, incomplete and potentially out of date.
    – al45tair
    Feb 3, 2014 at 18:14
  • 2
    So we have a partial, unreliable, or unavailable method of distinguishing debit or credit cards, which isn't a viable real-world solution and leaves us with the fact that this is why many stores ask customers to select their card type.
    – edeverett
    Feb 3, 2014 at 22:24

Not the answer you're looking for? Browse other questions tagged or ask your own question.