5 easy steps to an accessible website

Mikey Wade - 07.06.2017

Let’s set aside the obvious moral considerations for the moment. If you ignore accessibility in the management of your digital assets, then you run the risk of alienating a considerable proportion of your potential market.

It is believed that in the UK there are around 2.7 million colour-blind people, while 70% of the UK population wear glasses. Additionally, 1 in 30 suffer with sight loss, and 10% of the country has dyslexia (4% with severe cases).

Despite this, many web design projects fail when it comes to accessibility.

So, what can you do to make sure your website is accessible to everyone? Marketing Tech suggests these five steps as a great place to start:

Make sure the site has sufficient colour contrast

Getting the right colour scheme for your website is more than just choosing the design aesthetic that reflects your brand. The wrong colours could make the page unreadable for those with visual impairments. However, there are plenty of online tools available (Such as WebAIM) to help make sure your site’s colour scheme meets accessibility guidelines.

Add ALT text to images

Adding ALT text to images doesn’t impact the way an image is rendered but many websites fail to include it.

Most importantly, screen reader tools need this text to be able to relay the content of the images. Providing a short description of an image helps give context, which adds to a user’s understanding of your website’s content.

Don’t go crazy with the graphics and transitions

Of course you want your website to stand out from the crowd and wow visitors, but it’s very easy to go overboard with your graphics and transitions.

A moving target can present an unnecessary challenge to users who have difficulty operating a mouse. Before you go live with your website packed full of effects, ask yourself if they really add any value. If not, get rid of them.

Include hover/focus states for clickable elements

Ensuring all your clickable elements have a hover and focus state is another simple improvement that will help your site’s accessibility. For a visually impaired user, a hover state clearly indicates they’re interacting with the element and clarifies that clicking it will bring a call to action, while a focus state is a vital feature for keyboard users who might not be able to operate a mouse.

Change your mindset

As well as making sure your website works on numerous platforms, you need to get into the mindset of ensuring it works for everyone.

A more accessible site will evolve organically if you approach design, UX, development, and website testing from a range of perspectives.

Google Chrome’s Accessibility Developer Tools extension can help with this but if you need further advice, Fireworx can help. Give us a call today.