fbpx

How Tiny Hyperlinks Can Ruin Your Sites Web Accessibility *

Don’t Use Tiny Clickable Hyperlinks

 

Hyperlinks are designed to be clicked to access more information, so make them usable.  It just makes sense to ensure that they’re easy to click.  Here’s an example of links that are far too small; clicking them is harder than it should be.

accessible,hyperlinks,clickable links,accessibility

Following is an example of the same type of interface element as shown in our opening example.  This is much like the comments link you would find on many web pages.  However this time there is a much larger clickable hyperlink area.  This larger links usability and web accessibility is much better because of it’s larger size.

 

accessible,hyperlinks,clickable links,accessibility

Why Larger Clickable Hyperlinks Just Make Sense.

 

There is a good reason that you would want your visitors to have a larger clickable hyperlink area?  It’s really simple.  A larger clickable area is desirable because mouse hand movements aren’t precise.

Having a large clickable area makes it easier for your visitors to hover their mouse cursor over your link.  Everything we do in our web design needs to use the best fundamental practices and make every visitor interaction as easy as possible.

Ensuring that we provide a large clickable area can be achieved in two different ways.  Either we could make the whole link bigger or we could increase the padding around the link using the CSS “padding” property.  If we use CSS, here’s the code I would use:

<a href=”http://www.examplesite.com”style=”padding: 5px;”>Example Site<a>

The CSS has been placed inline together with the markup to make the example simpler.  However in real life you’ll likely want to add this styling to your CSS file by giving the link a class or id and targeting it with that.

 

Read more about padded link targets.

 

You can read more about padded link targets for better mousing in a 37signals article on padded link targets.  Your site users, according to the article, feel more comfortable when you provide links which are larger and easier to navigate.  Larger links make users feel like the links are working with them instead of against them.

 

Usability Makes Things Easier

Usability is all about making things easier to use.  Requiring less thinking by your visitors, resulting in less frustration.  Your website should do all the work and present visitors only with the things they’re looking for.

Useability is About User Exprerience

Usability is also about the experience people have using your website, so attention to detail matters, as do the presentation and feel of the page.

Drop your thoughts on these and any other usability problems you run into in the comments section below! 

Accessibility Toolbar