Developers

2.4.7 Visible Focus (Level A)

When an interactive element (link, button, form field, selectable element, etc.) receives focus, a visual indicator should show so the user can see what element they’re currently on.

What you need to know

  • Style your website so that any interactive element shows visible focus when an element receives focus
  • A focus indicator is often a rectangular box around a link or a vertical bar displayed in a text field.
  • There are many different styles you can use to provide visible focus.

What you need to do

  • Make sure that when someone tabs through your website, any interactive element (such as a link or form field) has a focus indicator of some kind.
  • Make focus very clear and conspicuous by providing a strong, contrasting color for a box border or potentially highlighting an input field such as a search box.

Reference

Read the full explanation of success criterion 2.4.7 on W3.org.

Related Resource

Read “Can you reach anything that’s interactive using the tab key?” on Digital.gov for more information about this success criterion.