I am working on an international site that requires the user to enter his postal address. I am wondering if it makes sense to have a slightly different order of input fields in favor of a time saving pre-fill feature.

Let's assume it would be possible to detect the City and State correctly after the user entered the ZIP code (I am aware of some ZIP codes not being unique in the US). Once the user left the ZIP code input field (onblur), city and state could be almost instantly be pre-filled.

Are you planning on using this for US users only? Since you mention you are workig on an international site I must say that I (being a European citizen) have no idea what a ZIP code is, or what the state abbreviation is all about. We just use a street name, house number, postal code, city, and country, in that order. An address would be: Masurenallee 8, D-14057 Berlin, Germany. This is also the way I want to fill it in on a website.
–
Bart GijssensMar 12 '12 at 14:13

2

@BartGijssens: The user would select the country first. If it was Germany, as in your address example, the order of input fields would change. Still there would be a mandatory input field for ZIP code if the user selected Germany. If the users' locale would also be German the content language would be set to German by default (so it would rather be 'PLZ' instead of 'ZIP'). For Ireland there would be no ZIP code input field.
–
greenforestMar 12 '12 at 14:20

If the validation on the fields is also adapted to the chosen locale, that sounds like a perfect web app!
–
Bart GijssensMar 12 '12 at 14:27

1

@BartGijssens I'll try to convince the company to OpenSource it :-)
–
greenforestMar 12 '12 at 14:32

I would rather see the zip code autofill based on the address and city.
–
Taj MooreMar 13 '12 at 19:53

8 Answers
8

I'd rather stick with the well know format since users tend to go to "auto-pilot" in this mode, so making them think isn't recommended.
It has also happened to me before that I'm typing / choosing faster then the values are auto-update, creating confusion and sometimes input of double values.

Moreover, you've mentioned it's an international site, so that means:

The user has to choose the country first

You need to have the reverse lookup service for most countries for this to make sense (and I'm not sure you can rely on that)

Lastly - is the zip code a must? If not, it's better to leave all optional fields to the end.

To my knowledge ZIP code is must in most countries. Some exceptions though, e.g. Ireland.; 1. Right, user will choose country first; 2. lookup service is in place for most important countries (based on current usage); Not all users are very fast typing and the system should be build in a way that it would not overwrite user input.
–
greenforestMar 12 '12 at 14:16

+1 for double entry issue. I would probably tab and enter information in those fields before any auto-lookup finishes; not to mention browsers' auto-fill features.
–
DesignerGuyMar 12 '12 at 17:54

From a heuristics point of view I recommend sticking with the most common format of "City, State, Zip + 5".

Another options is to ask for the Zip on a previous screen then on the screen with the address pre-fill the State and Zip while offering a drop-down of possible cities. One of the hurdles your example faces is that multiple cities may exist within a single postal code.

I was working on a recent project which required the design of a form based application which would be filled in by educational institutions which are looking for research funds. We did a lot of usability testing about the kind of layout which could perhaps be best used by an international audience and we found that having labels such as the ones mentioned below really confused people :

Street Address - Street addresses can be mentioned in so many ways eg: house number first,street address second or street address first, apartment name second,locality third

Zip - what do you mean by zip code,further more zip code is a US term and in countries like India,its referred as a pin code,so would you be changing your label text there too?

Apartment number (This might seem odd but then most people were not sure if this should be populated by the house number and how applicable this would be in a educational institutional address and whether the apartment number would be the room number in the building ?)

In the end we found that the most simplest solution which worked for everyone was just having a plain textbox for the address field which users could fill up in anyway they wanted.

I know this is not the solution you are looking for but its a simple and effective solution which worked just fine in our case

Edit: I am curious how you plan to do your validation? I worked on a project during grad school in which we built a mapping application for mapping US impact information (locations of libraries and internet centers) in locations such as Chile and Bangaladesh and we found that the only way to get consistent co-ordindates was to use longitudinal and latitudinal points.I know I am not answering your question but do you really have a way to do validation which works effectively?

I never considered this solution. I came up here twice and I will consider it in another project. For this one, the data entered would be validated and I cannot think of an easy way doing this from a textbox. Anyway, thanks for your thoughts!
–
greenforestMar 13 '12 at 8:55

International validation is bloody hard. Is "2B" a valid house number? "2 bis" ? Don't get me started on houseboats, whose address isn't on a road but in a canal (!)
–
MSaltersMar 13 '12 at 11:45

Yes, I would exclude ZIP codes that match multiple cities/towns and just not pre-fill. I get your point with the inconsistancy. As users are very unlikely signing up twice for this service I wouldn't consider this to be an issue.
–
greenforestMar 12 '12 at 18:12

I would instead use the city/state as a check against the zip code to make sure they correspond with each other. It serves a similar purpose like making the user type in their email address twice - guarding against typos. I realize you're trying to save the user time but accuracy is more paramount. I would validate it after all 3 are entered and flag the boxes with a red background if they don't match.

Unless you need the data to be reformatted later or have a need for the data to be separated into specific inputs, I suggest using a single textarea for the address field. This solves the issue of internationalization, and also lets users takes care of any edge cases related to their address that you may not have considered.

It also speeds up the input since the users doesn't have to move between several inputs.