WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: About Accessibility Test and WAI-ARIA and WCAG

for

From: glen walker
Date: Dec 14, 2018 3:11PM

WCAG is the "what" and contains the technical requirements (although
technology agnostic). The success criteria are how you measure whether
your site is compliant or not.

WAI-ARIA is the "how", if your implementation is in html (technology
specific) *and* you can't implement it using native html.

For example, WCAG 1.1.1 talks about "non-text content". It does not say
"images" or the <img> tag because WCAG is technology agnostic. And it says
non-text content must have "text alternatives". It does not say your
images must have an ALT attribute.

If your image can't use a native <img> tag and you have to use a
non-semantic element, such as a <div> or <span>, then WAI-ARIA can help.
You can use role="image" and aria-label to help the "non-text content" to
have a "text alternative".

So, you'll want to use WCAG (
https://www.w3.org/WAI/standards-guidelines/wcag/) to test and measure how
accessible your website is.

You'll want to use WAI-ARIA (
https://www.w3.org/WAI/standards-guidelines/aria/) if your website fails
any WCAG success criteria and you can't fix the problem using native html.

Whether you use react or angular or bootstrap or whatever, doesn't matter.
If the component you use from a third party library does not generate
headings or lists or tables or form elements with appropriate semantics,
then they fail. How you fix the problem might be library dependent.

Glen