Re: syntax diagrams in CSS Media Queries Level 4

On Wed, 03 Feb 2016 22:31:38 +0100, Fred Esch <fesch@us.ibm.com> wrote:

> All,
>
> Media Queries Level 4 has 4 SVG diagrams. I would like us to provide  
> recommendations to the CSS WG >on how the SVG files should be handled  
> and provide text descriptions for them if appropriate.  Here are some  
> questions.

> Is some form of accessibility or label needed or is the surrounding text  
> enough?

In general the surrounding text explains what you need, but rather more  
verbosely.

> How should the SVG diagrams be made accessible?

About the same way as  
http://svg-access-w3cg.github.io/use-case-examples/rectrack2-notes.html

Links, highlighting, simple structure.

You could make the things where there are a set of options into a single  
group and describe it in one hit.

> Do you think these diagrams should be referred to as 'railroad diagrams'
> or 'syntax diagrams'?

I don't care. But it should be consistent throughout the document.

> Given the state of SVG accessibility I think they should wrap the SVG in  
> a HTML figure element and provide a HTML figcaption element for each.

I'd rather a longdesc. In many cases the content required is already  
somewhere, and you don't want to repeat it twice over.

> What are your opinions on how to provide accessibility to the diagrams?

What I said above.

> I have two proposals for captions for each diagram, provided below.   
> What do you all think would be appropriate (assuming you agree that a  
> caption is the way to go). Also note, in the suggested captions I use  
> the term syntax diagram - since they are talking about the syntax of CSS  
> media queries, whereas they use the term 'railroad diagram' in section 3.

I don't think caption is the way to explain everything, but the A is good  
enough for a caption with something like the B in longdesc.

cheers

> Sec 2. svg railroad diagram
> A. syntax diagram of media query described in this section.
> B. syntax diagram main route goes through a <em>media condition</em>  
> alternate route may have either an <em>only</em>, <em>not</em> or no  
> modifier and then goes through a  <em>media type</em> then route either  
> goes through an empty branch or a branch with <em>and</em> and an  
> <em>media condition</>em>
>
> Sec 2.1 svg railroad diagram
> A. syntax diagram of comma separated media query list.
> B. syntax diagram: main route goes through a <em>media query</em>,  
> alternate empty branch, alternate main route with a <em>comma</em> in a  
> loop
>
> Sec 2.4 svg railroad diagram
> A. syntax diagram showing three forms of media feature: a feature name  
> with a value, only a feature name or a range form.B. syntax diagram:  
> three routes available, route 1 has a <em>feature name</em> <em>:</em>  
> ><em>feature value</em>, route 2 has (only) a <em>feature name</em>,  
> route 3 has a <em>range form</em>
>
> Sec 2.4.3 svg railroad diagramA. syntax diagram showing range forms.  
> there are two range forms one has a pair of feature name/values  
> separated by one of the following operators (= < <= > >=). The second  
> form has a value operator feature name operator value. There are two  
> flavors of the second form one flavor uses either < or <= operators and  
> the other flavor use either > or >= operators.
> B. syntax diagram: three main routes, the first route goes through a  
> <em>feature name/value</em> >then it has a branch for each of the  
> operators <em>=</em> <em><</em> <em><=</em> <em>></em> <em>>=</>em> that  
> rejoin then goes through a second <em>feature name/value</em>. The  
> second route goes >through a <em>value</em> and branches for each  
> operator <em><</em> and <em><=</em> rejoining then ><em>feature  
> name</em> and branches for each operator <em><</em> and <em><=</em> and  
> rejoining for >the second <em>value</em>. The third route goes through a  
> <em>value</em> and branches for each >operator <em>></em> and  
> <em>>=</em> rejoining then <em>feature name</em> and branches for each  
> >operator <em>></em> and <em>>=</em> and rejoining for the second  
> <em>value</em>.
>
>
>
>>> Regards,
>
> Fred EschWatson, IBM, W3C Accessibility
>
> [IBM Watson] Watson Release Management and Quality

>
>
>



-- 
Charles McCathie Nevile - web standards - CTO Office, Yandex
    chaals@yandex-team.ru - - - Find more at http://yandex.com

Received on Thursday, 4 February 2016 01:52:08 UTC