2001 Conference Proceedings

Go to previous article 
Go to next article 
Return to 2001 Table of Contents


SMART FIGURES, SVG, AND ACCESSIBLE WEB GRAPHICS

John A. Gardner
E-mail: John.Gardner@orst.edu 

Vladimir Bulatov
bulatov@dots.physics.orst.edu 

Science Access Project
Department of Physics
Oregon State University
Corvallis, OR 97331-6507
http://dots.physics.orst.edu

Introduction

One of the last "frontiers of universal accessibility" is access by people with print disabilities to graphics. The WWW recommendation for making web graphics accessible is to include an ALT tag and, for complex graphics, a longer description that can be opened and read by people who cannot see or understand the information presented in the graphic. A description is hardly adequate access to such important graphical information as charts, flow diagrams, graphically-displayed data, maps, and illustrative diagrams used in virtually all scientific educational and professional literature. Indeed such graphics are excellent illustrations of the proverb that "a picture is worth a thousand words".

Tactile copies of graphical information have historically been used to provide access by blind people to graphics when word descriptions were inadequate. Until fairly recently, tactile graphics were laboriously created by hand. Consequently there was very little tactile information available to blind people. A tactile graphics overview was published several years ago by John Gardner describing both hand-creation and more modern methods for creating tactile graphics. The recent introduction of the Tiger Tactile Graphics Embosser, promise a vast improvement in access to tactile graphics. Tiger can print tactile copies of essentially anything that appears on a computer screen. Tactile images from computers can also be made using capsule papers as described in the overview linked above.

Some graphical information (e.g. color and shading of minerals, plants, and animals) is intrinsically visual and cannot easily be represented tactually. However most abstract information, represented by line and block graphics (e.g. maps, graphs, charts, and diagrams is generally representable, at least in principle, in a way that is quite accessible to blind people. Unfortunately, most abstract graphic information that is currently available in electronic form, including most World Wide Web graphics, are not really useful if just printed in tactile form. Images of typical text are not readable, and much fine detail is tactually unrecognizable. Typical figures contain a wealth of detail that is far less comprehensible to the fingers than to the eyes.

A technique pioneered by Dr. Donald Parkes. has proven to be very effective in providing blind readers access to complex graphical information. The blind reader uses a tactile graphic placed on a digitizing pad or some other device that can act as a computer mouse. It is attached to a computer that has a file of information about that figure and can run an application that gives access to this information file.

A user can feel the image and query the computer about objects. The object information can be spoken by a speech engine or be displayed on a computer braille display. A great deal of information can be provided if the computer brings up a text box and permits the user to browse the text in audio or braille before moving on to other objects. This technique permits blind readers to read fairly sophisticated and detailed tactile information that would be impossible to comprehend without the computer interaction. It also permits access by blind people who do not read braille.

We have previously explored several special methods by which information can be included with web graphics that permit specialized browsers to provide access to blind people, but all required special links on web pages to the "special" accessible information.

In the past we have discussed the desireability of new technologies for making "smart figures" with native ability to label and describe objects. We believe that such "hidden" information has enormous potential well beyond the narrow field of accessibility by people with print disabilities. However it has only become possible recently to use a mainstream graphics method that can make smart figures a reality. When Scalable Vector Graphics (SVG) became a W3C recommendation recently we recognized that SVG has all the capabilities needed to make mainstream smart graphics that are fully accessible to blind people. These smart figures should also provide greatly improved accessibility for many sighted people with print disabilities, e.g. dyslexia.

SVG Overview

SVG is an XML application. Unlike current web graphics SVG figures are coded in marked-up plain text and read by the client computer as a text file. As its name implies it is scalable and can contain a wealth of fine detail even when enlarged hundreds of times. SVG figures are displayed by a SVG viewer program downloadable at no charge. The most popular is the Adobe viewer. Although SVG is a very powerful language capable of use for dynamic display, we use SVG only as a tool for making smart static graphics.

SVG defines an image using a set of geometrical primitives, which are organized into a hierarchical tree of objects that can be almost arbitrarily complex. SVG is well suited for displaying technical drawings, diagrams, and other abstract informational graphics. SVG is not directly usable for photographic images, which are best represented by bitmaps. However photographs may be embedded into SVG documents.

Every SVG element may have two special sub-elements <title> and <desc> (description). These elements are optional and are not displayed by the graphics viewer. Their role is purely informational.

The Accessible SVG Viewer

We have created an alternative SVG viewer that permits users to access the hierarchical element tree of SVG graphics and the title and description fields for those elements. This Accessible SVG Viewer will be demonstrated in the presentation at the meeting. When complete, it will be downloadable at no cost and is recommended for users with severe print disabilities. It uses a combination of modern hardware and software to permit blind or dyslexic users very flexible access to the visual image as well as the underlying descriptive information.

Hardware components are:

The Accessible SVG viewer software is written in java version 1.2 with the following libraries/tools:

The Accessible SVG Viewer is a self voicing program. We initially attempted to use a general adaptive technology such as the self voicing Java kit from IBM. However, the general technologies do not work properly for this viewer, because they are intended to work with text in forms or dialogs only and they are not useful for voicing text that doesn't appear on screen.

The Accessible SVG Viewer's screen has two areas: a graphics area and element text based area for browsing the SVG image's element tree. A user can browse the list of graphical objects as a hierarchical list or tree similar to the windows explorer display. This display provides access to names of graphic elements and to their titles, descriptions, and all attributes.

Using the Accessible SVG Viewer

The Accessible SVG Viewer permits multi-modal access to the SVG graphics through visual, haptic, tactile, voice, and non-speech audio modes.

There are 3 modes for browsing the graphic image with the Wingman haptic mouse:

Haptic regime 1: feeling the whole picture

In this regime every object is represented as a small scratchy area in the center of the object. When the mouse pointer crosses an object's boundary, the object title is spoken. If the object has no title or description, a simple geometric description is automatically generated, e.g. circle, ellipse, rectangle, polygon, path, line.

Haptic regime 2: Locating a selected object

In this regime the WingMan mouse pulls the user's hand toward the center of a selected object. When the user selects another object from the SVG object list, the WingMan mouse pulls the user's hand toward the center of the other object.

Haptic regime 3: feeling the outline of a selected object.

An object's outline is displayed haptically as a wall , which pushes the user's hand inside the polygon that approximates the shape of the object. A scratchy texture is felt inside the outline. This feedback tells the user that the mouse pointer is inside the selected object.

In our opinion, haptic access is of relatively limited usefulness for detecting subtle details, particularly of small objects. A zoom feature permits users to magnify the haptic image up to the size of the full screen for better haptic resolution.

Access via tactile copy on digitizing pad

A tactile copy of the whole image or any selected portion may be created either by printing on the Tiger or by using a standard printer to create a tactile image with capsule paper. This tactile copy may then be placed on the Intuos Wacom Graphics tablet or other digitizing pad and calibrated by indicating two fiducial points. The screen image is adjusted so that the position of objects on the digitizing pad corresponds to the screen image.

The tactile image may be used in the normal fashion to permit a user to indicate an object and have its title and description displayed by the computer. In addition the haptic mouse may be put into a mode in which it follows the digitizing mouse position if desired. Finally, the position of an object selected from the SVG object list may be found through an audio tone indicator that directs the user's digitizing pen to the object position.

Making SVG Graphics that are accessible

Graphics files in SVG format are currently exported by many popular graphics authoring programs including CorelDraw and Adobe Illustrator. These exported SVG documents typically have no <title> or <desc> elements. These documents are not really accessible, but even without object labels they contain far more information than bit map graphics. A visually impaired user can determine the overall structure of the image and the shapes of individual objects. Text elements in the document may be read as well.

However, <title> and <desc> elements can greatly increase the document accessibility. We have created a SVG editor that permits one to add title and description to elements if they do not have them or to edit them if they do exist. The modified document file may be saved in place of the original file. It is visually indistinguishable from the original.

An SVG document will be most informative if the elements have a correct hierarchy. Certain kinds of authoring tools, such as graphing software, flow diagram generators, chart creation tools etc. could certainly export SVG documents with good hierarchical structure and even with some label and description information. However good SVG object hierarchy is not automatically generated by every authoring program. For example, a graphics authoring program being used to create a US map cannot know whether islands are states or parts of nearby states unless the grouping can be indicated during authoring. Consequently it will occasionally be desirable to re-order the hierarchical structure of SVG documents to organize objects into proper groups. For example, a graphics program might export a US map with Staten Island as an object equivalent to a state or even as a sub-object of New Jersey. The authoring tool we are creating permits one to make it a sub-object of New York.

Conclusions

Static graphics in the form of SVG documents are far more accessible to visually-impaired users than bit map graphics. Many current graphics authoring applications permit one to export the document in SVG format, so it is already easy to author such graphics. A simple static SVG document can be made very accessible if objects in the document element structure are properly organized and are titled and labeled. We are creating a SVG editor that can be used to edit the structure, object labels, and object descriptions of existing SVG documents. Consequently, static SVG graphics can be easily created to be fully accessible or can be easily edited later to improve accessibility. Agencies legally obligated to make information universally accessible finally have a very easy way to make accessible graphics for electronic documents or web sites.

The Accessible SVG Viewer permits blind and dyslexic users to utilize the document structure and view the title and descriptions of document objects. The current Viewer is accessible only in audio, but braille access is easily achievable once a stable braille api (application programmer interface) is defined and supported by braille display manufacturers.

Acknowledgements

This research was supported in part by the National Science Foundation.

References

Reference D. Parkes
"NOMAD": AN AUDIO-TACTILE TOOL FOR THE ACQUISITION, USE AND MANAGEMENT OF SPATIALLY DISTRIBUTED INFORMATION BY PARTIALLY SIGHTED AND BLIND PERSONS"
Editors. A. F. Tatham and A. G. Dodds
Proceedings of the Second International Symposium on Maps and Graphics for Visually Handicapped People
King's College, University of London, April 20-22 1988, pp. 24-29


Go to previous article 
Go to next article 
Return to 2001 Table of Contents 
Return to Table of Proceedings


Reprinted with author(s) permission. Author(s) retain copyright.