Skip to main content Skip to main menu

Web Accessibility Guidelines for Target Size

Under the Information and Communications Standards of the AODA, organizations must make their websites and web-based apps accessible. Organizations must do so by making their websites compliant with Web Content Accessibility Guidelines (WCAG) 2.0, Level AA. This international standard gives web developers guidelines on how to make their webpages accessible to computer users with disabilities. However, updates to the Information and Communications Standards could require organizations to comply with more recent versions of WCAG. An improved version of these guidelines, version 2.2, was released in October 2023. This article will outline WCAG 2.2’s web accessibility guidelines for target size.

Web Accessibility Guidelines for Target Size

People use pointer gestures to select all targets on a website. For example, targets include web elements such as:

  • Links
  • Buttons
  • Dropdown menus
  • Form fields, such as:
    • Edit fields
    • Radio buttons
    • Check boxes

These targets should be large enough for people to select them easily with a:

  • Mouse
  • Finger
  • Head pointer
  • Eye-gaze system
  • Speech-controlled mouse emulator

As a result, web content creators should design targets to be at least twenty-four by twenty-four (24 by 24) CSS pixels.

Exceptions

If more than one (1) target performs the same function, the guideline for target size only applies to one (1) of the targets. For example, a designer might create a link and a button that both bring the user to the same place. If the button is large enough, the link does not also need to be large.

Moreover, targets can be smaller than twenty-four by twenty-four (24 by 24) CSS pixels for legal reasons or if a smaller size is essential. In addition, a target that is also part of text, such as a link embedded in a paragraph, can be smaller. Similarly, targets can be smaller if the space between them leaves twenty-four by twenty-four (24 by 24) CSS pixels around each target.

Finally, some webpages allow users to create content and choose its size, or change the size of existing content. Website designers cannot control the size of targets that a user has created or changed. As a result, the guideline for target size only applies to content that users have not created or changed. In other words, the first time a user opens a webpage, all targets should be twenty-four by twenty-four (24 by 24) CSS pixels.

Advanced Requirements

The WCAG webpage provides the full list of requirements, as well as technical guidance on how to implement them. The AODA only requires websites to follow guidelines in version 2.0, level AA. However, the WCAG webpage provides guidelines at level AAA. While websites do not need to follow these guidelines, they can choose to follow them as a best practice. Websites that follow more guidelines have the chance to welcome more visitors and do more online business.