音声ブラウザご使用の方向け: SKIP NAVI GOTO NAVI

Web Posted on: November 20, 1998


Increasing the Accessibility of the Web through style sheets, scripts, and "plug-ins"

Wendy Chisholm
chisholm@trace.wisc.edu

Mark Novak
novak@trace.wisc.edu


Trace R&D Center
5901 Research Park Blvd.
Madison, WI 53719

Abstract

The W3C WAI Page Authoring Guidelines (Vanderheiden, et al, 1998a) contains nineteen general concepts that Web page authors should follow to make their pages more accessible and usable, not only to people with disabilities, but for newer page viewing technologies (mobile and voice), for electronic agents such as indexing robots, and etc. In an accompanying document, Techniques for "W3C WAI Page Authoring" (Vanderheiden, et al, 1998b), each of the Page Authoring Guidelines are further explained, with one or more techniques that may be used to satisfy the guideline.

In this paper/presentation, we will talk about and demonstrate how scripts and style sheets can be implemented today, and still work on systems that do not support scripts and style sheets ("Transform gracefully"). We also talk about and demonstrate how the data in a table can be presented and navigated both via scripting and by an accompanying application ("Context and navigation").


Introduction

The W3C WAI Page Authoring Guidelines demonstrate that there are three basic concepts to create accessible Web sites:

  • Make sure pages transform gracefully across users, techniques, and situations.
  • Provide context and orientation information for complex pages or elements.
  • Maximize usability by following good design practices.

The document stresses that "Accessibility does not mean minimal page design, it means thoughtful page design (Vanderheiden, et al, 1998a)." Therefore, newer technologies such as scripts and style sheets should not be avoided, but designed and used with care. In this paper/presentation, we will show how scripts and style sheets can be used to increase the accessibility of a page. We will also show how marking up a table according to the HTML 4.0 specification will allow other programs and eventually browsers, to restructure the data in a table to allow a user to understand and navigate the table via speech, the keyboard, etc.

Note. We use many acronyms in this paper. Fear not, they are defined at the end.


Ensuring that scripts transform gracefully

In the WAI Page Authoring Guidelines, under the first category "A. Make sure pages transform gracefully across users, techniques, and situations," the ninth guideline states: "

A.9 Ensure that pages using newer W3C features (technologies) will transform gracefully into an accessible form if the feature is not supported or is turned off.
Some more recent features that are not completely backwards compatible include frames, scripts, style sheets, and applets. Each release of HTML has included new language features. For example, HTML 4.0 added the ability to attach style sheets to a page and to embed scripts and applets into a page.
Older browsers ignore new features and some users configure their browser not to make use of new features. These users often see nothing more than a blank page or an unusable page when new features do not transform gracefully. For example, if you "B. Provide context and orientation information for complex pages or elements," the third guideline states:


B.3 Ensure that tables (not used for layout) have necessary markup to be properly restructured or presented by accessible browsers and other user agents. Many user agents restructure tables to present them. Without appropriate markup, the tables will not make sense when restructured. Tables also present special problems to users of screen readers. These guidelines benefit users that are accessing the table through auditory means (e.g., an Automobile PC which operates by speech input and output) or viewing only a portion of the page at a time (e.g., users with blindness or low vision using speech or a braille display, or other users of devices with small displays, etc.).

Techniques:
  • Provide summaries for tables (via the "summary" attribute on TABLE). [Priority 3]
  • Identify headers for rows and columns (TD and TH). [Priority 2]
  • Where tables have structural divisions beyond those implicit in the rows and columns, use appropriate markup to identify those divisions (THEAD, TFOOT, TBODY, COLGROUP, the "axis" and "scope" attributes, etc.). [Priority 2]
  • Provide abbreviations for header labels (via the "abbr" attribute on TH). [Priority 3]
The following current interim technique is discussed in guideline A.12. ("Use interim accessibility solutions so that assistive technologies and older browsers will operate correctly."): 5.Until user agents and screen readers are able to handle text presented side-by-side, all tables that lay out text in parallel, word-wrapped columns require a linear text alternative (on the current page or some other). [Priority 2]

Scripts to navigate tables

We looked at solving "the table problem" using a client side JavaScript. Our approach was to:

  • experiment with JavaScript to determine what information was available within the TABLE element of HTML 4, the DOM, and the event model of Microsoft Internet Explorer 4.0;
  • if possible, collect all this information into a structure or format that maintained the row/column header integrity;
  • and, allow navigation within this structure while providing individual cell data information to the user.

To associate row/column header information with each data cell, we used an approach recommended in the HTML 4.0 specification (Raggett, et al, 1998). Essentially the steps in pseudo code would be as follows:

  • from a given data cell, iterate left until a row header is found
  • from a given data cell, iterate up until a column header is found
  • in both cases, stop if the edge of the table is reached -or- if another data cell is encountered after a header cell.

Note, even though additional Table information is sometimes available in the HTML 4.0 standard (e.g., headers attribute, axis attribute, etc.), this information was collected but not used for our experimental scripts.


Use of a separate plug-in or executable program to navigate tables

Our next approach was to use the extended object model exposed by IE 4, and access a Web page using a combination of C++ and COM via an executable program.

Advantages to this approach:

  • not limited to running within a Web page
  • not limited to running within a particular internet domain (security)
  • access to keyboard and mouse information ahead of the browser if needed
  • access to additional System resources (file system, hardware ports, display, etc.) if needed

Since the introduction of IE 3, Microsoft has supported a component architecture that allows increasing levels of access and control over their browser from an external application. Using COM, an external application can attach to IE and perform a variety of tasks, such as limiting the internet addresses one can access, or provide an audio indication when a page has completed loaded. Using COM also allows an external application to access the DOM and the event model of IE, and therefore access and possibly control all the elements of a Web page.

Our approach was to develop an application that would again look to address the problems encountered by individuals with a visual disability when they try to navigate and understand data tables on a Web page. The application developed used the same structure as tried when experimenting with tables using JavaScript. In addition, we were also able to collect header and anchor/link information.


Terminology and Technologies used in this presentation

Cascading Style Sheets (CSS)
A set of rules describing how a page ought to be presented (bold/italic, color, alignment, etc.)

Document Object Model (DOM)
Object models are sometimes described as the "manual" for how to use objects.

Dynamic HTML (DHTML)
A suite of technologies that allow a Web developer access to all the elements on a Web page. DHTML would encompass DOM, CSS including the ability to position elements, and the event model exposed in the browser.

Hypertext Markup Language (HTML)
The predominant language used to create World Wide Web pages. In the most recent release, HTML 4.0, several accessibility features were added.

Java
For our purposes, an object-oriented programming language. Programs written in Java are compiled into byte-code, and then must run inside a Java Virtual Machine (JVM). Most of the newer browser versions include a JVM, as do some operating systems.

JavaScript
For our purposes, is a scripting language, whose development and syntax have been influenced by object based technology. JavaScript is also an interpreted language, meaning it is not run through a compiler. There are two places you might find JavaScript, but we are only going to be talking about client-side JavaScript.:

  • client-side - for example, scripts run from within a browser
  • server-side - scripts which execute on the server end

Microsoft's Component Object Model (COM)
A software architecture that allows applications to be built from components. COM defines both a standard way to organize functions within a software component and a standard way to call these functions, which allows componets written using various programming languages to inter-operate.

Microsoft Internet Explorer (IE)
A Web browser.

Web Access Initiative (WAI)
An initiative that works with W3C working groups to resolve and prevent accessibility issues within W3C specifications and technologies.

World Wide Web Consortium (W3C)
An international industry consortium that maintains a repository of information about the World Wide Web, creates implementations to embody and promote standards, and provides other demonstrations of new technology.


References

* Flanagan, David. (1998) JavaScript, The Definitive Guide Third Edition. O'Reilly & Associates, Inc., 101 Morris Street, Sebastopol, CA 95472

* Microsoft (1998) The Component Object Model: Technical Overview. Available: http://www.microsoft.com/com/wpaper/Com_modl.asp

* Raggett, Dave; Le Hors, Arnoud; Jacobs, Ian. (1998) HTML 4.0 Specification. Available: http://www.w3.org/TR/REC-html40/

* Vanderheiden, Gregg C.; Chisholm, Wendy A.; Jacobs, Ian. (1998a) WAI Accessibility Guidelines: Page Authoring. Available: http://www.w3.org/WAI/GL/WD-WAI-PAGEAUTH.html

* Vanderheiden, Gregg C.; Chisholm, Wendy A.; Jacobs, Ian. (1998b) Techniques for "WAI Guidelines: Page Authoring". Available: http://www.w3.org/WAI/GL/wai-gl-techniques.html

* WebReview. (1998) The Company. Available: http://www.webreview.com