This is what the home page looked like on the day I examined it:

We can start by getting rid of wasted empty space and improving the contrast to improve readability:

We can do more. the “About” link is usually in the header, not buried in the footer. And virtually all websites—especially ones the size of IBM’s (over thirteen thousand pages on the US site, according to Google)—become more usable when they include a sitemap. Also, from the standpoint of business effectiveness, you’d think that IBM would want to make use of all that empty space in the header:

The home page could be further improved—there are far too many links, and they aren’t well organized—but this illustrates how a few simple changes can strengthen a website.

My local public library has a website that’s part of a county-wide system. It’s really great. You can search for books throughout the county, reserve them, and pick them up at your local branch. You can even renew books you’ve taken out.

And that’s where the website is oddly inconsiderate. The other day, I tried to renew a book that I had already renewed once. When I went to Items Eligible for Renewal, all the books that I currently had out were listed. The page instructed me to “Select Items for Renewal.” It even told me that the items listed were eligible for renewal. I clicked on the book I wanted to renew a second time. And only then did I see a screen with a message telling me that the book had already been renewed once and therefore was ineligible for renewal.

Sure, it was only a minor thing—but it was annoying. The system already had that information all along—it was just withholding it. When I went to the Renew Items page, it probably should still have listed all the books I had borrowed—to omit any might have perplexed me. But it could have indicated which items were actually eligible for renewal and which ones weren’t right then and there—with a message explaining that books could only be renewed once.

Imagine if a person acted that way—you’d think that there was something wrong with that person. Why should we accept such behavior from a website or a computer program?

There would be a little more redesign necessary. The title of the page shouldn’t be “Items Eligible for Renewal” but “Items Borrowed.” And the items eligible for renewal would have to be to distinguished from the items ineligible for renewal. There shouldn’t be a checkbox next to the ineligible items.

This may seem like a trivial example of a design problem, but it illustrates a number of important points—don’t mislead users; present relevant information at the appropriate time in the interaction; and it’s far better to prevent errors from being possible than to trap them and display an error message after they occur. It’s just being considerate.

Perhaps the most familiar example of this is Microsoft Word. It’s been called the gold standard of word processors, and despite the many competitors and alternatives (some of them free or cheaper than Word), it’s the one that’s most commonly used—according to Microsoft, as of January, 2009, about half a billion people use it. In fact, I’m using it now to write this—I’ll cut-and-paste it into the window to post it to the blog when I’ve finished writing it.

But the fact is that Word is so complicated and so filled with features and options that it’s effectively impossible to know whether you’re using it to its full extent or using it right—virtually every command has dozens of options and suboptions. Beyond that, virtually every aspect of Word’s choice of options can be customized. For example, the “quick access” toolbar looks like this by default:

Do you know what all those tiny icons mean? Have you ever clicked on those tiny down arrows? Did you know that it can be customized to include any of literally hundreds of other commands? Take a look at the options:

To get an idea of how any commands can be added, take a look at how many are on display in the window and look at how small the handle on the scroll bar is. (Or, assuming you’ve got Word on your computer, just click on the little down arrow next to the quick access toolbar, select “More commands,” and when the window like the one I’ve just shown you appears, select “All commands” from the “Choose commands from” dropdown menu.

Did you even know that this was possible?

To get an idea of how complex Word really is, press F1 (while you’ve got Word open, of course) to bring up Help. Click on the little book icon at the top of the screen to open the table of contents. Click on all the closed books in the window to see the full contents (sometimes the entries themselves have closed books you have to click on to see all the subsections).

Any program this complicated is impossible for anyone to learn fully, or even learn well. The fact that you can use it to write a letter or a report or even a full-length book doesn’t mean that you really know how to use it. The fact that it’s useful doesn’t mean that it’s usable.

The same is true for websites. You may find a website to be worth using—because it offers worthwhile functionality, or the best prices, or the most reliable information—and be willing to put up with its usability weaknesses and deficiencies. If you’re responsible for a website, you want it to embody both usefulness and usability.

What do I mean by artificial stupidity? What I mean is that the automated application of algorithms often lead to results revealing the utter mindlessness behind those algorithms—results that no real, living person would accept as indicating or even simulating any kind of intelligence, natural or artificial.

To give one example close to home: as I’ve indicated to Linkedin, The Effective Website is a sole proprietorship—it has only one employee, myself, which Linkedin seems to know:And yet, on my home page, it has a section that invites me to connect with colleagues that just joined Linkedin—where it lists The Effective Website, as well as previous employers. When I click on The Effective Website, this is what it displays:

These people, of course, have nothing to do with my sole proprietorship—it’s simply that the phrase “effective website” appears in the names of company names they’re associated with. Any person would immediately realize this; computer programs, it seems, can’t—because computer programs don’t have what we call common sense.

This sort of thing happens all the time—and not just on Linkedin but on virtually every website that uses a database and search algorithms.

Such results, of course, undermine the credibility of your website and the confidence that your visitors have in it.

Can things like this happen on your website? If it’s database-driven, it almost certainly can. Try to come up with tests that would expose silly or nonsensical results and see what happens when you run them. And then see what you can do to avoid them occurring by add some more code to check the results.

You’re never going to be able to eliminate artificial stupidity entirely, but if you look for it and put in programming to avoid what you find, you’ll at least reduce it.

Oh, and Happy Thanksgiving!

I’m skipping over the registration process itself—where you’ve probably got prechecked boxes allowing you to send your visitors emails, offering them additional products and services, and perhaps sharing your information with other companies wanting to sell them things. I’m talking about the design of the pages in the two parts of the website itself—the public website and the private, members-only website.

Probably the most important consideration is consistency of brand identity. The members-only website should look and feel like the public website. Your name and its display treatment, your logo, and your tagline should be identical. As far as possible, the overall appearance of the pages should be consistent if not identical. If it still makes sense, you should continue to display your value proposition in the header.

The header and the footer should look similar to those on the public website, although navigation links should probably be different. Whereas “Home” on the public site should take you to the actual home page of the entire site (or, if you have a portal page and multiple virtual home pages for different audiences, the appropriate virtual home page), the “Home” link in the private website shouldn’t, in effect, log the visitor out but should return to the page first displayed when the visitor logs in.

Depending on the nature of your website, you may want to continue to present calls to action to your visitors, even though they’re already members. For example, e-commerce sites will obviously want to make additional sales. Not-for-profit sites will want to solicit additional contributions and perhaps additional volunteer activity. If your site has a free site for members and a for-fee site with additional functionality, you’ll want to upsell.

The key to presenting such calls to action is to make them compelling, visible, and easily accessible without making them obtrusive or annoying. To do this requires balance and judgment. The visitors are already using at least some of the functionality of the site—you’ve won them over to some degree. You want them to want to get more from you or to give you more, but you don’t want to alienate them.

Some sites, for example Pandora, offer a free online music service that plays short, occasional advertisements. For $36 a year, it offers commercial free music at higher fidelity. It also offers a one-month free trial. However, the call to action to upgrade is extremely discreet. On the navigation bar, there’s only the smallest, barely visible link:

Although, along with other display advertisements, Pandora displays advertisements for its own premium service, by the very nature of the service it provides, the website itself is rarely if ever on display—visitors start it and then minimize it to visit other websites or use other applications, only returning to it to skip a song, change “stations,” create a new “station,” or the like.  The unobtrusive link in the navigation bar and the rarely seen display advertisements are probably too discreet. It might be worthwhile for Pandora to occasionally play audible invitations to upgrade.

Other websites, such as linkedin, offer a free service and a number of levels for increasing cost levels. Each level limits the number of facilities that are available per month (or at all). However, when you’ve reached your monthly limit, the message box that’s displayed—the call to action to upgrade—is cheerfully unapologetic and probably annoying to most users.

It’s all a question of whether, when you present your call to action—your invitation to upgrade, buy more products, contribute more, volunteer more, or whatever—you do so politely and respectfully but persuasively. Remember, you’ve already persuaded them to sign up with you. Keep reinforcing your brand identity, keep them coming back, and don’t do anything that will make them quit.

The number of such specialized services isn’t small. A Google search for [“not for profit” website design] results in about three and a half million natural results (and a few paid ads, of course). A search for ["law firm" website design] results in about three and half a million. Do a search for any kind of business enterprise plus “website design” and you’ll get millions of results. Hair salon. Auto repair. Catering. Restaurant. Contractor. Even “pizzerias” yields almost eight million results.

Many of the companies that show up in the results for specialized markets, of course, offer their services in a variety of niches. One site that shows high the search for results for auto repair website design lists a total of sixty-three other niches—including accountants and tattoo parlors—before ending the list with “and others!”

What is the work of these companies like? Not much different from the website design firms that don’t address a niche market. Some of these firms, in fact, use website templates from companies that offer unspecialized templates. From a random sampling of these companies’ websites and the websites they display in their portfolios, it would appear that they suffer from the same effectiveness and usability defects of general website template providers: meaningless logos; ineffective, meaningless taglines or no tagline at all; no value proposition; weak, buried, or missing calls to action; distracting videos; a surfeit of border, boxes, and empty space; text in all capitals; barely readable, low-contrast type; confusing navigation; idiosyncratic architecture; missing standard elements such as search boxes and footers; and on and on.

In some cases, the niche providers make it easier to get your website live, by providing specialized pages appropriate for your service—for example, for a not-for-profit site, they may have a predesigned page allowing visitors to make a contribution by PayPal or credit card. In other cases, the niche providers provide a variety of related services, such as website hosting, logo design, search engine optimization, email marketing, and the like.

But don’t be misled. The niche providers are not as specialized as they may at first appear, and typically offer template-based solutions not much different from the general-purpose website designers. Having a professional-looking website is almost certainly better than not having one at all, but having one that ignores the precepts of effectiveness and usability isn’t the best you can do.

Put off sketching or wireframing any screens for a while—in fact, until much later in the design process. Instead, consider the personas you’ve decided will be using your website and the goals they want to accomplish, whether it be buying something on your website, finding a particular item of information, deciding whether they want to join your organization (and then actually joining it), finding out how to visit your physical location, or whatever else it is.

Then describe how they accomplish their goal as if you were standing in front of them, with the back of the monitor facing you. You can write about what information they have to enter on the web page, but don’t describe the page at all. Each such description—and you should write one for each goal each persona has—is called a scenario (also known as a “user story”).

Incidentally, scenarios aren’t “use cases.” Depending on what development methodology they use, your web developers may translate your scenarios into “use cases.”

Your goal is to write each scenario describing an interaction that allows each persona to accomplish his or her goal smoothly and as close to effortlessly as possible.

Be sure that you write separate scenarios for new visitors and returning visitors—including both members and non-members, if your website allows for membership—if you anticipate any differences.

Once you’ve written all the main-path scenarios of your personas successfully accomplishing their goals without errors or detours, write scenarios covering edge cases and error cases—how will the website behave in unusual circumstances? How will it behave when the user does something unexpected or unacceptable to the system?

Again, all of these scenarios should be written without any reference how the web pages look. You can describe in detail what the persona has to enter and what information the system displays, but not how.

Once you’ve written all the scenarios—including main paths, edge cases, and errors—and verified that together they represent the complete functionality of your website from the user’s point of view, you can use them to infer what pages the website has to display, what input and output fields have to contain, and the information architecture of the website as a whole. You can look for opportunities to consolidate displays, simplify interactions, retain information and carry it over from one session or web page to the next, and other ways to make the system more usable.

Finally, when you’re satisfied that your scenarios are complete, comprehensive, and describe interactions that will also your personas to accomplish their goals smoothly and effectively, you can begin sketching those web pages you didn’t let yourself actually describe.

You may be surprised at how different your design turns out to be than what you originally imagined—and how much better.

Many companies, both large and small, offer some sort of guarantee, but they do their best to hide it—even if they mention it on their home page. For example, here’s Travelocity’s home page:

Is the guarantee prominently featured above the fold? No. Is it even mentioned on the home page? No—there’s a link to it—in the footer:

Here’s the home page of Princeton Review:

At least the word “guarantee” is above the fold and is indicated to be a link—but it’s the size of all the other body copy, as small as the smallest element on the page.

Here’s where the NetApp guarantee appears:

It’s below the fold on a page four levels deep, and set in body copy.

In contrast, take a look at this website:

Even if this website is so ugly it makes you want to run screaming out of the room, do you think any visitor is going to miss that their products are guaranteed?

Most websites (and companies) have one primary audience—for example, even though online dating sites are also (and even more literally) matchmakers, their primary audience consists of individuals looking for suitable dates. You might argue that online dating sites actually have two primary audiences—men and women—but the value proposition for both audiences is essentially identical. That’s not true for other kinds of websites that truly have multiple primary audiences.

It’s quite a challenge—the value proposition for each primary audience is entirely different; a tagline that might make sense for one primary audience might not speak to other primary audience at all—in fact, a tagline that speaks to one audience might very well turn another audience off.

Nearly every website I’ve examined of such companies don’t address the problem at all. Most don’t have a tagline at all, but the few that do use one that conveys almost nothing—“The science of shmurgle.” “Smurgle in the open.” “Shmurgle solutions.” Virtually none have a value proposition prominently displayed in the header—if they have one anywhere on the home page at all. And few if any have a call to action—a tepid “contact us” on the navigation strip or bar is about as compelling as they can get.

What’s the solution to this problem? In general, web designers have been counseled to avoid using a gateway page (especially with a flash animation that takes seconds to load). But for websites (and companies) with multiple primary audiences, this is the ideal solution. Put your primary brand identity elements—company name in its customary style, and logo, if you have one—at the top, so that you have a consistent image across your entire site, and then leave the entire page blank except for one oversized, prominent, clickable button for each audience—Advertisers, Publishers, Networks, Advertising Agencies, whatever. (You can even include a separate value proposition for each audience in the button.)

Each link leads to a landing page for the appropriate audience (for example, www.shmurgle.com/advertisers) that’s in effect the home page for that audience. Those pages can each have a value proposition, a call to action, and even a tagline customized to speak to that particular audience. Your home links—the logo in the header or explicit Home links in the header or the footer—return the visitor not to the gateway page but to the landing page for the audience. In effect, you’ve created a separate website for each audience.

As far as secondary audiences and housekeeping links are concerned, you can put them in the footer of each page. In the footer, you can even include crosslinks to each of the virtual websites for the other audiences.

Problem solved.

According to Harris Interactive (and widely reported elsewhere, such as by CNET), in 2009, people reported that they were online (excluding using email) an average of 13 hours a week—about 2 hours a day. Harris also reported that this figure varied considerably, from twenty percent spending about 2 hours a week—that’s less than twenty minutes a day—to 18 hours a week—about two and a half hours a day. On average, about half of that time was spent at home, with the other half split about evenly between work and “other”—presumably at places like Starbucks. (Harris also reported that about 80% of all Americans now have access to the Internet.)

And how did the average person spend that time? According to Nielsen, the top ten activities were these. (I’ve rounded the percentages to whole numbers.)

Social Networks 23%
Online Games 10%
E-mail 8%
Portals 4%
Instant Messaging 4%
Videos/Movies 4%
Search 4%
Software Manufacturers 3%
Multi-category Entertainment 3%
Classifieds/Auctions 3%
Other 34%

Now, we have to assume that all the other categories occupy a smaller percentage of time than the tenth most popular, which means that all the other categories would occupy no more than 3% of the average person’s time. Let’s assume that one of those categories was something like “web surfing” or “research with intent to purchases goods or services” or even something as specific as “on-line shopping” and this means that no more than 3% of that two hours a day was spent visiting websites like yours—that comes to about three and a half minutes a day. (Actually, because the Harris numbers exclude email but the Nielsen numbers include it, we have to bump the time spent online by about 10%, so you can increase that figure to about four minutes a day.)

What does this mean for your website? It means that you’re competing with all the other websites on the Web for a slice of that four minutes a day. If you’re fortunate enough to have a visitor land on your website during that four minutes, make sure that it make a positive impression, and that you get your impression across before the visitor flies away.