E-mail List Archives
Thread: Intro to Advanced Accessible Rich Internet Applications (ARIA)
Number of posts in this thread: 8 (In chronological order)
From: Joseph Sherman
Date: Wed, May 10 2017 7:35AM
Subject: Intro to Advanced Accessible Rich Internet Applications (ARIA)
No previous message | Next message →
Hi all. This is the first post in an Advanced ARIA series<https://www.deque.com/blog/advanced-aria/>. This series will explain how to create accessible widgets and structures using ARIA, with practical tips and real working examples. There's also information at our accessibility site<http://www2.cuny.edu/accessibility/content/websites/#resources>; under 'additional resources-.
Remember the First rule of ARIA use🔗<https://www.w3.org/TR/using-aria/#firstrule>
If you can use a native HTML element [HTML51<https://www.w3.org/TR/using-aria/#bib-HTML51>] or attribute with the semantics and behavior you require already built in, instead of re-purposing an element and adding an ARIA role, state, or property to make it accessible, then do so.
Joseph Sherman
Accessibility Specialist
CUNY Computing & Information Services
395 Hudson St 6FL, 6-236
646-664-2167| = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
From: Jared Smith
Date: Wed, May 10 2017 11:02AM
Subject: Re: Intro to Advanced Accessible Rich Internet Applications (ARIA)
← Previous message | Next message →
Joseph Sherman wrote:
> Hi all. This is the first post in an Advanced ARIA series<https://www.deque.com/blog/advanced-aria/>.
...
> Remember the First rule of ARIA use <https://www.w3.org/TR/using-aria/#firstrule>
It's interesting that every example in the Advanced ARIA series
(links, buttons, headings, lists, and radio buttons) is using ARIA to
do things that readily-available HTML can do.
Jared
From: Joseph Sherman
Date: Wed, May 10 2017 11:04AM
Subject: Re: Intro to Advanced Accessible Rich Internet Applications (ARIA)
← Previous message | Next message →
Oops. I sent this to the wrong list-serv. We have an internal Web Developer list-serv I meant to inform.
Sorry.
Joseph
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf
> Of Jared Smith
> Sent: Wednesday, May 10, 2017 1:02 PM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] Intro to Advanced Accessible Rich Internet Applications
> (ARIA)
>
> Joseph Sherman wrote:
>
> > Hi all. This is the first post in an Advanced ARIA
> series<https://www.deque.com/blog/advanced-aria/>.
> ...
> > Remember the First rule of ARIA use
> > <https://www.w3.org/TR/using-aria/#firstrule>
>
> It's interesting that every example in the Advanced ARIA series (links, buttons,
> headings, lists, and radio buttons) is using ARIA to do things that readily-available
> HTML can do.
>
> Jared
> > > http://webaim.org/discussion/archives
>
From: Birkir R. Gunnarsson
Date: Wed, May 10 2017 11:15AM
Subject: Re: Intro to Advanced Accessible Rich Internet Applications (ARIA)
← Previous message | Next message →
That section should be called "well, if you insist".
On 5/10/17, Joseph Sherman < = EMAIL ADDRESS REMOVED = > wrote:
> Oops. I sent this to the wrong list-serv. We have an internal Web Developer
> list-serv I meant to inform.
> Sorry.
>
> Joseph
>
>
>> -----Original Message-----
>> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
>> Behalf
>> Of Jared Smith
>> Sent: Wednesday, May 10, 2017 1:02 PM
>> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>> Subject: Re: [WebAIM] Intro to Advanced Accessible Rich Internet
>> Applications
>> (ARIA)
>>
>> Joseph Sherman wrote:
>>
>> > Hi all. This is the first post in an Advanced ARIA
>> series<https://www.deque.com/blog/advanced-aria/>.
>> ...
>> > Remember the First rule of ARIA use
>> > <https://www.w3.org/TR/using-aria/#firstrule>
>>
>> It's interesting that every example in the Advanced ARIA series (links,
>> buttons,
>> headings, lists, and radio buttons) is using ARIA to do things that
>> readily-available
>> HTML can do.
>>
>> Jared
>> >> >> at
>> http://webaim.org/discussion/archives
>> > > > > >
--
Work hard. Have fun. Make history.
From: Chaals is Charles McCathie Nevile
Date: Thu, May 11 2017 5:14AM
Subject: Re: Intro to Advanced Accessible Rich Internet Applications (ARIA)
← Previous message | Next message →
On 10/05/17 19:02, Jared Smith wrote:
> Joseph Sherman wrote:
>
>> Hi all. This is the first post in an Advanced ARIA series<https://www.deque.com/blog/advanced-aria/>.
> ...
>> Remember the First rule of ARIA use <https://www.w3.org/TR/using-aria/#firstrule>
> It's interesting that every example in the Advanced ARIA series
> (links, buttons, headings, lists, and radio buttons) is using ARIA to
> do things that readily-available HTML can do.
To be fair,
1. That's most of what ARIA is good at
2. Examples where people already understand the thing you are doing help
communicate the idea faster...
but yeah. Sigh.
cheers
--
Charles McCathie Nevile - standards - Yandex
= EMAIL ADDRESS REMOVED = - Find more at http://yandex.com
From: JP Jamous
Date: Thu, May 11 2017 5:51AM
Subject: Re: Intro to Advanced Accessible Rich Internet Applications (ARIA)
← Previous message | Next message →
Although I am a strong believer in good solid HTML and only the use of ARIA as icing on the cake, I don't want to cut Joseph's head off if he wrote his document the way he did. Maybe there is a good reason why he did it that way based on his internal environment.
ARIA heavy pages tend to act like gas next to a fire. Once AT gets in contact with ARIA heavy apps, the results are not always good. In fact, it can cause the AT, such as JAWS, to crash. I have witnessed this on many sites. That's the only thing I would warn you to keep in mind Joseph.
-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Chaals is Charles McCathie Nevile
Sent: Thursday, May 11, 2017 6:15 AM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] Intro to Advanced Accessible Rich Internet Applications (ARIA)
On 10/05/17 19:02, Jared Smith wrote:
> Joseph Sherman wrote:
>
>> Hi all. This is the first post in an Advanced ARIA series<https://www.deque.com/blog/advanced-aria/>.
> ...
>> Remember the First rule of ARIA use
>> <https://www.w3.org/TR/using-aria/#firstrule>
> It's interesting that every example in the Advanced ARIA series
> (links, buttons, headings, lists, and radio buttons) is using ARIA to
> do things that readily-available HTML can do.
To be fair,
1. That's most of what ARIA is good at
2. Examples where people already understand the thing you are doing help communicate the idea faster...
but yeah. Sigh.
cheers
--
Charles McCathie Nevile - standards - Yandex
= EMAIL ADDRESS REMOVED = - Find more at http://yandex.com
From: Birkir R. Gunnarsson
Date: Thu, May 11 2017 6:28AM
Subject: Re: Intro to Advanced Accessible Rich Internet Applications (ARIA)
← Previous message | Next message →
There are actually quite a few reasons why people end up using ARIA.
Primarily, styling the native HTML element can be very difficult,
especially buttons, and designers design the UI without considering
the underlying HtML, they think about the looks, leave the
implementation to the developer.
People use pre packaged libraries and such, that often get it wrong. I
can´t remember if it is Ract or Angular, I think React, that ditches
all HtML in favor of divs and spans with Javascript frosting and CSS
sprinkles (I admit I am bad at my libraries, I know JQuery and
Bootstrap fairly well but my knowledge outside of that is pretty
uncharted, safe a presentation or an article here and there). For that
we need ARIA to provide accessibility.
And if the proper ARIA roles and states are provided and Javascript
provides the expected interaction, there is no reason why an ARIA
widget shouldn't be as accessible as an HTML element, that is the
whole point of ARIA. IN reality, we're not there yet, but we should
get there.
On 5/11/17, JP Jamous < = EMAIL ADDRESS REMOVED = > wrote:
> Although I am a strong believer in good solid HTML and only the use of ARIA
> as icing on the cake, I don't want to cut Joseph's head off if he wrote his
> document the way he did. Maybe there is a good reason why he did it that way
> based on his internal environment.
>
> ARIA heavy pages tend to act like gas next to a fire. Once AT gets in
> contact with ARIA heavy apps, the results are not always good. In fact, it
> can cause the AT, such as JAWS, to crash. I have witnessed this on many
> sites. That's the only thing I would warn you to keep in mind Joseph.
>
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf
> Of Chaals is Charles McCathie Nevile
> Sent: Thursday, May 11, 2017 6:15 AM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] Intro to Advanced Accessible Rich Internet
> Applications (ARIA)
>
> On 10/05/17 19:02, Jared Smith wrote:
>
>> Joseph Sherman wrote:
>>
>>> Hi all. This is the first post in an Advanced ARIA
>>> series<https://www.deque.com/blog/advanced-aria/>.
>> ...
>>> Remember the First rule of ARIA use
>>> <https://www.w3.org/TR/using-aria/#firstrule>
>> It's interesting that every example in the Advanced ARIA series
>> (links, buttons, headings, lists, and radio buttons) is using ARIA to
>> do things that readily-available HTML can do.
> To be fair,
> 1. That's most of what ARIA is good at
> 2. Examples where people already understand the thing you are doing help
> communicate the idea faster...
>
> but yeah. Sigh.
>
> cheers
>
> --
> Charles McCathie Nevile - standards - Yandex
> = EMAIL ADDRESS REMOVED = - Find more at http://yandex.com
>
> > > http://webaim.org/discussion/archives
> >
> > > > >
--
Work hard. Have fun. Make history.
From: Mallory
Date: Mon, May 15 2017 4:28AM
Subject: Re: Intro to Advanced Accessible Rich Internet Applications (ARIA)
← Previous message | No next message
Well, buttons have no reason to be difficult to style... not unless
you're
supporting versions of IE that only run on Windows XP still. But
selects,
radio buttons and checkboxes... big time. And because designers
still live in the world of pixels, we couldn't even really use the
Filament Group's "hack" for styling selects because it doesn't
really work unless you use em's for padding styling. Oh but
our selects must be exactly 36px tall or the design breaks :/
And this:
>and designers design the UI without considering
> the underlying HTML, they think about the looks, leave the
> implementation to the developer.
This is spot-on. Add in that the developers are not always
actual front-end developers but are backenders who know
just enough HTML to imitate the design and it works with
a mouse... this is sorta the plastic in the ocean. It grows
faster than anyone can clean it up, and cleanup always
leaves the tiny bits behind anyway.
I think devs are adding unnecessary ARIA for the reasons
I've been hearing from dev teams at my work:
"We added all the ARIA stuff for compliance." Bleh,
terrible reason. Basically fear-based programming.
They have no idea that a lot of these ARIA things are imitating
native things and roles. Also some specialists are telling
developers "this is how you could build your fake radio group
from divs and spans" for in case they need it... I discourage
this if in the particular case, the design isn't special enough
to need avoiding native elements. Because what developers
seem to do is *favour* the divs+spans+aria versions over
native, styles completely beside the point. I'm not entirely
certain why, but I can say React doesn't encourage one
over the other. The tutorials tend to show inaccessible
code (and there's a bug/issue out on exactly that) but those
don't tend to have ARIA-anything either. Just the usual divs
and spans :)
cheers,
Mallory
On Thu, May 11, 2017, at 02:28 PM, Birkir R. Gunnarsson wrote:
> There are actually quite a few reasons why people end up using ARIA.
>
> Primarily, styling the native HTML element can be very difficult,
> especially buttons, and designers design the UI without considering
> the underlying HtML, they think about the looks, leave the
> implementation to the developer.
> People use pre packaged libraries and such, that often get it wrong. I
> can´t remember if it is Ract or Angular, I think React, that ditches
> all HtML in favor of divs and spans with Javascript frosting and CSS
> sprinkles (I admit I am bad at my libraries, I know JQuery and
> Bootstrap fairly well but my knowledge outside of that is pretty
> uncharted, safe a presentation or an article here and there). For that
> we need ARIA to provide accessibility.
> And if the proper ARIA roles and states are provided and Javascript
> provides the expected interaction, there is no reason why an ARIA
> widget shouldn't be as accessible as an HTML element, that is the
> whole point of ARIA. IN reality, we're not there yet, but we should
> get there.