aria-label and g:datePicker

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
3 messages Options
Reply | Threaded
Open this post in threaded view
|

aria-label and g:datePicker

Jeff Scott Brown-3
See https://jira.grails.org/browse/GRAILS-11655.

What is the most reasonable default behavior and what should be configurable?

Thanks for any feedback.



JSB

--  
Jeff Scott Brown  
[hidden email]

Find The Cause ~ Find The Cure  
http://www.autismspeaks.org/

--
You received this message because you are subscribed to the Google Groups "Grails Dev Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/grails-dev-discuss/etPan.53ebbfe7.6b8b4567.38da%40JSB-MBP-August-2012.local.
For more options, visit https://groups.google.com/d/optout.
Reply | Threaded
Open this post in threaded view
|

Re: aria-label and g:datePicker

pledbrook
> See https://jira.grails.org/browse/GRAILS-11655.
>
> What is the most reasonable default behavior and what should be configurable?

After a quick look at Mozilla Developer Network docs:

    https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute

I think each select should at least have an

    aria-labelledby="<label ID>"

attribute. Assuming that <g:datePicker> actually creates a <label>
element, that is. If not, then it's the responsibility of the user to
explicitly add aria-label or aria-labelledby attributes. In that case,
the scaffolding should probably add aria-labelledby itself.

The downside to this is that you don't get a different label for each
drop down. I think the most complete solution is to merge
user-provided aria-labelledby attributes with individual values for
each drop down. The resulting HTML would look something like this:

    <label id="dob-label" for="...">Date of Birth</label>
    <input id="dob-day-label" type="hidden" value="day"/>
    <select ... aria-labelledby="dob-day-label dob-label">...</select>
    <input id="dob-month-label" type="hidden" value="day"/>
    <select ... aria-labelledby="dob-month-label dob-label">...</select>
    <input id="dob-year-label" type="hidden" value="day"/>
    <select ... aria-labelledby="dob-year-label dob-label">...</select>

The approach adds some extra elements and IDs, which isn't ideal, but
it should result in a sensible label for each drop down.

Suggested approach should be validated by someone with ARIA and
assistive technology experience though!

Peter

--
Peter Ledbrook
t: @pledbrook
w: http://www.cacoethes.co.uk/

--
You received this message because you are subscribed to the Google Groups "Grails Dev Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/grails-dev-discuss/CANBeYQSnAc4BeJJ6H_WCXmXHXagAR4rCk9gJyaBALcNS92yVJQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.
Reply | Threaded
Open this post in threaded view
|

Re: aria-label and g:datePicker

pledbrook
>     <label id="dob-label" for="...">Date of Birth</label>
>     <input id="dob-day-label" type="hidden" value="day"/>
>     <select ... aria-labelledby="dob-day-label dob-label">...</select>
>     <input id="dob-month-label" type="hidden" value="day"/>
>     <select ... aria-labelledby="dob-month-label dob-label">...</select>
>     <input id="dob-year-label" type="hidden" value="day"/>
>     <select ... aria-labelledby="dob-year-label dob-label">...</select>

The idea with this example is to end up with labels that read:

    Date of Birth day
    Date of Birth month
    Date of Birth year

Peter

--
Peter Ledbrook
t: @pledbrook
w: http://www.cacoethes.co.uk/

--
You received this message because you are subscribed to the Google Groups "Grails Dev Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/grails-dev-discuss/CANBeYQTRPiBYxA79p3VFUU6_uxOtfmjG4c%2B-i%3DdO8yvrS6VvaQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.