This topic contains 8 replies, has 2 voices, and was last updated by 
- Posts
Hello — We recently had our site, which uses the Iconic One theme, tested for accessibility. We would appreciate any guidance on mitigating the following issues as reported by our accessibility tester in re: to navigating the site using keyboard commands:
— Interactive items did not gain a visible focus, so that sighted non-mouse users would not know where they are in the page. See http://webaim.org/techniques/keyboard/#problems for more information and fixes.
— When navigating to a month from the “Archives” dropdown box, the page refreshes without actually selecting the month. This is likely caused by an onChange Javascript event; see http://webaim.org/techniques/javascript/eventhandlers#onchange for more information.
Thank you.
Thank you for contacting us.
1) In the header.php line 126 is
<a class="assistive-text" href="#content" title="<?php esc_attr_e( 'Skip to content', 'themonic' ); ?>"><?php _e( 'Skip to content', 'themonic' ); ?></a>replace with
<a class="assistive-text" href="#main" title="<?php esc_attr_e( 'Skip to content', 'themonic' ); ?>"><?php _e( 'Skip to content', 'themonic' ); ?></a>You are only replacing #content with #main
2) Archives dropdown widget is provided by the WordPress itself and not related to theme and I also quickly checked with the default Twenty Seventeen theme to rule out the theme issue, it is an issue with bundled WordPress widget. I will file bug report to WordPress and let you know once it is solved.
Thanks for your response. We implemented your suggestion to correct the lack of visible focus but it did not fix the problem when using the TAB key to move through links in the content. In fact, I tested for visible focus on the themonic demo page and the problem appears there as well. Our accessibility tester suggested it is likely something in the CSS that is defaulting link outlines to none or 0 somewhere.
Do you have any other solutions? Thank you.
These are the locations to edit outline property:
line 75-77 of style.css – you can remove these lines
a:focus { outline: none; }Line 445-449 of style.css
a { outline: 0; color: #00A1E0; text-decoration: none; }Remove only line 446 which is
outline: 0;Thanks! It looks like that fixed the visible focus issue. Let us know when you hear back from WP re: the Javascript problem on the Archive dropdown. Appreciate the help!
Hello — Just wanted to check back to see if you have had a response from WP re: the Javascript issue with the Archive dropdown. Thanks!
Yes, it should be fixed in the next WP update.
Refer the ticket URL below for current status:
Hello — We are experiencing the same issue with the focus on our site again. I tried implementing the prior fixes from a couple years ago but that does not seem to fix the problem. Can you advise please? Thanks.
Line numbers in latest version 2.9+ are
Line 715 and 415. Ref: https://themonic.com/forums/topic/accessibility-issues/#post-4889
remove the lines as previously or you can download the new version from member area v2.9.2 which now comes with this issue fixed.
You must be logged in to reply to this topic.