Popup - making these accessible

Hi, first time posting here - looking forward to hearing back from other Elfsight users!
We used the Popup feature on our website for advising customers about changes to our services. All good. But, I run a UK government website and when the popup was checked, it failed accessibility (WCAG 2.1).
The explanation was this: There is no visible keyboard tab focus on the feedback link or the close button once the link is expanded.
We had to remove the popup :frowning:
It is such a useful tool, so I am wondering (not being a coder at all!) if there is some way that this could be fixed so that the popup can be used by customers who use keyboard only to tab through the website and also then hit the popup feature.
Hope someone can help or advise on this.

1 Like

Hi @user54, great to see you on our forum, welcome! :hugs:

Thank you for sharing your experience, I do understand your frustration, and I’m extremely sorry that our apps are not WCAG compliant at the moment.

I’ve passed your request on to our development team to draw their attention to this issue one more time. I do believe they will look into this in the near future :pray:t2:

If there’s anything else I could do for you, you’re welcome to contact me anytime :slight_smile:

Hi, I’m no developer, but is there someone in this community of users who can share some code to make this accessible? It is such a neat tool but I cannot use it at the minute. Thanks, Alan.

Totally get you, Alan!

You know, that would be cool if someone could help in this matter, and I believe someone will :slight_smile:

Meanwhile, our devs will try to find a quick solution for you, perhaps they will be a success, too. I’ll keep you posted!

@user54 Hello Alan!

Our developers are happy to delve into the issue with WCAG compliance, and it would be awesome if you could help us in this :slight_smile:

Is there an option for you to tell me what tool you used to check the widget, and what are the results you got? It would be great if you could provide the info here, it would help us a lot.

Thank you!

Hi Helga, it is this application Elfsight Apps

WCAG 2.1.1 Keyboard

Users should be able to use a keyboard to access all content and functionality of a web page. This means the page can be used by people with no vision as well as people who use alternative keyboards or input devices that act as a keyboard.

When the pop up notice appears there is an X in the top right which lets users close this down. That is fine if you don’t have issues with vision and can see this to close it down. But if you only use a keyboard then users cannot keyboard tab to this and the buttons are not keyboard accessible.

I’d happily arrange a Zoom call to talk it over if that helps as I’d really love to use the pop up on our website.

1 Like

Alan, thanks a lot for your reply!

My apologies for another question, but could you please tell where did you check our widget, or what tool did you use to check the widget? It would help us a lot to check out this tool and to come up with any ideas.

Thank you!

Hi. Our website was independently tested by the UK Cabinet Office. This is the info they included in their report to us on how they test and what they used.

How we test

We have published information about how we sample and choose pages for simplified testing - Public sector website and mobile application accessibility monitoring - GOV.UK.

We test pages using a combination of automated accessibility tools and manual tests. We currently use an automated tool called Axe. You can replicate the errors we have found by downloading Axe as a free browser extension axe Browser Extensions for Accessibility Testing | Deque . For these tests, we are only looking for severe or critical Axe errors.

Automated testing does not find all accessibility issues. We also do manual tests including:
• Tabbing through each page without a mouse
• Viewing the page at different zoom settings
• Simulating viewing the page on a small screen

These manual tests find issues such as keyboard functionality, visibility of keyboard focus and reflow which are some of the most common barriers to users with accessibility needs and are not likely to be picked up in automated tests.

1 Like

@user54 thanks a lot for your patience!

I’ve just got an update from the devs, and this is what they have to say:

They have done some research and found a way to implement a keyboard navigation for the Popup close button, so from now on you can close the widget with the help of Tab keys.

This is all we could do for now, but I really hope it will be helpful :pray:t2: