PAWAN R. VORA design/methods & tools

Designing for the Web: A Survey

A majority of the surveys on the Web, for example, the surveys conducted by Georgia

Tech’s Graphics, , & Usability (GVU) Center [2]; Nielsen Media Research [6];

and Nua [7], have focused on understanding the profile of the users of the and

the Web. As it is important to understand how users interact (i.e., read and navigate) with

Web pages in order to design usable Web pages, it is also important to understand how

Web authors (or designers) design Web pages in order to design usable Web page

development tools.

Ainteractions...may + june 1998 13 Although the 8th GVU survey did have a they consider bandwidth and accessibility section for the Web authors, the emphasis was issues when designing Web pages? How on discovering respondents’ backgrounds, do they evaluate the Web page designs for development experience, use of Java™, and usability? How do they publish Web pages other information related to Web develop- to the ? ment. The focus of this survey, on the other hand, is on understanding the process of Methodology designing and developing Web pages and to Survey participants were solicited as follows: understand better how Web developers design ✖ Announcements on newsgroups: Web pages. Specifically, the survey was comp.human-factors and alt.hypertext. designed to achieve the following objectives: ✖ Announcements made to the mailing lists: The May/June Design ✱ Construct Web designer profile. Who are UTEST, Artists and Methods & Tools typical Web designers? What kind of pro- Consortium, WebHCI, Human columns have been fessional training do they have? How Factors/Web conference participants, combined into one as a much experience do they have designing Webgrrls (Chicago Chapter), result of a collaboration Web pages? What types of pages do they WebWomen, and . between the editors for design? One hundred and thirty-eight people each column. ✱ Identify the key components of the Web responded to the survey over a 4-week period designer’s “toolkit.” What kinds of Web from December 17, 1997, to January 15, development tools do they use? What do 1998. Like other surveys on the Internet, they like or dislike about them and why? these respondents were self-selected, and they ✱ Understand the Web development envi- responded to the survey via ronment. How much time does it take to ❥ E-mail because the survey was included in develop Web pages? How many pages are the solicitation message. developed in that time frame? Do Web ❥ The Web (the survey was made available designers work in teams? How many at the ACM SIGCHI’s Web site; URL: people participate in these teams? Do the http://www.acm.org/sigchi/web/survey/ time available and number of people in index.). the team affect their selection of tools? ❥ Postal mail. ✱ Outline the design process. Do Web designers use style guides/design guide- Survey Results lines when developing Web pages? Do The survey results are organized in the fol-

14 interactions...may + june 1998 lowing sections: Web Designer Profile, Authoring Tools, Web Development Environment, Web Page Design & Evaluation, Publishing Web Pages, and Overall Comments.

Web Designer Profile

Professional background The responses indicated that there is no prototypical professional background for a Web designer (see Figure 1). They come from a variety of professional backgrounds, such as computer programming, graphic design, human factors, marketing/adver- tising, design, and technical writing, and often have additional training in and “to help friends, family, and non-profit cognitive psychology, multimedia, and educa- organizations.” Other reasons for designing tion. A relatively high number of responses Web pages included education, communi- from people with professional backgrounds in cation, community building, artistic user interface design, graphic design, and endeavors, and to make money (or to human factors, however, were expected engage in a profitable activity). because these professions are well represented in the newsgroups and mailing lists from Web page design experience which the responses were solicited. Interestingly, a majority of the survey respondents (96 of 138) had more than 2 Reasons for designing Web pages years of experience (see Figure 3), suggesting There was no single, dominant reason for a bias toward the “expert” category of Web these individuals to be authoring Web pages developers. However, because the survey (see Figure 2). “Primary job responsibility” didn’t ask the respondents to give an esti- was cited as often as “one of the several tasks mate of the number of Web pages they have required by job,” “hobby/personal interest,” designed or the number of Web pages they

interactions...may + june 1998 15 design in a month, it is difficult to discern their for Web pages they designed, authors’ “expertise” in the area of Web page design truly. responses were overwhelmingly focused on corporate sites for customers and vendors or Principal audience for personal use by the author (see Figure 4). When asked to identify principal audiences Types of Web pages designed Finally, the types of Web pages designed by author respon- dents are shown in Figure 5. Given that a majority of Web pages were designed for corpo- rations and personal use (Figure 4), the most common Web page types were work/organization informa- tion, product/service informa- tion, and personal home pages. A small percentage of pages designed was research papers/reports (6.5%), which are more likely to be for edu- cational institutions.

16 interactions...may + june 1998 a b

c d

e

Figure 6. Web Page Authoring Tools (a) Text editor (Simple Text-back; NotePad-front) (b) HTML Editor (Bare Bones ’s BBEdit-back; Allaire’s HomeSite 3.0-front) (c) WYSIWYG Editor ( DreamWeaver-back; Claris HomePage 2.0-front) (d) Site-oriented Editor (NetObjects Fusion) (e) -based Editor (Vignette StoryServer)

Authoring Tools Web page editors/generators This section addresses the types of authoring There are several ways Web designers create tools used. It is divided into four subsections: and generate Web pages. They often use one Web page editors/generators, HTML or more of the following (see Figure 6): (HyperText Markup Language) conversion ✖ Text editors. Because HTML files are tools, PDF (Portable Document Format) con- ASCII text files, text editors offer the version tools, and graphic design tools. most basic way to design the Web pages.

interactions...may + june 1998 17 They do not, however, offer any assistance as NetObjects Fusion and GoLive’s to Web designers, and it is the responsi- CyberStudio allow the Web designers to bility of the Web designers to remember, add and rearrange pages in a tree-struc- write, and debug the HTML code they tured site diagram. The navigation bars develop. Examples of text editors are and links for the Web site are automati- NotePad, WordPad, SimpleText, and vi. cally generated for them. Site-based edi- Pawan R. Vora ✖ HTML editors. HTML editors support tors also allow rapid changing of the U S WEST web designers in writing HTML tags overall look of a site. Communications using menus, toolbars, and keyboard ✖ Database-generated Web sites. Many large 931-14th Street, shortcuts. They do not, however, write or Web sites do not build each page manu- Suite 710 hide the HTML tags from Web designers; ally. They hold the web page elements Denver, CO 80241, USA Web designers work directly with raw (text, graphics, headers, footers, etc.) into 1+303-685-2023 HTML tags. Many HTML editors also a database and automatically generate [email protected] offer additional functionality such as pages by retrieving and combining the HTML validation, link verification, elements as the Web browsers request spellchecker, and customized menus. them. Examples of database-oriented Web Examples of HTML editors are Allaire’s page–generation tools are Vignette HomeSite, Bare Bones Software’s BBEdit, Corporation’s Vignette and Lotus Notes and Sausage Software’s HotDog (with Domino Web server). Professional. The survey asked respondents to identify ✖ WYSIWYG (“What You See Is What You the type(s) of Web page editors/generators Get”) editors. WYSIWYG editors work they had used, to identify specific products like word-processing or desktop pub- used, and to rate, on a scale from 1 to 7 (1 = lishing programs, allowing authors to lay low and 7 = high), those products in terms of out pages as they want, and the editors satisfaction, learning, ease of use, function- write the necessary HTML code in the ality, and extensibility. A summary of their background. The Web designers do not responses is shown in Table 1. really need to know HTML. Examples of The majority of respondents (104) used WYSIWYG editors are Adobe PageMill, basic text editors to design Web pages. The Claris HomePage, Symantec’s Visual Page, most frequently reported text editors were Microsoft FrontPage, and Macromedia Notepad (42), SimpleText (17), WordPad Dreamweaver. (14), vi (11), and BBEdit Lite (8). HTML ✖ Site-based editors. Unlike the Web page editors ranked second as the authoring tool of development tools discussed so far, which choice; 89 respondents reported using them. are page-oriented, site-based editors such The most common HTML editors were Bare

Table 1. Evaluation of Web Page Development Tools (Response Scale: 1 = Low; 7 = High) Text HTML WYSIWYG Site Database Number of Responses 104 89 74 29 19

Satisfaction 4.76 (1.70) 5.93 (1.06) 4.70 (1.59) 4.79 (1.45) 4.83 (1.38) Ease of Learning 5.41 (1.91) 5.48 (1.21) 5.19 (1.45) 4.38 (1.47) 3.78 (1.80) Ease of Use 5.40 (1.68) 5.75 (1.13) 5.20 (1.37) 4.79 (1.35) 4.06 (1.73) Functionality 4.21 (1.82) 5.67 (1.35) 4.49 (1.57) 4.72 (1.62) 5.44 (1.72) Extensibility 3.60 (1.95) 5.57 (1.52) 4.07 (1.66) 4.24 (1.88) 5.53 (1.23)

18 interactions...may + june 1998 Bones Software’s BBEdit (38) and Allaire’s The basic premise of WYSIWYG HomeSite (22). Of the 74 respondents who authoring tools is that the Web designer need reported using WYSIWYG editors, the most not know any HTML. They often do not, commonly named were Microsoft’s FrontPage however, support all the HTML tags and/or (27), Netscape Gold/Composer (15), Adobe do not allow authors to write their own PageMill (10), and Macromedia Dream- HTML code. When they do allow authors to weaver (10). For site editors, Microsoft’s edit the raw HTML code, the authoring tools FrontPage (11) was the leader over Net- often override the HTML code written by the Objects Fusion (8). Finally, for database-based Web designers. Web designers, however, need DESIGN COLUMN EDITOR Web page–generation tool, the frequently better control over their code. This is how one Kate Ehrlich used were Lotus Notes/Domino (6) and Cold respondent commented: Senior Research Fusion (4). Web Authoring and Web Designing tools Manager By examining Table 1, it is obvious that should allow maximum freedom to the Lotus Development respondents were quite satisfied with HTML designer. I think this is the reason why Corporation editors, ranking them higher with respect to Homesite and BBEdit were successful because 55 Cambridge Parkway functionality, ease of learning, and ease of use they allow maximum flexibility to the user. I Cambridge, MA 02142 than the other methods of creating Web think this is also the reason why NetObjects +1-617-693-1899 pages. WYSIWYG editors probably generated Fusion is doomed because the designer is fax: +1-617-693-8383 the majority of the “negative” comments trapped to the confines of the program’s rigid [email protected] where their usability and effectiveness were structure. concerned. Some of the comments were: This doesn’t mean, however, that all Web METHODS & TOOLS Most “WYSIWYG” editors insert too much authors want to write HTML. It’s just that COLUMN EDITORS extraneous code for my taste. today’s Web authoring tools do not do a good Michael Muller Most tools don’t support all of the current job in delivering what an author needs. This is [email protected] HTML tags & keywords—most have prop- evidenced in the following comments: Finn Kensing erty boxes or dialogs, but you have to use the As a designer, I have little interest or talent in Computer Science HTML view to edit the code directly to get writing code, so I depend on a good Roskilde University anything non-trivial done. WYSYWIG editor like NetObjects or P.O. Box 260 Prefer writing code directly rather than using FrontPage to help with that aspect. DK-4000 Roskilde “WYSIWYG” tools because these allow more Unfortunately, to date there has been no Denmark control of the HTML code and do not add editor that is as clean, efficient, or as versatile, +45-4675-7781-2548 “redundant” code. as hand-coded HTML. fax: +45-4675-4201 I don’t use it [FrontPage] anymore, because it I don’t mind doing it, but I think most [email protected] is too inflexible/automatic for my needs; e.g. designers shouldn’t have to learn coding to do it puts in tags that I don’t want, or takes out cool things on the Web. ones I need, requiring lots of post-editing. Interestingly, WYSIWYG tools are used by The WYSIWYG HTML editors that I have some authors to design simple pages instead of used are useless, and don’t do all the things their proposed use for designing complex that HTML can do. pages. As one respondent commented, “Web From respondents’ comments, it was clear tools OK for simple pages, often easier, but that their annoyances stem from the one or prefer text editor for anything more complex.” more of the following characteristics of The exception was Macromedia Dream- WYSIWYG authoring tools: weaver, a recent entrant into the market of ✦ Generation of excessively redundant code. WYSIWYG authoring tools. It received sev- ✦ Overriding (not respecting) author’s eral praises. Obviously, the main source of HTML code, requiring author to use praise was that Dreamweaver does not over- another editor to finish the work. ride the author’s HTML code and lets the ✦ Not allowing authors to see and/or edit Web author use an HTML editor of choice. the HTML code. As one respondent indicated, “This tool gives ✦ Not supporting all HTML tags. the user the ease of a WYSIWYG, but the

interactions...may + june 1998 19 control of BBEdit.” business productivity suites in one of the products and then convert HTML conversion tools them to HTML. Fifty-four respondents reported using HTML conversion tools; their ratings are summarized PDF tools in Figure 7. The most commonly used con- Approximately 25% of the respondents (34) version tools were Microsoft’s Internet reported creating PDF documents on the Assistants (for Word, Excel, and PowerPoint) Web. A majority of users reported using and Office ‘97. Acrobat Exchange (14) and Adobe Distiller Overall satisfaction with HTML conver- (8). Several people also reported using the sion tools was fairly low (mean, 4.17; standard functionality available in PageMaker and deviation, 1.75), despite their being consid- FrameMaker to save files directly as PDF doc- ered fairly easy to learn (mean, 5.19; standard uments. Overall, most users seemed satisfied deviation, 1.51). The main reason cited for with the products they were using to convert low satisfaction was that conversion tools, documents to PDF (see Figure 8). such as WYSIWYG editors, generate consid- erable redundant HTML code during the Using a combination of tools to develop conversion. This makes the file sizes larger and Web pages the HTML code difficult to read. In addition, A majority of users reported that they “always” it is cumbersome to change the “converted” (51.4%) or “sometimes” (31.9%) used a com- HTML documents manually and “risky” to bination of tools (see Figure 9). try and make global changes across several The combination of tools used invariably documents at the same time. consisted of one or more of the HTML edi- The reason for the low value for “extensi- tors and graphics tools. The most common bility” for HTML conversion tools (Figure 7) was a WYSIWYG editor along with a text is obvious when you consider that a majority editor or an HTML editor. A text editor or a of respondents used Internet assistants for text-based HTML editor was seen as necessary , Excel, and PowerPoint for in order to “clean up” the code created by converting the documents to HTML. These WYSIWYG editors. Specific reasons for using tools convert only the documents created a combination of tools are as follows: using Microsoft Word, Excel, and ✦ To clean up the code generated by PowerPoint, respectively. Of course, one can WYSIWYG editors or HTML conversion always import the documents created by other tools. This comment probably summarizes the most cir- cuitous route: “For text oriented sites, I usually use Internet Assistant for Word to con- vert text to HTML, then I use BBEdit to strip out all the junky formatting that Word causes. Then I use DreamWeaver to format with Style Sheets, and fine- tune the design.”

20 interactions...may + june 1998 Another comment also provides the necessary evidence: “Pagemill is great for quick pages . . . but it writes sloppy code and unless you use SimpleText or BBEdit are you able to really program or clean code up.” ✦ To support differ- ences in the devel- opment platform and production platform. As one respondent described, “I start in VisualPage on the Mac because it’s easiest, then tweak it in a text editor and bring it over to my UNIX box. If I then need to update it frequently, like the Weekly Seminar schedule, I update it in Composer, because it runs on UNIX and I don’t have to move the files around.” ✦ To take advantage of special features offered by some tools. Several Web design tools offer functionality beyond creation of Web pages, for example, document. Because most Web page devel- spellchecker, link verifier, HTML validator, opment tools do not support creation of and site manager. Web page designers often multimedia components (audio, video, use additional tools just to take advantage animation, etc.), separate development of such specialized functionality, especially tools are required for their creation. when they are not integrated or poorly The question, of course, is this: Should implemented in their otherwise preferred there be a tool that allows people to do all they development tool of choice. One reason for need to do to develop Web pages? Maybe not! doing so is Web site management: “Often As a few respondents pointed out the relevant the client wants to manage/add to the site concerns: themselves, so things are often designed in In this era, serious work in almost any soft- BBEdit, and then imported into FrontPage ware endeavor requires appropriate tools. for the ‘link management’.” Relying on one tool to do everything is ✦ To create graphics. Although WYSIWYG now the mark of (a) a trivial task or (b) an Web page design tools support conversion amateur. of graphics to a Web-ready format, they [B]ecause there is no one tool that does it all, generally do not provide sophisticated and if there was [I] probably wouldn’t use it tools for creation of graphics. Most because [I] am generally not impressed with designers use dedicated graphics software software that has a bazillion functions. to create the graphics and point to them when designing the Web pages. Designing graphics ✦ To handle multimedia components in a A majority of respondents “always” (44.2%) or

interactions...may + june 1998 21 The purpose of these ques- tions was to determine if responses to them have any relation to the Web develop- ment tools used, use of an in- house Web design style guide, use of and the type of usability evaluation methods used, and other Web design and develop- ment variables. As pointed out by several respondents, how- ever, these questions were ambiguous and ineffective in cap- turing useful infor- mation. Here are some of their reac- tions: [D]umb question, it depends on if I have to do content, and how many graphics they want. Also what is a set? It depends on if there are a lot [sic] of links. “sometimes” (48.6%) designed graphics when How long is a piece of string?! It depends on they design Web pages (see Figures 10 and 11). the project, who’s doing the work, [and] what The most commonly reported product for they want. . . . We recently redesign- developing graphics was ed our 11 top welcome and contents pages. (90 respondents reported to using it.) This project took over a year from design to Interestingly, despite it being noted as rela- implementation. I did an entire web site of tively difficult to learn (mean, 4.35; standard 11 pages for a health centre in 3 days. deviation, 1.55), the satisfaction with Adobe [D]on’t think it’s possible to answer this. It’s PhotoShop was fairly high (mean, 6.34; stan- very dependent on what I’m developing, dard deviation, 0.73). Other commonly used number and type of graphics, whether I’m cre- graphic design products were ating content or using stuff that’s already been (21), PaintShop Pro (7), and Debabelizer (6). written, etc. . . . I’m not sure what you mean by participate. . . . I tend to do most of the Web Development Environment coding, but get other people to help with There were three questions related to the Web design, testing, content-generation, etc. development environment: The ambiguity in our questions is obvious 1. What is the average time to develop a set from the previous comments. Despite the of Web pages? ambiguities, most people did respond to the 2. How many Web pages are designed in this questions, and their responses are summarized duration? in Figures 12, 13, and 14. The responses can 3. On average, how many people participate be summarized as follows: in Web development (including yourself)? ✱ A majority of Web development projects

22 interactions...may + june 1998 are less than 3 months with many of them less than a month. ✱ About 50 or fewer pages are developed in this time period. ✱ Most Web development teams have fewer than five people on their team. Because of the potential mis- understanding and corre- sponding low reliability of the responses, however, I have refrained from correlating these with the Web development tools used, usability testing per- formed, and other Web design variables.

Design and Evaluation

Use of Web design guidelines/style guides Almost 90% of the respondents reported using Web design guidelines and/or style guides when designing Web pages (see Figure 15). Of these, about 38% used design style guides devel- oped in-house, and about 50% of them used design guidelines available on the Web, as well as those developed in-house. Although this is encour- aging, one can only surmise the extent to which the design guidelines are used in designing Web pages. A similar survey conducted by Mosier and Smith [5] for designing software applications showed that although the user interface design guidelines are considered generally useful, there are significant problems in the practical application of guidelines. The most frequent problem for difficulty in applying guidelines was that the guide- lines were too general and

interactions...may + june 1998 23 width bottlenecks on the Web and the users’ dislike about often long waits to download Web pages; GVU’s 8th WWW User Survey reported that 63% of the respondents were unhappy with the speed at which Web pages download [2]. Ninety-nine percent of the respondents in this survey indicated that they always or sometimes design pages for faster download

(see Figure 16). But, as one respondent pointed out, often the clients drive the deci- sion: “[S]ome clients claim all their visitors will be on T1’s, and thus they want mondo [sic] graphics and could care less about folks on modems.” Though designing bandwidth- heavy sites may seem justified in such situa- tions (for example, when designing intranets), I have noticed that many clients overlook the needs of telecommuters, who may be using slower modems to access the Web pages. were often not translated into specific design rules that developers can use. Designing for accessibility Web design guidelines tend to be more spe- The responses to this question—Are designs cific as they place emphasis on common look optimized to improve access to people with and feel of the Web pages [3] and, therefore, disabilities?—were not very encouraging. One easily implemented. For example, third of respondents has never considered ✘ Pages should be time stamped and dated. accessibility when designing Web pages. Only ✘ Every page should have a title. 16.7% of respondents have always designed ✘ Provide WIDTH and HEIGHT Web pages to improve access to people with information for images. disabilities, and the remaining 50% of the ✘ Do not use “click here” or similar words respondents have “sometimes” optimized their to designate a link. designs to improve accessibility (see Figure 17). This is similar to what Daryle Gardner- Designing for faster download Bonneau found when she conducted an Most Web designers seemed aware of band- informal survey on UTEST (a listserver for

24 interactions...may + june 1998 usability professionals) in late 1997 on Web referring to some other design strategies? (For site accessibility [1]. She concluded that more details on Web accessibility, see Trace ✦ Despite the simplicity of making Web Research & Development Center Web site [8] sites largely accessible to people with dis- and World Wide Web Consortium’s Web abilities, very few were actually doing it. Accessibility Initiative (WAI) [9].) To under- ✦ People really didn’t know much about this stand the accessibility issues in more detail, problem or the available solutions for it. especially to understand how people accom- Very few respondents answered Daryle’s modate special populations in their Web page questions about whether and/or how they designs, a separate survey looking into the ensure that their web sites are accessible. She accessibility issues is warranted.) commented: There’s a certain hypocrisy (or irony) in the Usability evaluation of Web pages fact that the professionals on this list—which When asked “Do you evaluate the Web pages is devoted to usability—are largely ignoring a you design for usability?” 70% of the respon- sizable body of potential clients when devel- dents evaluated their Web pages for usability oping Web sites (at least commercial sites), “all the time” or “almost all the time” (see especially when the solutions to accessibility Figure 18). A majority of these usability evalu- problems are so simple, in most cases. Of course, Web designers may not always be at fault. As one respondent pointed out, We always use alt tags, all the easy stuff, but few clients are willing to pay for anything that’s extra work. . . . I think your survey is ignoring the fact that most of us Web designers are customer driven—i.e. I might want to do some- thing a certain way (like make pages accessible to folks with disabilities) but the client doesn’t want to pay for that “extra” so it doesn’t happen. Also, even when we want to do extensive usability testing, clients always want the Web site “yesterday” and don’t want to wait. Though the response rate appears to be fairly good in the current survey about the awareness of accessibility issues, it is not obvious which design strategies Web page authors adopt to design for accessibility. Do they design a separate text-only site? Do they provide “ALT” text description for the image or do they “D” tag the images to link to a page that contains textual description of the images? Do they avoid use of frames, or are they

interactions...may + june 1998 25 ations, however, are informal (conducted with marketing. Consequently, it is possible that colleagues and people in the development usability professionals, who are more likely to team) or user walk-throughs (see Figure 19). be user-oriented, are overrepresented in this Other evaluation methods used by the respon- survey. dents were user questionnaires and surveys, user feedback forms, remote usability testing, Publishing Web Pages focus groups, and off-line testing (e.g., testing The final step in Web page development is access speeds at 28.8 K modem, testing with a transferring the Web pages to the Web server. variety of browsers, and analysis of server logs). There are three main ways to do this: What was encouraging was that almost half 1. FTP (). By logging of the respondents conduct usability testing in into the FTP site of the Internet service a controlled laboratory setup. Although some provider (whether internal or external) testing is better than no testing, informal and transferring the files. testing does have limitation in that the user’s 2. HTTP PUT. This method also requires viewpoint is overlooked. As one respondent log-in, but the file transfer takes place by said, “Many people I work with evaluate the using the Web’s Hypertext Transport web based on how ‘they’ surf; disregarding Protocol (HTTP). how our typical viewer surfs.” And, most 3. Directly copying the Web pages to the people in the Web development teams are less Web server. likely to be typical users. As shown in Figure 20, the two most common publishing methods were FTP and copying the files directly to the server. It is not sur- prising that publishing via HTTP was not that common because few authoring tools support it; one reason is that currently it is not as secure as FTP, unless SSL (Secure Sockets Layer) is used along with HTTP. The need for several people in the Web devel- opment team to publish Such a high the files to the server appears to be quite number of respon- common; about 75% of the respondents have dents conducting encountered that situation either “always” or some form of “sometimes” (see Figure 21). When several usability tests are people need to publish on the Web, appro- probably expected priate measures must be taken to ensure that as a significant the authors do not overwrite each other’s work number of the or delete the files by mistake. Of course, with respondents had the support of check-in/check-out of docu- professional back- ments in publishing tools, costly errors could grounds in human be avoided. Very few Web development tools factors, user inter- today support such functionality. To avoid face design, tech- such errors, team members could either hand nical writing, and the work to a Webmaster or a coordinator,

26 interactions...may + june 1998 who can then publish the Web pages directly to the Web server. In almost 50% of the cases, however, directly copying to the Web server is the method of choice (see Figure 22).

Overall Comments Offered by the Respondents Respondents’ comments made clear some of their dis- likes and annoyances when designing Web pages. Their comments are summarized below. each page to download. This is as much of a Annoyances with WYSIWYG authoring usability problem, in my opinion, as poor site tools mapping or outdated links. As mentioned before, most people were dis- appointed and/or frustrated with WYSIWYG Browser incompatibilities authoring tools. They tended to follow up “Browser uniformity, browser uniformity, their use of WYSIWYG tools with text editors browser uniformity,” was a comment made by or text-based HTML editors to “clean up” the one respondent. HTML code and/or to fine-tune the final look This was probably the most frequent com- and feel of the Web pages. plaint among Web designers. Designing Web pages that not just look good but work for all Inadequate attention paid to the audience’s users has become extremely difficult, if not needs impossible. This is obvious when you consider Several respondents felt that adequate attention the use of proprietary technologies and was not paid to the needs of the actual users. incompatible support for HTML standards Far too little emphasis is placed on the design among different browsers. Several respondents of information for the Web as it is perceived voiced their complaints and frustrations about by the target audience. . . . When too much these incompatibilities: emphasis is placed on the technology, the site I’d like less divergence between browsers! becomes a gadget trap for the user; similarly, I personally am sick of the disparate ways that when too much emphasis is placed on the all the differing browsers “choose to interpret” artistic component, the site becomes some- HTML. thing lovely to look at but not a useful tool. A The important thing is to be able to design well-researched navigational architecture once, and know that it can run anywhere, brings together the technical wizardry and and not have to change everything if the ISP excellent, effective design to create a Web site changes server platform on you, or if some that is intelligible to the user, easy to use, and company goes out of business. as a result accomplishes its mission. This is an Get the browsers to agree on compatibility essential first step in the development of issues. expansive and complex Web sites. (Note: the It seems that I spend most of my time original comment was in ALL CAPS.) adjusting pages so they look even vaguely sim- Too many web designers fail to consider their ilar on a version 6.x Mac with Netscape and potential users when designing their web on a Windows95 PC running Explorer4. If pages. A good example of this designing web this were true for any other publishing pages that takes remote access users (users industry, the designers would have rebelled dialing in through a modem) several minutes already. MORE COMPATIBILITY!

interactions...may + june 1998 27 Browser incompatibilities can make a Web own graphics and is very satisfied with using developer’s life from just a bit annoying to Adobe PhotoShop. totally frustrating. The Web authors need to Because of a variety of Web design projects know the differences in the browsers not only being worked on, it is difficult for the Web to design effective Web pages, but also to be developer to specify unambiguously how long able to make effective use of Web develop- it takes to develop a set of Web pages and how ment tools. The authors now need to know many pages are developed during that time what features of a Web development tool most period. Most of the Web page design projects, browsers support before using them. however, are very likely of very short time Increasingly, Web development tools (espe- periods—less than 3 months. And, while cially WYSIWYG tools) provide better sup- working in teams of less than five people, the port for one browser over the other. For Web author probably develops about 11–50 example, one could easily create a page with pages during this period. dynamic HTML using FrontPage ‘98. And, The uses design guidelines the page will work just fine when using or style guides when developing Web pages, 4.0 but will not work when and the sources of these guidelines are those using Netscape Navigator 4. The same is true available on the Web as well as those developed when using Cascading Style Sheets (CSS), in-house. Although the author designs pages which is implemented better on Internet that are optimized for faster download, he or Explorer 4.0 than on Netscape Navigator. she may not always optimize them to support people with disabilities. The Web designer Summary: Profile of a Web Designer evaluates the Web pages he or she designs for From the results, we can state the following usability almost all the time, and his or her pre- about this survey’s prototypical Web designer: ferred methods of evaluation are informal ✖ He or she has typically more than 2 years methods (with colleagues and people in the of experience designing Web pages. development team) and user walk-throughs. ✖ He or she designs pages mainly for corpo- To publish Web pages, the Web author ration or personal use. uses either FTP or copies files directly to the ✖ Web page design is his/her primary task, Web server. And, because several people in the one of several tasks required by the job Web development team need to publish on and/or a hobby. the Web server, he or she either solicits help of The Web author still hand codes Web a Webmaster or publishes the information pages using text editors or text- himself/herself. based HTML editors Finally, the Web developer is quite and is disap- unhappy with the browser incompatibilities pointed with the and feels that he or she wastes considerable WYSIWYG Web time making sure that the Web pages designed page development look good on at least Netscape Navigator and tools. The main rea- Internet Explorer. Despite misgivings about sons for disappointments are WYSIWYG Web page design tools, the Web excessive and redundant author is looking forward to tools that give the HTML code, limited control over necessary creative freedom and do not over- the look and feel of Web page ride hand-coded HTML pages. designs, and incomplete support of prevailing version of HTML. Caveat Although, sometimes, the Web author Although my interactions with Web designers uses HTML conversion tools, he or she is gen- of varied backgrounds lead me to believe that erally unhappy with the HTML produced and the sentiments expressed by the survey uses text editors for postediting the converted respondents are quite consistent with the gen- Web pages. Also, the author designs his or her eral Web design community, the reader

28 interactions...may + june 1998 should be careful in generalizing these results only HTML. There will be increasing use of to all Web designers. The previous profile is client-side scripting (ECMAScript: a stan- based on a small number (138) of Web dardized version of JavaScript), Dynamic designers who chose to respond to the survey, HTML, CSS, eXtensible Markup Language, and in that sense, they were self-selected. database integration, and yet unknown tech- Furthermore, the groups from which nologies. Web development tools will have to responses were solicited may be biased in favor architect their products such that to take of those with backgrounds in human factors, advantage of newer technology all a graphic design, user interface design, and Web designers has to do is just computer programming. GVU’s 8th Survey plug in an upgrade module found that most respondents had back- or a new tool to the Web grounds in computer science/programming– development tool. This related fields [2]. Because of these limitations, will allow Web designers it is difficult to generalize the results to the to create customized Web entire population of Web designers. development toolkits with each component of their Future Web Development Tools choice; for example, see It was clear from the survey that most Web Wallop Build-IT [10]. I designers were unhappy with the current state believe that even proposing of Web development tools, so what will make such an open architecture with them happy? Based on the responses in this associated protocols (without survey and personal experience, I will venture actual plug-in modules) that the following suggestions. Web development tool builders can use will be a significant Cooperation Rather than Competition improvement. Between Vendors Competition must give way to cooperation Support for Team Development between vendors. I believe that today’s compet- Future Web sites will very likely be several itive products are likely to become complemen- hundreds or thousands pages large. Develop- tary working to support the deficiencies of each ment teams of 1–2 people will be a thing of other. In fact, we see this trend today. past. To keep up with their Web sites, compa- Macromedia Dreamweaver, a WYSIWYG Web nies will push development responsibilities page design tool, completely supports Allaire’s outside of developer teams, letting other HomeSite and Bare Bones Software’s BBEdit as departments contribute and manage Web con- an alternative means for developing Web pages. tent [4]. Future Web development tools will Similarly, NetObjects Fusion 3.0 (beta) sup- have to support such collaborative arrange- ports third-party tools such as text-based ments. This is not to suggest that such tools are HTML editors and includes Allaire’s HomeSite, not currently available. Vignette Corporation a text-based HTML editor, as part of the Fusion offers a product called Vignette, which is a Package. Both of these tools even combine the team-based site-production development tool two modes so that a Web designer can choose to that allows writers, editors, producers, and work either in WYSIWYG design mode or in Webmasters to collaborate in the content- the text-based HTML mode. This allows Web development process and supports manage- designers to work the way they want, rather ment of medium- to large-scale Web sites than adapting to the limitations and quirks of without significant performance penalties. the Web development tool. Another tool just to enter the market is Net Objects TeamFusion, which also offers check- Increasing Support for Plug-In Architecture: in/check-out facilities and allows creation of Customizable Web Development Toolkits Access Control Lists to prevent changes by Future Web pages will not be built by using unauthorized persons.

interactions...may + june 1998 29 Improved HTML Conversion Tools SIGCHI site. With the advent of CSS, the conversion tools ✤ Amy R. Fisher for forwarding the survey are likely to become “smarter” and more to the Chicago chapter of Webgrrls, Linda useful. User satisfaction is likely to increase Tausher for forwarding the survey to because the conversion tool can put the style WebWomen mailing list, Steven information separate from the main docu- Champeon for forwarding the survey to ment and keep only structural HTML tags Web Design mailing list, and JueyChong with the main document. Of course, success Ong for forwarding the survey to of such style sheet-based conversion will Worldwide Web Artists Consortium depend largely on how well (from the style (WWWAC) mailing list. sheet perspective) the original document was ✤ All 138 respondents for taking the time to constructed. If the original document was not respond to the survey and for providing created using style sheets, abundant and insightful comments. redundant HTML code may not be avoid- able. It is quite conceivable, however, to References create a “smart” conversion tool that identi- 1. Gardner-Bonneau, D. (1998). Personal fies the opportunities for using CSS where Communication. none exist. For example, the conversion tool 2. GVU. Graphics, Visualization, and Usability Center’s

PERMISSION TO MAKE DIGITAL OR can identify consistencies in formatting and 8th WWW User Survey. World Wide Web: HARD COPIES OF ALL OR PART OF THIS suggest the possibility of creating a style-sheet http:/www.cc.gatech.edu/gvu/user_surveys/, 1997. WORK FOR PERSONAL OR CLASSROOM based Web page. 3. Grose, E., Forsythe, C., and Ratner, J. In C. USE IS GRANTED WITHOUT FEE Forsythe, E. Grose, and J. Ratner (Eds.), Human Factors PROVIDED THAT COPIES ARE NOT

MADE OR DISTRIBUTED FOR PROFIT OR Future Web Surveys and Web Development. Lawrence Erlbaum Associates, COMMERCIAL ADVANTAGE AND THAT With the advent of new technologies, it Mahwah, NJ, 1998. COPIES BEAR THIS NOTICE AND THE will be useful to conduct a similar survey at 4. Hakhi, A. E. Content by committee – Development FULL CITATION ON THE FIRST PAGE.

TO COPY OTHERWISE, TO REPUBLISH, least once a year to track the changes in devel- tools help business units collaborate on Web develop- TO POST ON SERVERS OR TO REDIS- opment tools and understand the needs of ment. Information Week (January 12, 1998), Issue 664, TRIBUTE TO LISTS, REQUIRES PRIOR Web designers and how well they are sup- 67–68. SPECIFIC PERMISSION AND/OR A FEE. © ACM 1072-5220/98/0500 $5.00 ported with the then available Web develop- 5. Mosier, J. N., and Smith, S. L. Application of ment tools. Also, it may be useful to conduct Guidelines for Designing User Interface Software. more detailed and independent surveys on Behaviour and Information Technology 5, 1 (1986), 39–46. areas such as Web development environment, 6. Nielsen Media Research. Fall 1997 Internet accessibility, usability testing, publishing. Demographic Study from CommerceNet and Nielsen Media Research. World Wide Web: Acknowledgments http://www.nielsenmedia.com/interactive/com- I would like to thank the following people: mercenet/F97/, 1998. ✤ Kate Ehrlich and Michael Muller for 7. Nua. Nua Internet Surveys. World Wide Web: giving me an opportunity to conduct this http://www.nua.ie/surveys/, 1998. survey. 8. Trace Research and Development Center. Trace ✤ Kate Ehrlich, Michael Muller, Scott Research & Development Center: Making information Isensee, Valerie Stateson, and other technology more usable for everyone. World Wide Web: reviewers for providing useful feedback on http://www.trace.wisc.edu/. the earlier drafts of this article. 9. WAI (Web Accessibility Initiative). WAI Accessibility ✤ Georgia Tech Research Center and GVU Guidelines. Page Authoring. World Wide Web: Center for allowing me to use their ques- http://www.w3.org/TR/1998/WD-WAI-PAGEAUTH- tion on Web page types in the survey. 0203, 1998. ✤ Keith Instone for helping me put the Web 10. Wallop Build-IT. Wallop Software Home Page. World version of the survey at the ACM Wide Web: http://www.wallop.com/.

30 interactions...may + june 1998