Placing and Spacing Elements

When it comes to making accessible layouts and interactive UI elements, it’s good to leave some (literal) room for error. Flexible UIs are accessible UIs because they allow the page to adjust and adapt to meet the user’s needs. This is an important concept to keep in mind when we are considering the literal placement and spacing of elements on the page. It’s essential to build in that wiggle room to our layouts.

Touch and tap zones

When buttons and other “click zones” are too small, they can be difficult to accurately interact with. You have probably experienced this frustration yourself when you’ve attempted to interact with a small element, like an icon. This can be especially challenging if that element is close to other elements or if the user is being jostled around. For example, if the user is riding the bus or subway.