Website Accessibility Guide

2.4.7 Focus Visible

Written by MCS Accessibility Team | Jun 2, 2020 10:48:00 PM

Understanding 2.4.7 Focus Visible

Any element that has keyboard focus should be obvious. This helps users relying on keyboards and people with trouble focusing. The most common practices include a visual change to a targeted button, a caret in a textfield or a border around the area of focus.

Solutions

Browsers will automatically do this for you. Popular browsers like Chrome, Firefox and Safari will add a blue outline to text fields. As for the focus of links; the browsers act a bit differently. But if you would like to control the design, you can.   

Warnings

When designing your site, try to be mindful to test the user experience from the perspective of someone relying solely on the use of the keyboard to engage and interact with your site.