Categories
keyboard tools

Force Focus Tools

When testing web accessibility, missing visual focus indicators is a “violation” of 2.4.7 Focus Visible. And when it fails, it also makes other checkpoints difficult to test (for sighted testers) such as focus order.

blue ring around the words "words cognitive concerns" in a block of text

To get around this problem, here are a few tools to help force a visual indication of keyboard focus. Keep in mind that sometimes the tool doesn’t work, usually due to extremely poor markup and lack of keyboard access entirely.

Do you know any others?

Bonus! Enter this in the browser console. Then the console with return the element which is currently focused.

document.addEventListener('focusin', function() {
  console.log(document.activeElement)
}, false)

More on visual focus indication:

3 replies on “Force Focus Tools”

[…] Force Focus Tools By Dennis Lembree. “When testing web accessibility, missing visual focus indicators is a ‘violation’ of 2.4.7 Focus Visible. And when it fails, it also makes other checkpoints difficult to test (for sighted testers) such as focus order. To get around this problem, here are a few tools to help force a visual indication of keyboard focus.” http://www.webaxe.org/force-focus-tools/ […]

Leave a Reply

Your email address will not be published. Required fields are marked *