Re: About aria-expanded example on Wiki page

James,
Yes I am aware and I had seen that note and my intent is primarily to flag the issue for attention of those on the WG / editing the page / technique.
Sailesh


--------------------------------------------
On Mon, 7/8/13, James Nurthen <james.nurthen@oracle.com> wrote:

 Subject: Re: About aria-expanded example on Wiki page
 To: "Sailesh Panchang" <spanchang02@yahoo.com>, "Protocols and Formats Working Group WG" <w3c-wai-pf@w3.org>, "WCAG" <w3c-wai-gl@w3.org>
 Date: Monday, July 8, 2013, 7:12 PM
 
 
   
     
   
   
     Sailesh,
 
       These pages are all works in progress as noted at the
 top of the
       page "This Wiki page is
 edited by
         participants of the WCAG Working Group. It does not
 necessarily
         represent consensus and it may have incorrect
 information or
         information that is not supported by other Working
 Group
         participants, WAI, or W3C. It may also have some
 very useful
         information."
 
         
 
        I'll make sure the comments get addressed
 before these are
       submitted for review by the WCAG working group. So
 they don't get
       forgotten I have added them to the wiki discussion
 page.
 
       regards,
 
       James
 
       
 
       On 7/7/2013 3:44 AM, Sailesh Panchang wrote:
 
     
     
       Refer to Example 1: Using a button to collapse
 and expand a region on the Wiki page[1]
  The description states,
 "... aria-expanded state indicates whether the subtree 
 can be expanded or collapsed, as well as whether or not it
 is currently expanded or collapsed." 
 This supposedly means the subtree is a UI element that can
 be expanded/collapsed.
 However in example 1, aria-expanded is used on the element
 with role=region and not on the button element.
 The latter is the UI element whose  show/hide functionality
 as well as current state is exposed by the text toggeled
 within the SPAN and not by aria-expanded.  
 The visual rendering of the element with role=region is
 toggled by CSS 'display' property and  setting
 aria-expanded on it does not seem to accomplish much. 
 When it is rendered, it is there for all to perceive.
 Most of all, as it is not a UI element the state does not
 get exposed at all. 
 Even if it did get exposed, it will get exposed only in
 expanded state; in collapsed state it has display:none!
 However, on the other hand if  aria-expanded is set on the
 button element , it will accomplish what is described in the
 technique's objective on the Wiki page: it will convey
 that the button has hide/show functionality as well as its
 current state.
 The SPAN with show/hide may be unnecessary. An HTML (or CSS)
 image may be used to reinforce the functionality visually.
 That aria-expanded and aria-controls are to be used on the
 same element is the interpretation of another accessibility
 practitioner too: 
 Easy ARIA tip #5: Marco’s accessibility blog[2]  
 Finally, is it right to toggle CSS display (or aria-expanded
 for that matter)  on an element with role=region?
 An element with role=region is meant to be a perceivable
 section of the Web page (as per its definition).
 In the example#1 on the Wiki page, the element with
 role=region has no heading i.e. accessible name. 
 
 I appreciate your clarifications / explanations.
 
 Thanks,
 Sailesh Panchang
 www.deque.com
 
 [1] http://www.w3.org/WAI/GL/wiki/Using_the_WAI-ARIA_aria-expanded_state_to_mark_expandable_and_collapsible_regions
 [2] http://www.marcozehe.de/2010/02/10/easy-aria-tip-5-aria-expanded-and-aria-controls/

Received on Tuesday, 9 July 2013 01:42:17 UTC