|Access by Design online|
|Interview with Sarah Horton (digital-web.com)|
|Web Style Guide (Patryck Lynch, Sarah Horton)|
|Review of Universal Usability (Lazar)|
By Gerd Waloszek, SAP AG, SAP User Experience – January 14, 2008; updated: October 12, 2010
This review takes a personal look at Sarah Horton's book Access by Design.
Usability: Universal usability
Horton is a Web developer with Academic Computing at Dartmouth College,
where she helps faculties incorporate technology into their teaching.
Together with Patrick Lynch, she wrote the best-selling Web
Style Guide, recently released in its second edition. Sarah regularly
writes about and speaks on accessible Web design.
I cannot think of any other topic in the electronic universe for which so many guidelines and recommendations have been written as for the design of Websites. On the other hand, there is probably no other area in the electronic universe where there is so much uncontrolled growth. Admittedly, there are some de facto standards, or perhaps I should say "trends," which many Web designers and sites adhere to, albeit not always for the benefit of the Website users. There is also a committee, the World Wide Web Consortium, or W3C in short, which tries to standardize certain, mostly technical, aspects of the Web. And for those who want to base their design decisions on research results there are even research-based guidelines for the design of Websites available. But the "hyper medium" Web still leaves an enormous amount of room for diversity with respect to interaction, visual, and information design.
So, here is one more style guide for Web designers. This time it has been
written by Sarah Horton, and as you will see in my conclusion at the end of
this review, it is one that I wholeheartedly recommend. (Horton's style guide
is available in an online format and as a book; my review is based on the latter.)
Actually, Horton is an "old hand" in the Web style guide business.
Together with Patrick Lynch, she co-authored one of the
earliest and best known sets of guidelines for the Web, now called the Web
Style Guide. Horton calls her latest style guide Access by Design – a
Guide to Universal Usability for Web Designers, indicating that she now
follows a universal Web design approach. Her design approach has been inspired
by universal usability, a concept introduced by Ben Shneiderman in an ACM article in
2000. In a nutshell, universal usability means that communications and information
technology should be "usable by all."
(For more information on universal usability, see Universal Usability, a review of the book Universal Usability, or the highlight topic Universal Usability on the SAP Design Guild.)
Sarah Horton's premise for her new book is that "when we design a Website, we design for everyone. Our choices affect anyone who tries to use our site." And this can be almost anyone in the world, I would like to add – the Web is truly the most universally used electronic medium in the world. The role of designers has been discussed by many authors, often controversially. For Horton, the designer's task is to make choices, based on the purpose of the designed artifact and led by best practices to achieve that purpose. "But what is the purpose of the Web?" she asks and concludes that the complex and dynamic character of the Web, as well as the diversity of its users, make it difficult to find a useful basis for design decisions. For example, the purpose of the Web evolves as the technology grows and changes. For designers struggling with this dilemma, Horton's book takes a two-fold approach: First, it attempts to answer the question "What can be used as a basis for design decisions when designing Websites?" and secondly, it "provide[s] guidelines for making design decisions that work for the greatest number of users." I will come back to these two aspects below.
Sarah Horton has been in the Web design business for a long time. In her book, she describes her journey through different Web design paradigms over time. She starts with the graphic design hype (everything had to look good, standards were there to be twisted – see David Siegel's book Creating Killer Websites), before moving on to information design, which attacked the issue of site structures that get out of hand, and finally user-centered design. For the first time, she changed her perspective about the designer's role: "Until then, I felt my role as a designer was to make decisions about the design of my pages on behalf of the user, based on what I knew on graphic, interface, and information design. Once I started with users, I could derive design decisions by observing user behavior and feedback."
Her perspective changed once more when she started to focus on Web accessibility: "I stopped trying to impose design and began optimizing my pages for graceful transformation." From then on, she adopted the point of view that designers and users are partners and collaborate: Designers provide designs that are so flexible that they do not prevent users from adapting Web pages to meet their personal needs. I assume that only a few Web designers have adopted her position to-date. Horton also learned to appreciate the usefulness of Web standards, because "fighting for consistency in an inconsistent environment (that is, diverse browser platforms which do not conform to standards) may lead to inaccessible solutions, such as text graphics."
Because Horton preferred the basic premise of universal design, namely to "provide for diversity through design rather than accommodation," she exchanged her "access to all" perspective for a "design for all" one. Soon, however, she found out that the universal design concept was more geared towards the design of physical artifacts, not electronic ones. Then she came across the idea of universal usability, promoted by Ben Shneiderman, and found it the most appropriate guidance for her work, because it directly addresses communications and information technology and also focuses on usability: "Many Websites that meet the standards and guidelines for accessibility are not usable." Consequently, Horton decided to adopt universal usability as her design methodology and the focus of her new book.
Sarah Horton's book includes a foreword written by Ben Shneiderman, the original advocate of universal usability, and another one written by herself in which she traces her own Web design history from graphic design to the recent adoption of the universal usability design methodology. In the introduction of her book, Horton promotes a functional basis for design, corresponding to L. H. Sullivan famous quote "form follows function." Horton maintains that "only by defining the function of the Web can we make appropriate decisions about its form." Here, she focuses on the first aspect of her book, namely to provide a solid basis for design decisions.
The main part of the book, which is composed of fifteen chapters, contains Web guidelines " for making design decisions that work for the greatest number of users." Here is an overview of the contents of the chapters:
The difference between the principles in the first two chapters seems somewhat fuzzy to me. One might also argue that page layout should have followed document structure, but these are only minor issues.
Each chapter is divided into two sections:
The first section provides more general rules, while the latter refers to page markup for the topic at hand (there are a few deviations from this structure, though). In the review below, I will generally talk of "guidelines" when I am referring to both. Each section consists of several guidelines, which are then explained and established. Moreover, each guideline is "nicely summarized," as Ben Shneiderman puts it in his foreword, in an "in a nutshell" paragraph at the end of each section.
Finally, the appendix at the end of the book repeats all the guidelines from chapter 1 to 15 – it is a collection of all the "in a nutshell" paragraphs.
Potential readers might ask what the difference between basic principles and markup recommendations is. Typically, the first are general, HTML-independent guidelines, such as "Avoid using frames" or "Use text for links," while the latter refer to the HTML markup itself. Examples of these would be: "Markup text using structural tags" or "Write valid code." However, I have the suspicion that Horton sometimes got a little confused by her own distinction. For example, in my opinion "Use list markup for lists" looks like a markup recommendation to me, and not like a basic principle, as which it is termed. She certainly confused me with that assignment. All in all, this seeming "fuzziness" is a minor, perhaps even personal issue, and does not hamper the overall usefulness of the book.
For people who want to gain a quick overview of Sarah Horton's principles and markup recommendations, I would like to suggest that they read the book as follows: Start with the forewords, read the introduction to understand the basis for the design recommendations, and then skim through the appendix and read the guidelines. If you ever disagree with a particular guideline (which I did from time to time), jump back to the respective chapter and consult the justification for the principle.
Before focusing on the main part of the book, the guidelines, I would like to recap the book's basic definitions that, according to Sarah Horton, form the basis for design decisions: audience, functions, and attributes that enable these functions. I will also illustrate these definitions with examples.
For the most general definition of the audience of Web pages, Horton distinguishes two user types:
Please note that the second user type has a major impact on the recommendations because it imposes additional universal usability requirements.
According to Horton, the basic functions of Web pages are:
Horton defines the basic attributes of the Web that enable these functions as follows:
In their daily work, designers often face the conflicts between the requirements of form and function. As an example, the use of graphics for links may enhance the visual appearance of the site, because certain visual effects cannot be achieved with plain text. On the other hand, graphical links can can have a negative effect on the functioning of a Web page: Graphics cannot be smoothly scaled like text, pages with graphics may not adapt as well to different window sizes. Thus, we often find in practice that decisions about form take precedence over function. When this is the case, designers sacrifice function, says Horton. She believes sacrificing function means that fewer people can access and use the site – her ultimate, universal goal is, of course, to reach the highest possible number of users. As an example, Horton does not want to compromise flexibility in the page layout for visibility and readability because, in her opinion, the benefit does not outweigh the cost – namely, losing users as a result of a decision in favor of a "fixed" design.
For Horton, Web design is a kind of collaborative design: "Designers send content to the user in a way that is flexible, operable, text-based, and structured; users in turn, 'redesign' the content to fit their needs and preferences." That is, flexible design enables and also relies on collaboration between designers and users. It requires two things from designers:
Horton's final conclusion in this section is that "no matter how well we uphold function, we cannot possibly design a Website that meets the needs and the preferences of every user. The only reason universal usability is a realistic goal for Websites is because the Web is a flexible medium where designers and users share control of its design. With a working partnership, designers provide content that is well designed but flexible, and users adapt the design as necessary. To arrive at a successful collaboration, designers must assume less control and invite users to take more responsibility for their environment."
I am not sure whether all Web designers will agree with this point of view.
As already stated, the guidelines cover a broad range of Web design aspects, beginning with general issues, covering document and page structure, the use of different page elements, decoration, interaction, and even editorial style. Usually, they are separated into HTML-independent and markup-related guidelines. Of course, I cannot comment on all of these guidelines, some of which are very general, others self-evident (at least from an accessibility point of view), and some are debatable, or even hard to implement or conflict with other requirements.
To give readers an idea of the guidelines, I assigned some selected guidelines (irrespective of their type) to more general principles, such as simplicity, flexibility, accessibility, and partnering with users (see table 1 below):
|Simplicity||Simplify data table layouts|
|Simplicity||Avoid compound lists|
|Flexibility||Favor HTML over other formats|
|Flexibility||Design for transformation|
|Flexibility, Partnering with users, User control||Use style sheets for presentation|
|Flexibility||Use plain text for text|
|Flexibility||Design pages that accommodate different text sizes|
|Flexibility||Use text for links|
|Flexibility||Design flexible page layouts|
|Flexibility, Device-independence||Separate content and presentation|
|Partnering with users, User control||Allow users to control their environment *|
|Partnering with users, User control||Allow users to override color settings|
|Partnering with users, User control||Allow users to control the user interface *|
|Accessibility, Support nonvisual users||Design for keyboard access|
|Accessibility, Support nonvisual users||Markup document structure|
|Accessibility, Support nonvisual users||Markup text using structural tags|
|Accessibility, Support nonvisual users||Use structural markup appropriately|
|Accessibility, Support nonvisual users||Communicate visual information to non-visual users|
*) The distinction between these two guidelines becomes evident when the explanations are read.
Table 1: A selection of guidelines from the book, assigned (by me) to general principles
It would be interesting to assign all guidelines to such principles (one or more), but I will leave that to Sarah Horton for the next edition of her book. My guess is that most guidelines would be assigned to accessibility and flexibility. Assigning guidelines to principles might also help to remove some redundancy from the guidelines.
There are a few guidelines in the book that I would classify as "debatable," partly because they may be hard to implement in today's Web environment and partly because I believe that a number of designers would disagree with them. For me, the most debatable guideline is the ban that Horton puts on fixed-width Web pages, not the general principle of requiring a flexible design. (In the case of the SAP Design Guild Website, we have to "disobey" this guideline simply because the SAP branding rules require a fixed-width design.) Secondly, I think that the guideline "Design pages that function without style sheets" may cause some issues. As CSS-based layouts are used more widely, the chance that page layouts may "break" when there is no style sheet is greater than ever. Horton does, however, provide a corollary saying "Design pages for linear access," which gives some guidance as to what can be done to prevent this (there is also a corollary for those designers who still stick to table layouts: "Design layout tables for linear access").
In the discussion section of this guideline, I also stumbled over Horton's discussion of the use of div tags. Since CSS layouts are used more and more, tags, such as <div id="banner">, have become standard for defining building blocks of the page layout. I have no idea how else I would create them (and they are recommended by the textbooks). Horton proposes using structural elements, such as <p id="banner">, <ul id="footer">, and so on for that purpose, but that seems rather unusual to me. I therefore thought it would be a good idea to look at her Website's HTML code to get some inspiration, only to find a lot of div elements, including <div id="banner">, used to define the basic page layout. Perhaps I just encountered another example of the difference between theory and practice...
On the other hand, I appreciate that Sarah Horton, in contrast to some other authors, is not strict or fundamentalist about her guidelines. Rather than using terms, such as "do not" she writes "avoid" or "as a last resort," leaving a back door open for time-pressed designers (see table 2 below). She knows very well that in the real world there are many conflicting requirements to accommodate.
|Use tables for layout only when necessary.
.... Fall back on table layout only as a last resort
|Avoid using frames|
|Avoid compound lists|
Table 2: Some guidelines that discourage the use of certain design elements
I would like to make the following three suggestions to improve the book:
First, there is a lot of redundancy in the book, which might annoy readers who read the book from cover to cover. Personally, I found this redundancy wearying from time to time. However, when the book is used as a reference guide, redundancy may be welcomed by the readers.
As Ben Shneiderman points out in his foreword, Sarah Horton assumes knowledge of HTML and CSS. But how much knowledge does she assume? Having some knowledge does not mean that one would know all the tricks, particularly with respect to CSS page layout and other queer markup problems. For example, I find CSS layouts far from intuitive, and often got results that conflicted with what my information sources from the Web told me (even though the Zen Garden Website and book seems to demonstrate that "everything is possible"). If you need practical advice, such as code examples, you will neither find it in the main section of the book, nor elsewhere – not even on the accompanying Website. It would be helpful if the book contained code examples that suggested solutions to realize certain recommendations made in the book. This would definitely be appreciated by the readers. I agree that the book would be much thicker and less handy if code examples were included, and would therefore recommend a second volume dedicated to practical examples as a nice companion for the book. Alternatively, if code is not included in the book because it quickly comes out of date, why not provide such examples on the Website? The site might also offer a forum where designers can discuss and exchange their best practices regarding universally usable design and markup solutions.
Finally, as I already mentioned, I found that some of the distinctions and guidelines in the book seem a bit fuzzy to me. I know that it is often hard to avoid fuzziness. Perhaps, as an example, it would be less confusing for readers if there was no distinction between basic principles and markup recommendations?
This book review has become much longer than I had initially intended, but besides reviewing the book, I also wanted to communicate the ideas and concepts behind it. You may also find the review too critical at times. But being critical can mean different things. In this case, it means that I find the book highly relevant and inspiring – its content really cries out to be handled critically. Consequently, please see my critical remarks as an indication that this book provokes thought and debates. For example, I am convinced that a lot of Web designers will not agree with the role that Sarah Horton has defined for them and the users of their products. Where to place the boundary between what is within the designer's and what is within the user's control should also be a matter of intense debate in the design community.
The overall goal of the book, making Web sites accessible and usable for as many users as possible, should be beyond any debate – but it remains a huge challenge to Web designers. The challenges Web designers face have even increased in my opinion as a result of the latest Web developments, such as Web 2.0 and AJAX. AJAX promises better interaction, but again at the expense of making Websites accessible to fewer users. The guideline "Favor HTML over other formats" is more endangered than ever. All in all, Sarah Horton should have "hard stuff" enough for a new edition of her book. I am sure that she is already working on it.
As a conclusion, I wholeheartedly recommend this book to Web designers and to all UI people who are interested in the Web and universal access or usability.
Regarding the SAP Design Guild Website, we will continue to follow a pragmatic approach: We will try to make it as usable as possible, but within the constraints determined by our company's branding rules.
A final word: From the conflict between form and function, Sarah Horton concludes that quality Websites, which are universally usable, are not simple to design and build. But she is quick to point out that this task is "no more difficult than designing and building Websites that are not good and not usable." I have to admit that I do not agree with the second part. I think that it's still easier to design bad Websites. Doesn't the Web itself prove this every day? And isn't that reason enough for more Web designers to read Sarah Horton's book and follow its recommendations?