A11Y Buttons

The JBST WordPress Theme meets WordPress.org’s Accessibility Guidelines. I think accessibility support is important. Recently i got a e-mail from Nick, Co-founder of HKC radio.

Nick told me JBST default navbar buttons don’t have a label or title. The login button has a title when logged in, but when not logged in the button only identifies itself as ‘button’.

After reading Nick’s e-mail i found the excellent blog post of Nicholas C. Zakas: Making accessible icon buttons.

There seems two ways around to solve this button problem. The first solution adds aria-label attribute to the buttonHTML element. Whilst the second solution uses an additional spanelement which is hidden for non-screenreader by the JBST’s built-in sr-only class.

I create a sample for page for both solutions, this page also includes the current situation, could you tell me which solution you prefer and why? Or do we need a combination of these solutions?

Please also let me know when the button dropdowns got any accessibility issue.

Leave a Reply

(will not be published)