You can make clicking easier with this UX tip
When I was younger I used to play this first person shooter called Assault Cube for endless hours of the day. I got pretty good at this game, which can happen when you’re spending 5 hours practicing a map everyday. Unsurprisingly, I was also invited to join a clan which I graciously accepted. I even met a fellow clan member, an American serving & studying Farsi in Mazar-e-Sharif (Afghanistan) when he was traveling through Sharjah. We planned team meetings, strategized and played against other clans. We took it as seriously as an entirely unserious game can be taken.
Being good at AssaultCube was simple. You needed a good mouse, max out your acceleration and play A LOT. If you shot a player, you get a frag. If you manage to make a head shot, you hear a satisfying sound and get an extra frag, making it a gib. Headshots were only possible with a sniping rifle and I got good at it. Needless to say, I’m pretty darn quick with a cursor. I was in a clan for gods sake! All this doesn’t help my frustration when I run across web applications with tiny buttons that are hard to click. It takes focus to be precise. And focus feels like work! I don’t want to feel worked when I’m using your app.
Smaller click areas require more precision and clicking things can be frustrating if the clickable surface is small. Yes, that sounds obvious, but in practice, it’s not hard to find click targets that are frustratingly small. The solution is also stupidly simple. Making the click area larger would make it easier to click and navigate an interface.
Making click target areas larger is EASY
If you’re using a text link, give it some padding. If your design allows it, you can even highlight the link by giving it a really subtle background color and some border radius for that soft roundedness.
This applies to form fields and buttons too
Use some padding to make fields easier to click. Another trick, and this is really a trick, is expanding the clickable region beyond the visible boundaries of the form field. This allows for more human error, as Tom Hanks says in Sully, account for the Human Factor!
It goes without saying that you should make your labels clickable, which should wrap around the field it is labelling.
With buttons, just a bit of padding and extra invisible clickable region can make a massive difference in how easy it is to click the button. If you are designing for mobile, remember to increase the amount of white space around your clickable regions to account for larger thumbs versus the tinier cursors.
Just like OXO created a brand out of making products that work well for people who have trouble with hand dexterity (people with arthritis for example), you can make your links easier to click by giving them some padding and expanding the invisible region around them that is clickable.
Good luck creating products that people love and don’t make them suffer tiny clickable regions.
