WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Help with a WAVE error


From: Angela French
Date: Sep 27, 2016 12:29PM

Thanks! I am doing the review to determine if we want to invest the resources to make this site accessible (if it's even possible) or bring the content in under a different site that is management in our CMS. I will keep your email in the event I am asked to actually try to fix the issues. Regarding your link....my sentiments exactly.

Angela French

-----Original Message-----
From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf Of Beranek, Nicholas
Sent: Tuesday, September 27, 2016 11:24 AM
To: WebAIM Discussion List
Subject: Re: [WebAIM] Help with a WAVE error

Hey Angela, this site is using slick: http://kenwheeler.github.io/slick/

It appears that aria-describedby is referencing the dots navigation beneath the carousel. If you were to add these dots, then that would fix the issues.

Here's an example they provide:

dots: true,
infinite: true,
speed: 300,
slidesToShow: 1,
adaptiveHeight: true

Add 'dots: true- to the arguments and that should do it!

Also, totally tongue-in-cheek for your situation, but check this out: http://www.shouldiuseacarousel.com


Nick Beranek
Digital Accessibility Team

On 9/27/16, 2:05 PM, "WebAIM-Forum on behalf of Angela French" < <EMAIL REMOVED> on behalf of <EMAIL REMOVED> > wrote:

Hi Birkir,
Yes, I was looking at the view source. I can see it now when using Firebug. Not sure how this code is injected into the DOM. This is a WordPress site so I'm not sure I can even fix the problem.

-----Original Message-----
From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf Of Birkir R. Gunnarsson
Sent: Tuesday, September 27, 2016 10:42 AM
To: WebAIM Discussion List
Subject: Re: [WebAIM] Help with a WAVE error

Are you looking at the DOM or the source code (you should be looking at the DOM, e.g. using browser developer tools or Firebug when the page is loaded).
It is quite possible the ARIA was added by JavaScript on page load.
aria-labelledby or aria-describedby need a valid ID reference. Then found, the content of that referenceis spoken as he element's accessible name or description (respectively).
If the ID reference is not valid (or is empty), you should get this warning.
If you use the aXe plug-in for Firefox or Chrome you should see this error as well as the snippet of HTML where the error occurred.
Maybe Wave does this too, but I know aXe does.

On 9/27/16, Angela French < <EMAIL REMOVED> > wrote:
> Hello,
> I am doing an accessibility review for this site:
> http://bridgetocollegecourses.org/
> In the bottom section of each page is a carousel containing videos and
> associated description. WAVE is telling me there is a broken ARIA
> reference. "An aria-labelledby or aria-describedby reference exists,
> but the target for the reference does not exist." However when I look
> in the source code I'm not seeing any ARIA used at all.
> If someone could help me understand this error in the context of this
> site, I'd appreciate it.
> Thank you,
> Angela French
> Internet/Intranet Specialist
> Washington State Board for Community and Technical Colleges
> 360-704-4316
> www.sbctc.edu<;http://www.sbctc.edu/>;
> > > archives at http://webaim.org/discussion/archives
> >

Work hard. Have fun. Make history.
The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.