Mobile Accessibility Guidelines - Design

Target touch size must

Touch targets must be large enough to touch accurately.

All users benefit from larger touch targets. For young users, and users with motor and/or vision impairments, this is even more important as precision can be difficult.

Content touch targets must be large enough to read and have a large enough interactive target area to tap comfortably with one finger.

The recommended size of touch targets is 7 – 10mm. This size is equivalent to the smallest average finger. An interactive target area should be at least 7 x 7 mm. If not, it must be no smaller than 5 x 5 mm inside an exclusion zone of at least 7 x 7 mm that does not overlap with any other touch target. The recommendation is to provide a bigger touch target where possible.

Also refer to BBC GEL - How to design for touch

Sometimes text that is big enough to read is too small to touch. For example, a linked letter in an A-Z listing would be too fine to touch accurately and should be placed in a linked container to increase the target area.

Tip Group adjacent related elements that link to the same resource as a single linked touch target. This increases the touch area and simplifies the interface.


Make sure that all actionable controls have a touch target size of at least 44 x 44pt or equivalent in pixels. Additionally, make sure there is at least one pixel between targets.

Minimum sizes can be specified in the Size Inspector utility in XCode’s Interface Builder’s View panel, or can be set at code level:

See iOS Human Interface Guidelines for details.

iOS Example (Objective-C)

[myButton setFrame:CGRectMake(50, 50, 10, 10)];


Make sure that all actionable controls have a touch target size of at least 48 x 48dp, with at least 8dp or more space between these controls. Additionally, make sure there is at least one pixel between targets.

Use the setPadding method to apply white space around the text. Use the layout_width and laytout_height attributes of the LayoutParams object to provide an appropriate width and height.

See Android Material Design guidelines for details.

Android Pass Example


You can also use the setPadding method in code rather than XML:



Provide padding around links to ensure all actionable controls are at least 7mm across. Use larger controls, i.e. 9mm, or increase the padding around the content to ensure a large touch area.

Use elements such as lists to provide structure to page content such as navigation, and CSS to add padding and margins around each touch target.

HTML Pass Example

  button {
    box-sizing: border-box;
    min-width: 44pt;
    min-height: 44pt;
  <button>Tap me!</button>



Touch target size can only be verified during design as all phones will have varying screen sizes.

During design:

  1. Locate all touch targets/actionable items.
  2. Check the sizes are larger than 7mm.


The following checks is true:

  • All touch targets/actionable items are larger than 7mm across.