Simplicity, usability: secrets of Web design

Creative HTML design.2, by Lynda and William Weinman.
Learning Web design: a beginner's guide to HTML, graphics, and beyond, by Jennifer Niederst.
Don't make me think! A common sense approach to Web usability, by Steve Krug.
Designing Web usability, by Jakob Nielsen.

Introduction

Designing a Web page has a lot to do with the purpose of the page and three functions of any communications medium are the basis for design. All media may inform, persuade, or stimulate the recipient and problems arise in the Web world when these functions are confused. I deal in informative materials and, from my point of view, the screen is mainly a surrogate for the printed page. True, it is a page with features not found in print, such as links to other pages and the potential for embedded video and other multimedia. However, we have five hundred years of print design to guide us in presenting information on the page and there is no reason to suppose that flashing symbols, fuzzy backgrounds, and garish and unusual type-faces will do anything more than mask the message.

Things may be different for the advertiser, of course, and we would be wise to assume that any e-commerce site is, essentially, an advertising medium, the purpose of which is to persuade us to buy.

Creative HTML design

I make this distinction because the first of these books, while apparently concerned with Web design in general, takes as its running example, the creation of a commercial Web site for the 'Ducks in a Row Fine Art Stamps' company. As a result, although a great deal of very useful guidance is presented, which will help any designer, the reader will need to be constantly aware of the underlying function of the site and continually on guard against applying all of the ideas without thought to the functions of his or her own Web site.

On the other hand, if your interest is in developing commercial sites, this is exactly the text for you, especially if you are beginning completely from scratch - note that the sub-title on the cover (but not on the title-page) is 'a hands-on web design tutorial'. It covers everything from basic HTML taqs to advanced work with graphics. Frequent reference is made in relation to graphics to two pieces of software - Photoshop 6.0 and ImageReady 3.0 (which comes bundled with Photoshop). You will need these or their equivalents to derive full benefit from the text and it is a pity that demo versions were not placed on the CD-ROM. The text also makes ready use of Javascript to achieve some of the effects. You can, of course, use the scripts without investigating Javascript further, but some knowledge of this scripting language would be an advantage.

The text as a whole is well-designed, with frequent use of diagrams, illustrations, and screen-shots. However, it is odd that in a book devoted to the use of HTML in designing Web pages, should be inadequately presented as a text at the level of the publisher's imprint. As noted already, the cover sub-title is not represented on the title-page, nor is the name of the publisher or place of publication. Instead, we have the name of the designer, along with the names of the authors and one of these, William, is given as William E. Weinman on the verso of the title page. Neither the recto nor the verso give the name of the publisher, or the place of publication. In fact, the full name and location of the publisher does not appear until page vi of the front-matter. This is sloppy publishing practice and one would have thought that a subsidiary of Pearson would have had better editorial control. Perhaps some control might also have been exercised over the rather twee and senitmental family history and similar guff that takes up more space than anyone would really want to be bothered with. Are we really concerned that 'Dad' should think his children talented? What Dad doesn't? It is bad enough having to put up with sentimental slush in US TV imports to Europe.

Learning Web design

Jennifer Niederst's Learning Web design covers much the same ground as that by the Weinmans, using a personal Web page as its running example. Like the Weinmans' text, it devotes quite a lot of space to graphics and illustrations are not only in grey-scale, but also in a 14-page colour insert. This gets across much more effectively the results of using gif versus jpeg files, the results of dithering, and the impact of varying compression ratios.

The text is in four parts: Getting Started, Learning HTML, Creating Web Graphics, and Form and Function. In 'Getting Started', Niederst deals, among other things, with why Web design is different from print design - the basic point being that, because the user can set browser preferences, the designer never knows whether the page is going to be presented as s/he designed it. For some reason that I cannot fathom it seems that writers in this field need to employ slang and very informal linguistic patterns and Niederst is guilty of this. It appears to be an attempt, misplaced in my opinion, to present Web design (which, at its heart is a technical business) as somehow fashionable. Does it really help anyone to know that Web design is 'cool' - and what does that mean, anyway? 'After years of being a print designer, there was something kind of spooky and cool about designing something that never hits paper.' 'The Web is so new that it's still very hip to be a part of it.' Well, thanks Jennifer, that helps us a lot - and would your high-school English teacher be impressed?

We don't actually get to the subject of the title, that is Web design (as distinct from the HTML primer) until part four: Form and Function, where four chapters deal with Web Design Techniques, Building Usable Web Sites, Web Design Dos and Don'ts, and ...An Introduction to Advanced Techniques. These ninety pages encapsulate a lot of good sense about overall design, from bulleted lists, through pop-up windows, to navigation design, and cascading style sheets. This constitutes a useful introduction to a very large area, which is the main topic of the next two books.

Don't make me think!

The first of these is refreshingly thin! Steve Krug's Don't make me think has only 195 pages and his reasons for making a thin book are very sound: 'If it's short, it's more likely to actually be used.' and 'You don't need to know everything.' Now, if more authors thought that way, we would have more readable books, and more books read - as well as an easier life for book reviewers! (Actually, with a less generous allocation of white space, I reckon that the book could have been 20 pages shorter!)

The focus of the book is mainly on e-commerce sites: almost all of the examples are such sites, real or imagined, and companies like Amazon.com, AOL, Yahoo, CNet, Quicken, make regular appearances, sometimes with Steve Krug revising them to get a point across. The text uses humour, colour, frequent illustrations, cartoons, and quotations to catch and keep the reader's attention and Krugk's wish that the book ought to be short enough to read on a longish 'plane flight should be possible.

Krug's title is his 'First law of Web usability', and it is a good one, in my view. If the reader takes away nothing more than the basic rule of never requiring the user to think, a great deal of good will have been done for Web design. Krug gives us examples of pages that require the user to think, and shows how, with a little thought, the necessity to think can be removed.

There is a very good reason for not requiring the user to think, of course, and it is based in user behaviour, which Krug obviously understands very well. Chapter 2, How we really use the Web, is based on his own investigations as well as research on decision making, where numerous studies have shown that we engage in 'satisficing' behaviour, rather than in getting enough information to make the optimum decision. This behaviour is found in Web searchers, also: they will scan a page quickly, locate a link which they think might be the right one, and then use the 'back' button if it turns out to be wrong. As Krug points out, this is sensible behaviour since it reduces the thinking time. If you are right first time, you've won, and if you have to go back and try again, not a lot has been lost. Krug points out that users 'muddle through' and cites the case of users (numerous apparently!) who always put a wanted URL into the Yahoo search box, rather than into the navigation bar! No doubt they get along perfectly happily, as well as making some interestingly unexpected discoveries.

Krug's second law is pretty well a corollary of the first: 'It doesn't matter how many times I have to click, as long as each click is a mindless, unambigous choice.' This is at the head of a very short chapter and the key word is 'unambiguous'. Like Krug, I'm essentially a home-office worker and, like him, I wonder which choice to make when I'm offered 'home' or 'office' and not the third, 'home-office'. The point is that it is relatively easy to provide the choices and not put the user in the position of having to think.

The third law is: 'Get rid of half the words on each page, then get rid of half of what's left.' This is an extension of every style manual you have ever seen, which recommends concise writing. This rule is difficult to apply in terms of this electronic journal, but for e-commerce sites and for information pages on such sites, it is something to take note of, because, as Krug points out:

• It reduces the noise level of the page. [i.e., the ratio of useful to useless information]
• It makes the useful content more prominent.
• It makes the pages shorter, allowing users to see more of each page at a glance without scrolling.

The two longest chapters in this short book are devoted to navigation and the functions of the home page. Both offer a great deal of useful advice which really is about design and usability, rather than about how to get effects with HTML.

The last three chapters are devoted to usability testing, and it is rather ironic that I became slightly confused in the first of these over the cost of testing. Krug says at one point that 'It cost $20 to $50,000 a shot.', which didn't seem a lot to me, especially if you were operating at the lower end. Later, he states that after Jakob Nielsen presented a paper on testing on the cheap, the costs fell to $5 to $15,000 a shot. That seemed far too cheap and I realised that he meant '$20,000 to $50,000' and '$5,000 to $15,000' - in print usability it is always best to put the zeros where the reader expects to find them! You can't always convert spoken language directly into the written form.

Again, there is a wealth of information here and even a script for a usability test, which is also on the Web site for the book. In fact, if your interest is in site design for usability, rather than in writing effective HTML, this is the book to buy - at the price it is rather expensive for 195 pages, but any designer or organization is likely to save lots of time, and hence money, in doing things right rather than wrong.

Designing Web usability

Krug mentions Jakob Nielsen on several occasions, which bring us to the last book in this collection. Nielsen is probably the best known person on the planet as far as usability is concerned. His Usability engineering is a standard text on the subject and his Web site and weekly e-mail newsletter are staple sources for any Web designer. The book reviewed here is already available in eleven languages world wide, which is, perhaps, why Anchor Desk describes him as 'one of the Web's 10 most influential people'. So, if you want to know about usability and the Web, this is obviously the place to come to.

But, again, pity the poor cataloguer. New Riders Publishing appears to have a designer who is determined to make life difficult. The title page gives the imprint information this time and the title there is 'Designing Web usability', however, the verso of the title page adds a sub-title 'the Practice of Simplicity', which appears nowhere else but on the back cover! Now it may be fun to have whizzo designers but publishers also have a responsibility to describe their books in ways that allow them to be correctly catalogued.

In fact, the book itself, like Krug's, is very well designed, apart from the glossy paper, which makes the book heavy and makes reading some of the small sans-serif type difficult - fortunately this only applies to captions rather than to the text, so it is not too much of a problem. There is plenty of white space with numerous coloured illustrations of real (although now sometimes defunct) Web pages. Overall, it is a pleasure to browse it.

Nielsen provides his own very succinct summary for the book: 'Relish simplicity, and focus on the users' goals rather than glitzy design.' Indeed, this review could reasonably end at this point, since that is the book's message. We would, indeed, have many more usable Web sites if that motto was engraved on every Web designers' heart and, like, Nielsen, given the choice between an 'artistic' approach to design and an engineering approach, I'll take engineering any time.

Assuming that Nielsen's summary is not quite enough, what do we have here? Well, the first point to note is that this is the first of two intended books. This one addresses the question of what makes a good web site, while the second will be concerned with how to carry out usability-focused design.

The book is in two main parts: part one is devoted to the basics of page design, content design, and site design. Part two is concerned with design for intranets, accessibility for users with disabilities, and serving a global audience. The two final chapters deal with the future of Web design, and with a reiteration of the basic message of the need for simplicity.

Interestingly, on the question of why one should be concerned with usability, there is an immediate, though small, conflict between Krug and Nielsen. In an introductory headline, Nielsen notes that:

The web is the ultimate customer-empowering environment. He or she who clicks the mouse gets to decide everything. It is so easy to go elsewhere; all the competitors in the world are but a mouseclick away.

Krug, on the other hand notes of a similar statement that:

This is sometimes true, but you'd be surprised at how long some people will tough it out at sites that frustrate them. Many people who encounter problems with a site tend to blame themselves and not the site.

Krug's argument for having well-designed sites is not the fear of competition instanced by Nielsen but:

Making pages self-evident is like having good lighting in a store: it just makes everything seem better.

I think, on this one, I go with Krug. However, Nielsen's early chapters on what constitues good page, content, and site design contain a myriad of sound rules for effective presentation. Here's a sampler from the chapter on page design:

• 'Web pages should be dominated by content of interest to the user... Navigation is a necessary evil that is not a goal in itself and should be minimized.'
• 'Simplicity always wins over complexity, especially on the Web where every five bytes saved is a millisecond less download time.'
• 'Because there is no way of knowing how large a screen your users have, you should design... resolution independent pages that adapt to whatever size screen they are displayed on.'
• 'The only format you can use with complete confidence is the original HTML 1.0 specification. Anything beyond that will be beyond the capabilities of some of your visitors.'
• 'I recommend holding off on using any new web technology on your site until one or two years after it is officially introduced in a non-beta version.'

However, I have some difficulty with one of Nielsen's pronouncements, which is that, 'The original design of the Web and its underlying data format, HTML, were based on encoding the meaning of information and not its presentation.' I find this an incredible statement: all that HTML does is to indicate which part of a text is a heading, which a paragraph, which a list, and whether ordered or not, and so on. There is absolutely nothing here that says anything at all about the meaning of the text. He later refers to this idea as semantic encoding, but, unless he has quite different definitions of meaning and semantics from any I know of, I can only assume that he is trying to say that the original design of Berners-Lee was concerned with document structure, rather than presentation. But there is a world of difference between encoding structure and encoding meaning - that trick has evaded the information retrieval community for at least fifty years, and which librarians and documentalists last tried to tackle through indexing and classification.

That point is made in a section on separating content from presentation and, of course, Nielsen, in general is absolutely right. One of the problems that arises through the use of non-standard code, which current browsers are sloppy enough to accept, is that presentational effects are achieved at the expense of clarity of structure and, hence, content. However, it is odd that the author should confuse things further by referring to meaning and semantics. The only place for indicating meaning is in the meta-tags, and the true place for indicating presentation is, as Nielsen say, in the use of style-sheets. Quibbles, major and minor, aside, there is a wealth of sound advice in these pages. The basic message that pages should be simple and fast to load is one that the 'Flash-addicted' ought to bear in mind.

Sound advice also in the pages on content design but not always capable of being followed in an electronic journal. Nielsen's advice that texts should be short, scannable (i.e., short paragraphs and bullet points), in plain language, and in page 'chunks' is sound enough, but difficult to implement entirely in a journal, where the texts are (mainly) the responsibility of the authors. However, I have been thinking for some time about how to make the pages of the journal more appropriate for Web presentation and I have taken some of these points on board on this page. You will see that the usual bibliographic information is now at the end of each item, while the top matter merely gives the author and title, with the title serving to link to the part of the page concerned with that book. The reader in a hurry, who simply wants to know what I think about book X can get to the review quickly and does not have to read my deathless prose all the way through. Is this an improvement? Let me know.

The electronic journal is also so young that setting writing standards that differ from print-on-paper is difficult at the moment. Were I to change the format of the journal, I would have to do the re-writing or re-structuring of each paper. I cannot see writing specifically for the Web becoming a regular feature of the scholarly process for quite a few years to come. Indeed, for as long as the Web is seen as a kind of secondary publishing medium, for archiving materials already in print, there will be delays in developing something Web-specific. I have some ideas on what is needed and will probably create my next paper for the journal, whatever it may be, specifically as a Web product, rather than as a journal product.

All of this may seem remote from the task of reviewing Nielsen's book, but, in reality, it is central to the review process, since it demonstrates that Nielsen makes one think!

The second half of the book is concerned with more specialised topics: the design of intranets; accessibility for users with disabilities; international use; and the future of the Web. The chapter on intranets includes the injunction to get rid of e-mail - my current work on information overload would support this! Finally, there is a conclusion - simplicity in Web design, where Nielsen's ideas are boiled down to an acronym: HOME-RUN. That is, the four reasons for people to re-visit your site are:

• High quality content,
• Often updated,
• Minimal download time, and
• Ease of use.

To these can be added:

• Relevant to users' needs,
• Unique to the online medium, and
• Net-centric corporate culture.

I guess that, if you can score a Nielsen home-run, you don't need his book. If you aren't getting to first base, you definitely need it.

Professor Tom Wilson
Publisher/Editor-in-Chief
June 2001