RE: semantic level of SVG usage

Is there any examples of accessible diagrams using SVG? As I find this difficult to understand how the final product will be accessible to a screen reader user who cannot see the screen. Described diagrams are something that someone has to interpret and then explain in a way the end-user can understand. Look at any network l2 or l3 topology diagram, programming logic flow chart, work flow complex flow chart, etc which has multiple paths and exit/entry points. Very quickly the diagram becomes difficult to understand from a blind persons point of view if the diagram hasn't been carefully transcribed.

Bar charts, Pye charts and simular charts from Excel showing data  is far easier to be made accessible. 

So is there any examples of complex SBG diagrams that I could see using the SVG concepts discussed here?

Sean Murphy
Accessibility Software engineer 
seanmmur@cisco.com
Tel: +61 2 8446 7751 Cisco Systems, Inc.
The Forum 201 Pacific Highway
ST LEONARDS
2065
Australia
cisco.com 
 
 Think before you print.
This email may contain confidential and privileged material for the sole use of the intended recipient. Any review, use, distribution or disclosure by others is strictly prohibited. If you are not the intended recipient (or authorized to receive for the recipient), please contact the sender by reply email and delete all copies of this message.


-----Original Message-----
From: Rich Morin [mailto:rdm@cfcl.com] 
Sent: Thursday, 18 August 2016 2:21 AM
To: w3c-wai-ig@w3.org
Cc: www-svg <www-svg@w3.org>
Subject: semantic level of SVG usage

Although I like the idea of adding ARIA metadata to SVG, I'm concerned that its effectiveness may be extremely limited by the semantic level of SVG tags and their typical usage.

# Motivation

Consider a data flow diagram, as produced by OmniGraffle. The building blocks of the diagram are geometric shapes and arrows, but this level of abstraction is largely absent from the SVG.  Instead, it uses either a filled `path` or a pair of `rect` elements.

And, although the semantic payload of the diagram is largely concerned with connectivity, the SVG contains no information on this.  The only way I can see to get connectivity information is to compare locations of line endpoints with the (fuzzy) boundaries of geometric shapes.

I have similar concerns about other kinds of plots and diagrams.  For example, the semantic payload of a pie chart or a histogram has to do with the numeric quantities being represented, not with the angles or heights used in the generated image.

The SVG images produced by D3.js are even more problematic, using tags which have only a distant relationship to the semantic payload:

  https://github.com/d3/d3/wiki/gallery

  http://bl.ocks.org/mbostock


In summary, adding attributes to SVG tags may not be enough to make the resulting image particularly accessible.

# Proposal

By combining SVG attributes (e.g., object identity) with a separate section of the XML document, it would be possible to add arbitrary semantic information to the image.  For example, the added section could describe graph connectivity, encode raw data for plots, etc.

This could support a variety of post-processing needs, ranging from accessibility to machine learning.  And, because the added section wouldn't be part of the base SVG, programs could simply ignore it.

Comments and suggestions welcome.

-r

P.S.  Amanda Lacy, Johannes Rössel, and Gene Dronek contributed
      valuable information and insights to this note, but they
      are not responsible for my conclusions.

-- 
http://www.cfcl.com/rdm           Rich Morin           rdm@cfcl.com
http://www.cfcl.com/rdm/resume    San Bruno, CA, USA   +1 650-873-7841

Software system design, development, and documentation

Received on Thursday, 18 August 2016 05:24:38 UTC