User-friendlier country selection

Published on and tagged with usability

Selecting the country where you live is a task you have to perform from time to time when registering for web sites. This often sucks, as it is often implemented in a way to make the life of the programmer easier, and not the one of the user. In this article I will discuss the problems of the usual approach, and two ways to make the country selection user-friendlier.

The usual approach is to have a drop-down box filled with all countries. That’s easily implemented: get a list of all countries from somewhere and put them into the drop-down box. To select a country with this solution, the user has to select the drop-down box and either scroll to the country or enter the first letters of the country, e.g. for Switzerland you would have to enter “s”, “w”, and “i”. That means it often requires more effort to select a country than entering directly the ISO 3166-1 country code into a two-character input field…

The previous solution can be improved without much effort by putting the most used countries at the top of the drop-down box. Which countries that are depends on the focus of your site (and your site statistics). If you have for example a german site, most of your users will be from Germany, Austria, and Switzerland. By putting those countries at the top of the list you will make the country selection easier for the majority of your users.

The best solution would be, of course, a “convention over configuration” approach where the site automatically selects the correct country (at least in most cases). The implementation of such a solution requires a bit more effort on the side of the programmer as you have to determine the country somehow (e.g. by using a web service like, but on the other hand it will make the life of most of your users a little bit easier :)

4 comments baked

  • Nik Chankov

    I think the best approach is to try to guess the host of the user and also to make the country field Autocomplete field. Because for example in IE it’s not possible to type more than 1 char in the dropdown field.

    I made a “strict” autocomplete example which I am planning to make as CakePHP helper soon: which I think should do the job providing the ID of the country instead of the untrusted user input. :)

  • Brandon

    Maybe this is just me .. but I see this as a symptom of a far greater issue plaguing the net: Web Registration. I don’t think people, in general, really mind the 1.2s it takes to select their country. But, what annoys the hell out of me is having to register/signup over and over again on a gazillion different sites.

    What I would *LOVE* to see is more wide use of systems like OpenID with the feature that you can update 1 system and all of your subscriptions are reflected. It would also help in lowering spam and/or fake accounts (

  • Markus Bertheau

    You can also determine the 5 most used countries of your users and put them on the top.

    Additionally it’s very important, in my opinion, to repeat these countries in the alphabetical list, because the user might not notice his own country at the top. He will then search his country in the alphabetical list and will wonder, why he doesn’t find Germany in the part of the list beginning with G.

  • cakebaker

    @All: Thanks for your comments.

    @Nik: Yes, making it an autocomplete field is a good idea. Your “strict” autocomplete example is cool :)

    @Brandon: Yes, I agree with you, it is a pain that you have to register separately for most web applications and that OpenID is not more wide-spread yet. But I think you will still get fake data with OpenID (and personally I often use throw-away email addresses for registration purposes).

    @Markus: Yes, you are right, the countries at the top should be repeated in the alphabetical list.

© daniel hofstetter. Licensed under a Creative Commons License