By: Philippe Randour

March 24th, 2003

Reader Rating: 7.5

I'm an avid surfer, and have been for several years. However, after all this time, I'm still astonished to see the same old usability blunders repeated in large, brand new sites. Though the use of technology may have changed, the issues with user interface and functionality design persist.

While it might help, technology won't necessarily save the Internet from chaos. But technology doesn't have to: all it takes to avoid alienating your Website's audience is a little common sense, and a keen eye for detail.

From the points I'll present below, you'll see that there is still a long way to go before we achieve an enjoyable and usable Web. What's presented here is not the work of a Web developer or designer. While I'm a programmer, it's the reaction of typical non-technical Web surfers that have allowed me to build this list of common sense usability tips.

I know that many people see the word "usability" and start to yawn. But as you read about these large sites and the all-too-obvious mistakes they've made, ask yourself: just how well does your site stack up?

Blunder #1 - No Print-Friendly Pages

The Guilty Party - About.com [1]

If you're like me, you don't always have the time to read everything you want on the Internet. Perhaps you have difficulties reading huge blocks of text on-screen. That's where printing becomes really valuable.

Think printer-friendly pages are obvious? Look at About.com [2]. If you try to print from this site an article published on a specific guide, you'll not only print the article, but also every link and ad on the page. This also means that the article will print in a narrow column, producing more pages than necessary.

It's really annoying, not to mention a waste of time and paper, to try to print the content of a page or frame only to find you have to do it several times with different printer settings to avoid truncated lines. A print-friendly page is also a means to remove useless information, like banners or navigation links, from the printed page.

Identify each page on your site that offers valuable information that users might want to read when they're not connected. From each of these pages, provide a link to a printer-friendly page or, depending on the information, a copy of the content as a downloadable .PDF file. Easy!

Blunder #2 - Botched Localisation

The Guilty Party - OpenOffice.org [3]

Take a look at OpenOffice.org [4]. On this site, localised support is available in several languages but the content of each is different from that which appears on the original English site. You also end up with a site in two languages at the same time: links on the left appear in English, while the rest of the page displays in the selected language on the right.

The moral of the story? Provide correct and complete content in all the supported languages of the site. Otherwise, it's better not to provide localised support at all. If surfers become aware of the differences between different localised versions of your pages, they might question the value of your site and the respect you give to each audience, not to mention your business's professionalism!

Blunder #3 - Pop-up Windows and Flying Banners

The Guilty Party - Fast Company [5]

Pop-ups and flying banners are some of the most irritating elements you can build into a Website -- and that's not just my opinion! So why do large sites still use them?

Consider Fast Company [6]. When you access the site, a pop-up window automatically appears, displaying an ad. It's an annoyance because, to the user, that ad is just one more window displaying useless content, while there are already more than enough commercials on the main page.

So, avoid pop-up windows and banish those flying banners that float over the content of your site, and which users have to close to be able to read your content.

Blunder #4 - "Under Construction"

The Guilty Party - Mobil Oil Canada [7]

The Mobil Oil Canada [8] site provides some information about the company, and even gives users a way to register on a mailing list. However, it clearly states 'Under Construction' and shows future links to other parts of the site.

Worse still, if you go to the main Mobil [9] site and select 'Canada' in the 'Find a country' box, you'll be redirected to a totally different site, at a different address. Not only is this confusing for users, but it's highly unprofessional.

If a site is under construction, don't say it. Instead, provide a basic page with relevant information presenting your company or a sampling of the future content, or an invitation to return to the site at a certain date. You could also provide a way for visitors to register on a mailing list that will alert users when the site is ready.

Now, if it's only one section of the site that's under construction, don't give access to it, or provide any links to that area. Simply wait until the new section is complete, and announce its unveiling then.

Blunder #5 - Multiple Windows for One Site

The Guilty Party - Microsoft Hotmail [10]

While it's now regarded as ok to open a new window when the user accesses content on another site (it gives an indication that they've left your site for another), don't open new windows for content that appears on your site, and that the user accesses from your site.

Microsoft Hotmail [11] opens new sites in their own frames. When you click on a link in an email, the destination site is opened in another framed window. Now, look at the address bar in this new window: the strange looking address is what will be used if you bookmark the site from this secondary window.

This can really become annoying. Your best bet is, of course, to always keep within the same window when taking users to different content on your site. Otherwise, they might become confused, or frustrated, as constantly popping up new windows adds to the number of manipulations that are necessary to navigate your site.

A corollary to this: don't open a page on an external site in a frame. Again, the user may well become confused, but in addition to this, opening other sites in your own frame makes it difficult for users to bookmark this external page with a clean address.

Blunder #6 - Broken Links

The Guilty Party - enRoute magazine [12]

If you surf around enRoute magazine [13], you'll find that some links in the archives do not work. For instance, select the November 2001 issue and click on one of the 'more >>' links: you'll get a 'File Not Found' error message, which is not adequate for the average surfer. It gives them no alternative way to find the information, nor even to let the site owner know that the link is broken.

Learn from their mistake! Double-check every link on every page of your site. It makes you look unprofessional if users click on your links and promptly receive an error message because the page is no longer there, or the link is broken.

If it's a link within your site, at least provide a page with an adequate explanation of the problem. And if you provide links to external content, give the user a means by which to report broken links.

Blunder #7 - Incoherence Between Pages

The Guilty Party - Borland Developer Network [14]

You may think the days of multiple design templates on the one site are long dead. Think again!

The Borland Developer Network [15] falls victim to this very mistake. Take a look at the links that appear under the Borland Developer Network logo, and on the Soapbox on the left. Now, click on the Search link and compare the two pages: you don't see the same links appearing. It's incoherent, and can cause real confusion for users.

Be Sure to provide a common look and feel for every page on your site. Don't change the layout only on certain pages or sections. It'll make your site look like a work in progress, and confuse the user.

Usability Blunders - the Bottom Line

All the information presented in this article should be second nature to the majority of Web designers. However, as is obvious from the example sites discussed here, it's all too easy to let these simple points slip your mind somewhere within the long development process…

The bottom line is that it's important to understand and respect your audience. If you don't, and don't help them fulfil their goals for using your site, they might stop seeing the Internet as a medium of choice for information. Or, more likely, they'll click away to the more usable site of one of your competitors.

[1] http://www.about.com
[2] http://www.about.com/
[3] http://www.openoffice.org/
[4] http://www.openoffice.org/
[5] http://www.fastcompany.com/
[6] http://www.fastcompany.com/
[7] http://www.mobil.ca/
[8] http://www.mobil.ca/
[9] http://www.mobil.com/
[10] http://www.hotmail.com/
[11] http://www.hotmail.com/
[12] http://www.enroutemag.com/
[13] http://www.enroutemag.com/
[14] http://bdn.borland.com/
[15] http://bdn.borland.com/