Everything you can do with a mouse needs to be possible, and reasonably easy, to do using just the keyboard.
Check keyboard accessibility by putting down the mouse. Try everything on the site using the tab, arrow, enter keys and the spacebar. There should be equal access. No one should be locked out of a dropdown menu, or get trapped in a modal, because they can’t use a mouse.
Focus
Focus is something that happens between the interactive elements on a page. That’s the first thing you should know. Interactive elements are elements like links, buttons and form fields: things that users can interact with.
hacks.mozilla.org
Focus styles are visual indicators that an element has focus. It’s important that focus styles, the changes to links and buttons that you see when tabbing through a page, are easy to spot.
The default focus styles for links in this theme are:
.entry-content a:focus {
text-decoration: none;
}
I’ve changed these to make focus on links more obvious. The text-decoration underline disappears, the background turns red, the text turns white.
.entry-content a:focus {
background-color: #e22658;
color:#fff;
text-decoration: none;
}