8

The Canadian postal codes is formed from 3 letters and 3 numbers, interposed. Example: M1K 3H7

The Canadian postal code is quite tricky for a user to enter into an input form field, especially on mobile devices where the user needs to switch between the keyboards (Alphabet to Number keyboard). He needs to switch 5 or 6 times between keyboard layouts!

enter image description here

Separating the field in two might give complicate the experience even more. Do you have any suggestions of how to ease the experience?

8
  • you on the web for this?
    – user5482
    Aug 5, 2015 at 14:30
  • 2
    I don't believe there's any way to improve this unless you can use an autocomplete/suggestion and have the user correct if it's wrong (less typing). however, canadians will be well familiar with this process when entering a postal code, it's not like your app will feel "wrong".
    – user5482
    Aug 5, 2015 at 14:52
  • 1
    Only iOS-People need to switch. Android user has all numberd above the regular keyboard and thus don't need to switch (thats already 50%+ of mobile users). Plus it's not that annoying to switch keyboards on iOS as long as you only need to insert the postal codes once
    – BlueWizard
    Aug 6, 2015 at 7:43
  • 1
    Don't you mean 3 letters and 3 numbers totalling a 6-character code?
    – Gerli
    Aug 12, 2015 at 14:37
  • 1
    I'm still not sure why this happens often (in fact it just happened now which is why I'm online searching about entering Canadian postal codes online) but many website forms tell me my postal code is 'invalid' or 'incorrect format' yet I change the format every possible way (no space, no hyphen,yes hyphen, yes space, lower case letters, uppercase letters..) Sep 28, 2018 at 15:03

4 Answers 4

6

Just use a standard text field. Entering a postcode is not as hard as it may seem.

You can use regex for whitespace separation and auto numeric and character switching. i.e. force the mobile keypad to switch between numbers and characters when postcode is typed since you know what pattern it could be. Auto-suggestion would be the best option here.

Canadian Postcode is similar and less complex than the British postcode. UK postcode separations can be 4-3 or 3-3 or 4-3,... there are several variations.

These are all the patterns we have in UK

  A9 9AA
 A9A 9AA
 A99 9AA
 AA9 9AA
AA9A 9AA
AA99 9AA

Several sites, including the Postoffice of UK use the standard text field pattern for UX (on websites and digital forms) and provide seperation on physical paper forms and PDFs (see page 26)

enter image description here enter image description here

1

You could, perhaps, try implementing something similar to Google Maps, where the user just starts to type in their address, sees possible addresses to choose from, and can choose one of them that is the address they are looking for, and not have to type in the whole address.

Google Maps address searching example

For the US addresses I've used on Google Maps, I've never had to actually type in the zip code to select the address I was searching (and US zip codes are just 5 numbers).

1
  • great point! I have seen this implemented before on some forms, for Canada, but the experience is a bit confusing. It works once you introduce the postal code in the 1st input field, and the second input field is a smart search (on the address). Aug 5, 2015 at 16:59
0

One way to do it could be to glean the Postal Code using the Address and CanadaPost API https://www.canadapost.ca/pca/support/webservices

If you absolutely want your user to input manually, you could to use 6 separate fields, with the type alternating between text and number (this would toggle the appropriate keyboard). The fields could be styled to appear as one field. I would highly suggest testing this with users first!

0

Why not avoid having the user specify the postal code at all? Have the application look it up based on the address.

3
  • I'd worked on something in the past that require the user's location... and trust me, users are very skeptical about providing their address, but they are far more willing to provide their postal code (and in Canada, postal codes are accurate to block-level, which is enough for most location-services)
    – CleverNode
    Sep 2, 2015 at 16:11
  • @Novina: Agree if the application does not require an address. If it does require an address (e.g. entering shipping information), then looking up the postal code is a viable option.
    – Bill Dagg
    Sep 2, 2015 at 16:26
  • Can you provide an example hat you have seen implemented and explain how it would work for completeness of your answer?
    – Michael Lai
    Sep 28, 2018 at 22:51

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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