As simple as possible, as complex as necessary

The simplicity of forgiving web forms

14 September 2011
Filling in forms is an irksome task that frequently feels stilted and complex. One reason for this is that users are being asked to format information so that it makes sense to the software or some distant bureaucracy. Giles Colborne, Simple and Usable

As a customer I've generally found British Gas's web systems rather good, with reasonably well designed screens giving me a commendable degree of control over my fuel account. I particularly like the use of Flash/Flex charts showing comparative energy consumption.

But there's clearly room for improvement in their process for switching your electricity supply to them, which I attempted yesterday. At one point I was asked for my current supply number, and a helpful toggle-tip showed me where I would find it on my bill and which part I needed to enter.

Screenshot of a form

The number on the bill and in the toggle-tip is split into 4 groups, so I thought I would enter them in the same way with spaces between the groups, in case that was important.

Computer says no

Upon submitting the form I received the following reprimand:

Screenshot of an error message saying: In order to continue, please enter a valid supply number. This field will only accept numerical characters up to 13 digits in length.

If I'd entered letters instead of numbers, or not enough numbers then fair enough, but I had entered the right number of digits. It shouldn't have been necessary to hold me up because I'd entered spaces, which the example suggested to me I might need. The spaces should have been automatically removed. Computers are good at this kind of massaging — it's not difficult to program them to do it.

As developers we should do our best to displace complexity from the user to the software where possible. In Giles Colborne's words:

Let the computer take on some of the responsibility for structuring the data and you'll simplify the user experience.

Posted on . Updated


  • Formatting comments: See this list of formatting tags you can use in your comments.
  • Want to paste code? Enclose within <pre><code> tags for syntax higlighting and better formatting and if possible use script. If your code includes "self-closing" tags, such as <cfargument>, you must add an explicit closing tag, otherwise it is likely to be mangled by the Disqus parser.
Back to the top