InnovationQ will be updated on Sunday, Oct. 22, from 10am ET - noon. You may experience brief service interruptions during that time.
Browse Prior Art Database

Improved accessibility of syntax diagrams using Scalable Vector graphics and the dotted decimal format

IP.com Disclosure Number: IPCOM000130427D
Original Publication Date: 2005-Oct-24
Included in the Prior Art Database: 2005-Oct-24
Document File: 4 page(s) / 109K

Publishing Venue



IBM(R) Information Development WorkBench's transform of syntax diagrams has an ASCII, monospace output for the HTML preview and a dotted decimal output for screen readers to read the structure of the diagram to the visually impaired. This solution improves the accessibility of syntax diagrams by using the dotted decimal format, but replaces the ASCII output with Scalable Vector Graphics which ameliorates the visual qualities of the diagram for both low vision and cognitive impaired users.

This text was extracted from a PDF file.
At least one non-text object (such as an image or picture) has been suppressed.
This is the abbreviated version, containing approximately 53% of the total text.

Page 1 of 4

Improved accessibility of syntax diagrams using Scalable Vector graphics and the dotted decimal format

Authoring syntax diagrams using Epic Editor

Epic Editor allows a user to create the structure of a syntax diagram through a series of tags sourced in either SGML or XML (based on DITA). Once the diagram's tagging is completed, documents are transformed: "When the syntax diagrams are transformed, the transform process generates a dotted decimal syntax diagram in a separate HTML file and adds two links before the syntax diagram. The screen reader reads the alt text of the first link, which allows the visually impaired reader to select the link. Once this link is selected, the screen reader program can read the dotted decimal syntax diagram." [1]

Here is an example of the output for both the sighted and visually impaired users.

Pros and cons of Epic Editor output of syntax diagrams

The dotted decimal format version of the syntax diagram is very helpful to the visually impaired. The ASCII text rendering of the same diagram (left part of the screen capture) has usability and accessibility problems for the sighted user. The "railroad" output is difficult to read. For cognitive impaired users with difficulties recognizing alphabetical characters (+ sign to show intersecting lines, "V" for arrowheads and directional lines), the ASCII output is a stumbling block for comprehending the content).

Solution: Disclosed is a solution for improving accessibility of syntax diagrams by combining the visual qualities of graphic application output and that of the Epic Editor's dotted decimal format output. In addition, instead of relying on a bitmap file format for the sighted user, Scalable Vector Graphics offers increased accessibility for cognitive and low vision impaired users. The solution calls for a combined SVG and dotted decimal format output.

This is an example of the zoom capabilities of SVG that will help low vision and cognitive


[This page contains 1 picture or other non-text object]

Page 2 of 4

impaired users:

   This is an example of a standard bitmap output of a syntax diagram while using Windows(R) built-in accessibility magnifier. The pixilatation of the image makes it difficult to recognize the characters' shape.

How can this be achieved?


[This page contains 3 pictures or other non-text objects]

Page 3 of 4

     1) Authors will use IDWB Epic Editor to source their document in XML (DITA) . Note: This solution does not work for the SGML (IBMIDDoc workflow). The authors will also use Epic Editor to create syntax diagrams. Epic Editor creates the syntax diagram using tags. Alt text tags can be added to the document to cue...