BOBBY: An Online Tool for Web Site Designers

Citation

Chaiken, J. and Johnson, D. (2000), "BOBBY: An Online Tool for Web Site Designers", Library Hi Tech News, Vol. 17 No. 2. https://doi.org/10.1108/lhtn.2000.23917bad.001

BOBBY: An Online Tool for Web Site Designers

David Johnson, Column Editor

BOBBY: An Online Tool for Web Site Designers

Jessica Chaiken, Guest Columnist

[Ed.: "EASI Access to Library Technology," a regular feature of Library Hi Tech News, examines new technology, information sources and services, and other news of interest to librarians concerned with providing quality services to their patrons with disabilities. EASI (Equal Access to Software and Information), in affiliation with the American Association of Higher Education (AAHE), is concerned with new and emerging technologies for computer users with disabilities.]

Introduction

Bobby was created by CAST (the Center for Applied Special Technology) as an accessibility tool for Web designers that, quoting CAST's Web site, would be "[a] helpful detective ­ a Web-based entity that would expose barriers, encourage compliance with existing guidelines and teach Web masters about accessibility." Bobby (http://www.cast.org/bobby) offers Web page designers a yardstick against which to measure their sites. Visitors to Bobby are invited to enter an address to a Web page, which Bobby then analyzes, providing such useful information as how long the page took to download, whether it would work in each of several browsers (including AOL and WebTV), and what parts of the code were inaccessible and why. Bobby also offers remedies for any problems that it finds. Pages that meet all of CAST's accessibility requirements garner a "Bobby Approved" rating (see Figure 1).

Figure 1 "Bobby Approved" icon

The latest edition of Bobby, version 3.1.1, analyzes accessibility based on the guidelines developed by the Web Accessibility Initiative (WAI) of the World Wide Web Consortium, along with browser and HTML 4.0 compatibility. According to Bobby's site, in order for a page to be "Bobby Approved" it must:

• •

  provide text equivalents for all non-text elements (i.e. images, animation, audio, video);

• •

  provide summaries of graphs and charts;

• •

  ensure that all information conveyed with color is also available without color;

• •

  clearly identify changes in the natural language of a document's text and any text equivalents (e.g. captions) of non-text content;

• •

  organize content logically and clearly provide alternative content for features (e.g. applets or plug-ins) that may not be supported.

Using Bobby is fairly simple. The pages to be tested must be posted to a Web server. The developer enters the address in one blank on Bobby's page and clicks the "Submit" button. The tested page appears with a Bobby header and several icons indicating potential problems (see Figure 2). Items at issue are indicated with a small blue helmet (the kind worn by British police, or Bobbies). Accessibility problems are marked with a helmet with a wheelchair. HTML or browser problems are marked with a plain helmet. Each helmet is a link to the problem description and its solution. Analysis of the page begins after the end of the original coding (the bottom of the analyzed page). Errors are listed under the headings "accessibility priorities," "browser compatibility errors," and "download time." Each error is described, including error type, location, and actual code, with a link to the solution.

Figure 2 NARIC's Did You Know ...? page, as analyzed by Web-based Bobby

Accessibility errors are listed in three levels of priority ­ required, recommended, and suggested ­ following WAI's definitions of accessibility. Priority 1 errors are ones that seriously limit a page's accessibility. Every effort must be made to repair these errors to ensure accessibility. For example, all images should include alternative text within the <img src> tag: <img src = "corporatelogo.gif" alt="XYZ International, Inc."> The information conveyed in the logo is thus also conveyed in text. For another example, tables must include column and row headers, since screen reader programs read text linearly across the screen. Without the text-appropriate codes, it may be impossible for blind users to understand the table.

Priority 2 errors should be repaired by the developer in order to remove barriers to accessibility. For example, colors should be chosen so that the contrast between text and its background is easy for people with low vision to recognize, and information is not obscured. WAI recommends using Cascading Style Sheets (CSS) to format pages as a second-level priority. CSS allows designers to create Web pages with a desktop publishing feel. Specific codes are used to add fonts and colors to page elements, manipulate margins and page layout, and layer images and text. It even lets the designer specify a voice for screen readers. However, as the technology has yet to catch up to the code, use of CSS is not a requirement.

Priority 3 errors are ones that should at least be noted by developers. Complying with them will improve access overall. They include specifying an abbreviation or acronym and its definition, e.g. <ACRONYM TITLE = "National Rehabilitation Information Center">NARIC</ACRONYM>

In short, following WAI's definitions, Priority 1 errors must be repaired to guarantee accessibility since they seriously affect a page's accessibility; Priority 2 errors should be repaired since they may make access difficult for some users; and Priority 3 errors should at least be examined by developers. Additional resources on accessibility and page design, including a business card-sized tip sheet, are available from the WAI at http://www.w3c.org/wai

How Bobby Works

Bobby can be used either online or in a downloaded version. With the downloadable version you can try different formats and make repairs without maintaining an Internet connection. Bobby is easy to download (http://www.cast.org/bobby/download.cfm) and installation is simple. The downloaded program is written in Java so it will run on multiple platforms (Windows, Unix, Generic OS). The downloaded installation file is about 6.5 megabytes and includes a Java imaging program. It also includes two non-standard browsers, neither of which is very efficient but which does give the designer a way to see their pages in other formats.

The downloaded version allows the user to change many of its settings. Within the Preferences menu, the user can choose in which browser to display reports (one of the included programs or a standard browser). Some pages are written to deliver specific information based on the visitor's browser. Bobby can be set to identify itself as one of several versions of Netscape, Explorer, Lynx, and America Online. Pages can then be viewed and tested as they would for those programs. Users can also set Bobby to calculate download times and designate a proxy server for pages set behind a firewall security system.

Bobby also lets the user test varying levels of accessibility. On the main screen a button for "Settings" opens a screen for selecting which browser and HTML formats will be tested. Bobby will test for accessibility and compatibility errors for each browser selected, as if the page was viewed within each browser. Choosing "Bobby Approved" accessibility rating from the analysis settings automatically selects Netscape 3.2 and 4.0, Internet Explorer 4.0, and Lynx 2.7. Other settings include AOL, WebTV, and Opera, in addition to older versions of HTML.

With the downloaded version, an entire site can be analyzed in one go: not just a page or two, but every page on the site. The user can tell the program to follow the links on a page and test those pages, too, to an infinite level. The user can also specify which links to follow: just within the domain (naric.com), only those in the same folder (naric.com/pd), outside the domain, or none at all.

The generated report is easy to read (see Figure 3). A table displays each followed link, lists approved status, and ticks off priority and browser errors. Individual page reports can be generated as well. Simply select the link and click the Report button. The generated report is similar to that generated by the Web version and appears in the browser. Individual errors are marked with the helmet icon; each error is explained and linked to the recommended solutions. Bobby can also calculate download times for each page. This gives the designer an idea of how long it takes to access their page using a relatively slow connection.

Figure 3 NARIC's Web site as analyzed by Bobby 3.1.1

Using Bobby to Redesign NARIC's Web Pages

The National Rehabilitation Information Center (NARIC) is a federally-funded library focusing on disability and rehabilitation research. The REHABDATA database, recognized as a leading resource in disability and rehabilitation research, abstracts the library's collection of more than 53,000 documents. NARIC's Web site provides 24-hour, free access to REHABDATA and four other related databases. In April 1998, NARIC's Web site underwent a complete redesign, and Bobby was used to aid in the redesign.

NARIC's first foray on to the Web in 1995 consisted of static pages, hand-coded in HTML by a single staff member. Pages included few images and no interactivity. Visitors could access the Program Directory and Compendium published by NARIC for the National Institute on Disability and Rehabilitation Research (NIDRR), NARIC's publications list, a quarterly newsletter, information on NARIC's services, and a very few links to similar resources. At that time, the key accessibility issue was whether anyone could access the Web site from any browser: Mosaic, Netscape, or text-based Lynx?

By early 1998 the Web site had grown exponentially to contain several editions of the Directory and Compendium, a searchable version of REHABDATA hosted by InMagic, small graphics, and an extensive bookmark collection. At this time, accessibility had become an important issue: We wanted NARIC's site to be accessible by anyone, regardless of ability, browser, or connection speed.

Testing with Bobby online flagged several important accessibility issues. In addition to providing text alternatives for images and avoiding tables, we added consistent navigation and standardized our page design. Navigation aids included links separated by new lines and a way to indicate the visitor's location within the site (italicizing the current page within the menu). Our site then received a 4-star rating from Bobby (the star rating system was later dropped in favor of an overall approved rating).

When NARIC redesigned its site in 1998, we made extensive use of the latest, downloadable, version of Bobby. Using the downloadable version allowed us to test and repair pages without posting them to a remote server, shortening a time-consuming process. We had created a design, on paper, that was appealing and visually simple. We worked backwards from there, creating an HTML document to mimic the paper. Bobby proved invaluable in the redesign, pointing out barriers and errors with easy to follow remedies. These included labels for form elements and text-based menus for image maps.

NARIC's site continues to grow. We still use Bobby to analyze new designs and deal with new problems. When InMagic issued an upgrade of its Web-based database software, we ran into a particular problem: Javascript. InMagic's WebPublisher makes extensive use of Javascript to set up query and report screens. When we unveiled the new databases and report formats, Bobby flagged the pages as inaccessible because of the Javascript. It was necessary to add <noscript> </noscript> tags for those browsers that do not recognize Javascript, and insert the necessary database codes within the tags. After rewriting several reports and query screens, we regained our "Bobby Approved" status. One item that cannot be accommodated: Within the report formats, InMagic places their corporate logo without alternative text. It is not possible for us to alter that part of the program.

Bobby's Value

Why work so hard to please a little program? Isn't it just another icon? No. Absolutely not. Seeing the "Bobby Approved" icon on a page tells the visitor that the designer has taken the time to accommodate their entire audience to the best of their and the technology's abilities. Accessible Web page design is not just a good idea. It's the law! Section 508 of the Workforce Investment Act of 1998 requires Federal departments and agencies, as well as private companies doing business with the Federal Government, to ensure:

"... individuals with disabilities who are Federal employees to have access to and use of information and data that is comparable to the access to and use of the information and data by Federal employees who are not individuals with disabilities; and"

"individuals with disabilities who are members of the public seeking information or services from a Federal department or agency to have access to and use of information and data that is comparable to the access to and use of the information and data by such members of the public who are not individuals with disabilities[1]."

When these provisions were announced, they caused a loud debate in several forums. Web masters and designers complained that it would be impossible to keep up, the cost to retrofit sites would be too high, and the slickest sites could not be made accessible. Designers want their pages to be as cool, slick, or funky as possible, and they didn't want the government stopping them. But the truth is that it is easy to add accessibility to even the coolest pages. And accessibility means that everyone can get to, appreciate, and use the information.

Note

1. Workforce Investment Act of 1998, Sec. 508. Electronic and Information Technology. PL 105-220, 1998 HR 1385. http://www.usdoj.gov/crt/508/508law.html

Jessica Chaiken is Media Specialist for the National Rehabilitation Information Center (NARIC). She may be reached at (800) 346-2742, ext. 404, or at jchaiken@kra.com

David Johnson is Abstractor/Information Specialist for the National Rehabilitation Information Center (NARIC). Readers with questions, comments, or suggestions may reach him at (800) 346-2742, ext. 406, or at djohnson@kra.com