material-components-android icon indicating copy to clipboard operation
material-components-android copied to clipboard

[Accessibility] Why the recommended touch target size on android devices is 48 x 48 dp?

Open iamrafan opened this issue 4 years ago • 7 comments

Hi Team,

Can you please help us understand the rationale behind Material design's touch target guidelines recommending making touch targets at least 48 x 48 dp on Android devices, despite the WCAG and iOS guidance mentioning 44 x 44 CSS pixels and 44 x 44 pt respectively?

iamrafan avatar May 07 '20 00:05 iamrafan

https://material.io/design/usability/accessibility.html#layout-and-typography:

"Touch targets are the parts of the screen that respond to user input. They extend beyond the visual bounds of an element. For example, an icon may appear to be 24 x 24 dp, but the padding surrounding it comprises the full 48 x 48 dp touch target.

For most platforms, consider making touch targets at least 48 x 48 dp. A touch target of this size results in a physical size of about 9mm, regardless of screen size. The recommended target size for touchscreen elements is 7-10mm. It may be appropriate to use larger touch targets to accommodate a larger spectrum of users. Note that on iOS, 44 x 44 pt is the recommended touch target. For platform-specific implementation guidance, visit the developer resource page."

This is not a bug, so removing the label.

wcshi avatar May 07 '20 16:05 wcshi

Can you please elaborate further on why 48 instead of 44?

Also, can you please let us know if there are any plans to align to 44 in the future as per WCAG recommendation? Having consistency in the size requirements will help the teams using shared components for both Android and iOS apps

iamrafan avatar May 08 '20 16:05 iamrafan

Thank you for your feedback. We will investigate this further.

wcshi avatar Oct 10 '21 17:10 wcshi

we should always use 48x48 dp at least for all clickable components ? for example for button and chip ?

WalidMaata avatar Oct 18 '21 19:10 WalidMaata

@WalidMaata that's correct

wcshi avatar Dec 20 '21 20:12 wcshi

I'm also curious about the rationale. Looking forward to hearing some details. Thank you.

hellohj avatar Mar 11 '22 22:03 hellohj

Android was released in 2008 and did mention in older documentation touch target size of 48 dp = 9 mm as originally quoted in StackOverflow post Android Minimum Button Height: 48dp = 9mm?. I don't see any mention of target size in WCAG until WCAG 2.1 which was published in 2018. While the standard was probably informed by developments in mobile browsing, the size on Android carries over from Android's inception.

codeledger avatar Jul 18 '22 01:07 codeledger

Hey folks, thanks everyone for providing your insights/questions.

I'm sorry that I think the info mentioned in https://material.io/design/usability/accessibility.html#layout-and-typography is all we have. Also it's following Android's design guideline. : )

drchen avatar Aug 18 '22 14:08 drchen