Tuesday, December 6, 2016

website design - To meet WCAG AA on desktops, what is the minimum space required between two click targets?


I have already looked at these:


1. WCAG 2.1 for Target size
2. button sizes on web pages on Stack Exchange
3. Material Design Google Guidelines for Buttons
4. Spacing between UI components on Stack Exchange
5. Proposed SC Target Size on W3C



None of these tell us for certain what is the minimum spacing required between two click targets on Desktops while being compliant to WCAG AA. Either I am missing the term that is being used to define this in WCAG Guidelines or this is not defined yet. If this is not defined yet then how much space (in pixels) should I be keeping between two click targets?


Also if possible please guide on the minimum size required for related UI Elements such as Buttons, input boxes, radio and check boxes and Links for being AA Compliant on Desktops.



Answer



To my knowledge there isn't a minimum space between clickable/tappable elements set by WCAG AA guidelines. I would leave what you deem acceptable.


But there are some guidelines out there that may provide some food for thought:


The BBC have their own guidelines of button sizes and padding which can be seen here: http://www.bbc.co.uk/guidelines/futuremedia/accessibility/mobile/design/touch-target-size . They recommend a touch target size of 7-10mm (approx. 26px - 37px) with a 7mm exclusion zone (padding) around them on mobile.


44px x 44px is Apple's guidelines for the minimum for a tappable button, this should be enough for the tip of a thumb to tap it. (a full width thumb press is 72px x 72px).


There are varying measurements on buttons etc so depends on what criteria you are wanting to meet. See here more information here:



No comments:

Post a Comment

technique - How credible is wikipedia?

I understand that this question relates more to wikipedia than it does writing but... If I was going to use wikipedia for a source for a res...