Don’t mess with conventions

August 5, 2009 in Websites

There are conventions to website design.

Conventions are set ways of doing things. They aren’t laws or rules, but rather guidelines that have evolved over time to make the user experience easier, regardless of which website they are visiting. For example, a common convention on a website is to place the search box in the top-right corner. It’s not a legal requirement, but web users are used to finding it there, so this has developed as a convention – common practice. Another convention is to place legal information (e.g. the disclaimer or copyright details) in the footer.

Steve Krug in his awesome book “Don’t make me think” explains that conventions aren’t unique to website design. Take for example, reading a newspaper:

“…a phrase in very large type is usually a headline that summarizes the story underneath it, and that text underneath a picture is either a caption that tells me what it’s a picture of, or – if it’s in very small type – a photo credit that tells me who took the picture” (page 34).

Conventions are your friends.

But they aren’t always followed, and this can be confusing. Take for example my recent visit to the Matthias Media website. On the homepage is a form to sign-up for their monthly enewsletter. This is a great service to offer to website visitors. But it’s confusing – take a look:

Screenshot_MatthiasMediaEnewsSignup

When I first glanced at this form, I began to write a post questioning the need for so much information from the visitor, simply to sign-up for the e-newsletter. Over-asking is a major gripe of mine! I assumed they were over-asking because of the use of the asterisk (*) above several of the fields. In website design, an asterisk is a convention used to indicate required information.

Yet at the bottom of the form is an explanation – the * in this instance, indicates that the field is optional. It’s good to have this explanation, but to avoid confusion it would be much easier to stick to conventions and just use the * to indicate the information that’s required (i.e. the email address).

I also tried to sign-up for more information about AngliConnect. To be honest, I wasn’t exactly sure what AngliConnect was, but it had been recommended as a service I should check-out, so I paid it a visit last week. Below is the sign-up form I needed to complete:

Screenshot_AngliconnectSignup

However, none of the fields are indicated as ‘required’ (i.e. no * or other explanation). So in terms of web conventions, I shouldn’t need to add any information to any of the fields. Yet, when I submitted the form without my mobile number, an error message appeared, explaining that I needed to include this. Not only wasn’t I told that the mobile number was necessary, I couldn’t understand why I would need to provide two phone numbers. Of course, when you are creating a form it’s your prerogative to request whatever information you like. Just be aware that the more you ask, and the more complex and less conventional the process, the more frustrating this is for the user, and the greater potential for the user to just walk (or click) away.

My intention isn’t to single out Matthias Media or AngliConnect. All of our church and ministry websites are a work in process. My intention is to affirm that conventions are our friends. Learn them (by visiting other websites or reading great books like ‘Don’t make me think’) but, unlike our friends, use them. It will make the experience of visitors to your site easier, and less confusing.

  • http://www.catchmedia.com.au/cm/ Ben Crothers

    Mate, you’ll be a usability expert yet! Good stuff. These issues of convention, ambiguity and information commitment are big areas to consider in online form design, and it can be tricky to strike a balance.

    Sometimes the more instructions and explicit guides online forms have, the more they just get in the way. And as you note, the more form fields there are to fill in (required or not), the more perceived commitment is expected of the user, which increases ‘friction’.

    Users can be surprisingly compliant in filling in long forms if the *perceived reward* is big enough (e.g. online surveys for redeemable points, competitions). But as you say if it’s not even clear what you’re signing up *for* on Angliconnect, then there’ll be a lot of friction quickly!

  • Steven Kryger

    Thanks Ben! Usability issues seem to be standing out to me more and more at the moment. I’m realising that no one has to use your website or service, so unless it’s easy to use, people probably won’t use it. On the plus side, there’s lots of easy things to fix to make a website more usable.