WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Associating Errors From Wave Plug-in to the HTML Source

for

From: KellyFord
Date: Dec 28, 2018 9:19AM

HiJared,

When you say that activating a button in the side bar should cause the code
in the code section to get highlighted, I have a question or two.

Are the buttons supposed to be the graphics that get numbered starting at 1
up to how many items are listed for a given category? For example, if I'm
told there are 16 H2 elements on the page, first there is a checkbox and
then graphics with alt text of numbers 1-16. Or are the buttons someplace
else?

Kelly



-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of Jared
Smith
Sent: Thursday, December 27, 2018 10:08 AM
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] Associating Errors From Wave Plug-in to the HTML
Source

Kelly -

WAVE has a code panel at the bottom of the page that will show the WAVE
icons with their relevant code. The icons in the code panel should indicate
the icon name/type (such as "ERROR: Missing form label"), but there seems to
be a bug where all of the icons have alt="1". Yikes! I'll fix this soon.
Activating a button in the sidebar or within the page will visually
highlight the respective location within the code, but it doesn't set focus
to it.

When designing this functionality we chose not to have the icons change
focus when activated. Because each icon is represented three times (details
panel, within the page, and in the code panel), having focus change between
them would quickly become rather difficult and confusing, not to mention
that pages would then have numerous, often hundred of new buttons to
navigate. We decided to have keyboard interactivity centralized within the
functionality of the sidebar and within the page itself (each icon is
keyboard focusable there).

I think I'll add some new functionality where if an icon is activated, then
the relevant portion of code within the Code panel region would then be
keyboard navigable, though not focused directly. In other words, you could
find the relevant icon within the page or sidebar, activate it, then jump to
the Code panel region and navigate directly to the relevant code area. I'll
test and if this functionality makes sense will push an update with this
functionality soon.

Thanks for helping prompt an improvement to this functionality.

Jared Smith
WebAIM.org
http://webaim.org/discussion/archives