Focus Trap
In my last post, I talked about Popups (Modals) and the importance of making sure that screen readers are alerted when they appear on a website or any validation messages appear.
You may be thinking that is all you need to do.
Not quite!
Today I am going to talk about an issue I come across more often than so many of the others.
We are going to talk about Focus Traps!
What is a focus trap?
Above, we have a login modal. There is a username field, a password field, a login button and a close button
You may remember from my previous article that keyboard users will tab between elements on a page.
If there is a focus trap, all they can do is stay on this modal until they press the login button or the close button and then it goes away.
Just like a sign-up form, a shopping basket, or anything that is overlaid on the website.
This is how it should be, you cannot go anywhere else until you get rid of it, just like it will always still be visible on the screen until you click on the login button.
No Focus Trap
So what happens if there is No Focus Trap?
Well, if you are using a keyboard, you tab from the username to the password screen, to the submit button, to the close button; and then you just keep on going! Eventually, you may find your way back but it can take a very long time!
This is one of the most common issues I witness in my audits.
3 of my team use screen readers, they share their screens with me and I record their journey, as part of my audits.
I have lost count of the number of times I have seen my team members tabbing off the popup and going round the rest of the page, blissfully unaware that anything is wrong!
A focus trap fixes the problem, so hopefully you can perhaps now begin to see that you will be able to fully utilise your digital marketing skills but in a more inclusive and accessible way!
Not a keyboard trap!
By the way, it is very important to understand that I am talking about a focus trap, NOT a keyboard trap.
A keyboard trap is a very bad thing because that is when you end up stuck in a modal and you can’t get out of it.
Not without using a mouse anyway!
Apologies for the U2 pun. It was Bad. Oh dear and again... I'll get my coat.
I would love to hear your experiences of focus traps, or the lack thereof!
