How To Create an Accessible Website

By Eva Alsis (1044)

When most people think of ‘accessible’ businesses, they think of ramps for wheelchairs, large print signs, and other physical modifications that make a business east for people with disabilities to use. However, it is just as important to ensure that your website is accessible to people with different challenges. The fact is, people with disabilities use the internet increasingly because it can be much easier than shopping in more traditional venues. You would never purposely create a website that a large segment of the population simply cannot use, yet this is exactly the situation that an inaccessible website creates.

The W3 Web Accessibility Initiative says “When websites and web tools are properly designed and coded, people with disabilities can use them. However, currently, many sites and tools are developed with accessibility barriers that make them difficult or impossible for some people to use. Making the web accessible benefits individuals, businesses, and society. International web standards define what is needed for accessibility.”

For an introduction to accessibility requirements and international standards, see Accessibility Principles.

Here are a few ways to ensure that your site is usable by people with a variety of abilities.

Consider color.

Up to ten percent of the population is color blind, which usually means that they cannot distinguish between red tones and green tones. If you are using red and green to distinguish different points (which is common as these two colors are used similarly in traffic lights and signs), one in ten customers is not even seeing the effect. Use shapes and other more graphic ways of differentiating in addition to color.

Create readable websites.

Many visually impaired visitors use screen readers, which often cannot read tabular layouts. Converting these and similar features to CSS will give the same feeling and functionality without excluding anyone. If this is simply not a possibility, consider offering a high contrast or text only version that people with vision impairments can manage.

Use large links and buttons.

Not only are these easier for people with vision impairments to perceive, they allow people with small motor disabilities, such as cerebral palsy, multiple sclerosis, Parkinson’s disease, and more, to have a larger target to click on. Even a small enlargement or links can make a huge difference. As a bonus, this also makes links and buttons more visible to non-disabled traffic.

Use alt tags and ample descriptions for images.

Not only will this give people using a screen reader an idea of what the image might be, it allows people who cannot view the images for any other reason to make a reasonable inference. These tags are also important for SEO, so this change is a win-win situation in every way.

Remove time limits.

Customers with various abilities may need a little extra time to fill in forms. If your website times them out before they can reasonably complete the task, you have just lost a conversion. Allow ample or, better yet, unlimited time to fill out forms and go through processes that require typing.

Choose a CMS that supports accessibility.

When choosing a CMS and theme for your website, make sure the theme and the CMS support accessibility. This may not be apparent right away, so look into the documentation to make sure that it supports such features. Not just the CMS but also the e-commerce platform must support accessibility and this should be at the core of the platform.

Structure your content properly.

Put a lot of thought into how your website content is structured and if it makes it easy for accessibility. Heading and paragraphs must be carefully planned to ensure the content flows clearly. Avoid using fonts or headings that may look good visually but create a disconnect in the flow of the content.

Make your forms easy to use.

The biggest issue with a lot of websites is that their forms are very hard to use. This is more critical when you are considering to make your website accessible. Make sure the labels and the input fields are easy to tab over. If your form uses in-place labels (labels that are within the field inputs and disappear when someone clicks on them), make sure the label comes back when mouseover is off focus.

The website should be keyboard friendly.

Test your website to make sure that the website can be navigated without a mouse. One should be able to access all parts of your website with just the keyboard. This means that the order and placement of tabbing would be critical.

Transcribe audio files.

If your website has any audio files such as podcast elements, ensure that they have been transcribed and that text is clearly accessible for people that have hearing issues. The transcript can also help with your SEO and allow search engines to gain deeper insight into the web page.

How important is it to have an accessible ecommerce website? Consider this story: Target recently paid out more than $6 million dollars in a class action lawsuit brought against the retail giant because their website was not accessible to the blind. However, don’t let fear of lawsuits convince you to create a more accessible website; do it because it includes people with varying abilities, shows respect for the entire population, and in most cases creates a better overall e-commerce website.

Here are a few resources to help you understand the importance of accessibility better:

  • A collection of user stories on how people with disabilities access websites and the benefits of having an accessible website.
  • Tools and Techniques – introduces some of the techniques and tools that people with disabilities use to interact with the Web, such as browser settings, text-to-speech, voice recognition, and many more.
  • What the NDA (National Disability Authority) says about accessible websites.
  • concise treatment of accessibility principles and practices by Google.
  • How you need to start thinking about how users might access and use your service before you design or build anything.
  • Four unexpected benefits of creating accessible websites.
  • 30 steps to a more accessible website by The University Of Warwick.