WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Accessible flow charts or diagrams

for

From: Duff Johnson
Date: Sep 15, 2011 1:51PM


Thanks, Allen.

One clarification I should offer. As Karen McCall (my own personal fact-checker) pointed out to me offlist, many applications will output a single image to PDF for the entire chart instead of doing the job right with discrete text and graphics.

In such cases, PDF is no improvement over image + alt. text because there's only one object to tag.

Thanks for stating the conceptual objective in your preferred terms - I will mull on this for PDF 2.0.

Duff.

On Sep 15, 2011, at 2:16 PM, Hoffman, Allen wrote:

> I think you make valid points here.
> Conceptually for me as a screen reader user, I would like to be able to
> follow flow charts in an arrow fashion with each step having associated
> attributes. Kind of like navigating a table structure, but each cell
> contains content and attributes--such as condition and branch point
> options. I believe some kind of Excel spreadsheet could be created with
> this concept in mind, but PDF does lend itself to much of this thinking
> and would definitely lower the coding level for keeping visual
> appearance separated from the tagging portions. I have not seen
> successful examples of either of these methods to date, but feel either
> method may work for some situations if sufficient planning were done
> upfront. for org charts, a dropdown box with levels would also work.
>
>
>
>
>
> -----Original Message-----
> From: Duff Johnson [mailto: <EMAIL REMOVED> ]
> Sent: Thursday, September 15, 2011 11:49 AM
> To: WebAIM Discussion List
> Subject: Re: [WebAIM] Accessible flow charts or diagrams
>
> All,
>
> I'd like to offer a couple of thoughts on this question.
>
> 1) Organization and flow charts are often developed in authoring
> applications that do not output HTML/CSS/JavaScript, or that do so
> poorly.
>
> 2) As previously noted, in such cases, HTML-based implementations are
> limited to an image + alt. text, which is unsatisfactory for a WIDE
> variety of reasons, not the least of which is that alt. text is
> internally undifferentiated and is therefore un-navigable.
>
> One approach to this problem is to use (gasp!) PDF. Why?
>
> a) PDF can accommodate ANY chart, no matter the authoring software or
> content complexity, simply by virtue of printing the thing.
>
> b) PDF tags may be deployed to arbitrary levels of complexity
> irrespective of the content. It's possible, for example, to place an H4
> tag on each Job Title and follow it with a Paragraph tag for the
> job-holder. One could also choose to use heading levels to describe
> different levels in the organization, or combine headings and lists and
> table structures... or whatever.
>
> Essentially, PDF frees the document author to leverage the
> content-structuring facility of PDF tags on the "canvass" of an org
> chart (or other complex graphics) to produce (almost) any desired result
> from an AT point of view.
>
> There are other advantages...
>
> a) No need to reconcile HTML tagging (structural issues) with layout
> issues via exotic css / JavaScript / whatever.
>
> b) Printed and web-based charts are identical, with no compromise in
> the (print) design.
>
> Now... many would rather hurl than consider PDF as "web content".
> Nonetheless, this use-case has always struck me as an exception that
> even a HTML/CSS/JavaScript evangelist could accept. I'm curious to know
> if the above approach seems generically reasonable for charts and
> diagrams, or if you think I'm simply trying to bang a square peg into a
> round hole...
>
> Duff Johnson
>
> US Committee for ISO/DIS 14289 (PDF/UA), Chair
>
> p +1.617.283.4226
> e <EMAIL REMOVED>
> t http://www.twitter.com/duffjohnson
> w http://www.duff-johnson.com
>
>
>
> On Sep 14, 2011, at 11:44 PM, Ryan E. Benson wrote:
>
>> Giovanni,
>>
>> Nothing that I have seen makes fully accessible. I had to do this for
>> a project I was working on last week. The guidance i found was to
>> label each node as step 1, etc. then if you hit a decision node, such
>> as your end of first file, you decide one path and follow it to
>> completion, then the other. However after your decision node you say
>> if yes go to step xx, if no go to step yy. Your chart is kind of
>> tricky so you will have to be careful. For the alt attribute, I would
>> say something like "flow chart of how to calculate members dues". Then
>> since you can't rely on longdesc either a: put my description in plain
>> text under the image, or b: a link to a page with my desc. Of course
>> you can get fancy and hide it with CSS so only screen readers would
>> read it.
>>
>> --
>> Ryan E. Benson
>>
>>
>>
>> On Wed, Sep 14, 2011 at 8:03 PM, Giovanni Duarte < <EMAIL REMOVED> >
> wrote:
>>> Hi,
>>>
>>> I know I could provide an alternative text description to a flow
> chart but I
>>> would prefer to develop flow charts or diagrams that are already
> accessible.
>>> For example, to put math equations on the web, I could take a
> screenshot and
>>> then describe it, but it is better to use MathML. Have any of you
>>> implemented this? We develop many of these charts, flowcharts, or
> diagrams
>>> and I would like to find something that can make then accessible. I
>>> understand Microsoft Visio is somewhat accessible (or I could be
> wrong) but
>>> I need a web based solution.
>>>
>>> I know the example I am providing below is not accessible and I
> apologize
>>> for it.
>>>
>>>
>>>
>>> http://www.logiccoder.com/Images/ClubMembers02.jpg
>>>
>>>
>>>
>>> Thanks,
>>>
>>> Giovanni
>>>
>>>
>>>
>>>
>>>
>>>