People with disabilities dot com

Accessible Websites

Browser picture for the accessible websites page
A browser screenshot featuring an address bar, refresh button and the end of a browser tab.

Accessibility is not always physical barriers. The internet has become more relevant to everyday life and specifically to business. It is essential that your website is accessible otherwise you may miss out on buyers, subscribers or readers. You can find tips on building accessible website below

Make your website easy to read

  • Use sans serif fonts such as Verdana and Geneva. Do not use a serif font as this isn't good for people that experience low vision. It is always best to set the font for your site so you can be assured that an accessible experience is delivered.
  • Ensure all content is easy to understand.
    This is important for people that have more difficulties understanding text and this also assists people who do not speak much of the language that your website is in.
  • Consider writing the words to abbreviations when you first use them in a piece of content; not everybody will know what you are talking about.
  • If you use AJAX on your website so that people can load content without loading a new page you may want to add ARIA attributes to affected areas. Usually a programmer/developer will take care of this. This point probably doesn't apply to most websites.
  • If you can; have a tool on your website that adjusts the font size.
  • Avoid putting objects such as share buttons in a place where they will be over text. This covers text and makes things difficult to read.

Accommodating users of screen readers

  • Always provide alternative text for important images using the ALT tag. If you have a large infographic you should consider doing a text version on a separate page.
    Additionally if you post on social media ensuring that you have quality captions to go with images would be helpful.
  • Use descriptive text for links so people who use screen readers know what they are.
    A link saying "click here" is not particularly helpful. It would be better to use the name of the page or website. If other websites are linking to your site an additional option is using your domain name as the link text.
  • If you are a coder it is also worthwhile to use the label tag for form inputs such as text boxes.
    Most visitors should not need to worry about this if they have not got at least one form on their website. If their website contains a form such as a contact form we suggest contacting technical support to ensure that there forms have labels.

Captions and transcripts

  • Provide either closed captions or transcripts for videos, or both.
    Having subtitles for video also helps people who do not have their speakers on. Common situations where this might happen are when people are in bed with the laptop or when people are in a work environment. In today's world people can use tablets and laptops out and about; hearing things in a public place can be difficult so having subtitles available is a good idea. Some places also require devices to say silent too.
  • Provide transcripts of audio clips.

Tips for your website's layout

  • Keep your layout simple, so it can be resized without impacting the layout or losing information. This is also important as a general rule for mobile devices.
  • Ensure the colours of your web design are a good combination so content can be easily seen.
    You might want to additionally check how your web designs look in older browsers to ensure that the layout stays the same.
  • Ensure all links and other functionality can be operated from a keyboard.
    If someone is required to move their mouse over an object to view a menu then it is not easily accessible from the keyboard. However the if you make the menu open and close on a click (this can be in addition to having it open/close on mouse over) you can solve this problem.
  • Give people enough time to use/read content and do activities such filling fill out forms. Give instructions where appropriate.
  • Make your site and scripts as backwards compatible as possible. Some users are stuck with older technologies. If you really want to use newer technologies consider doing a basic version. This could also benefit mobile users.
  • Some people with vision problems find it difficult to read paragraphs or bullet points that are centered; keep the text flowing from the left.

Avoid distractions and surprises

  • Ensure content doesn't induce seizures; avoid flashing text etc.
  • Animations can be very problematic for people with ADHD. They should be avoided.
  • videos and sounds that play unexpectedly can be a hazard to some people. You should always favor manual play for media.
  • Avoid popover advertisements if possible; some people operate computers slowly and these can be a pain to close.
    I'm sure many people will ignore this point but as a person with a disability that operates the computer very slowly searching the web is not a pleasant experience. I don't like my reading being interrupted by boxes telling me to subscribe to a newsletter or like the company on Facebook. When this happens on every site that you click on it really gets annoying.
    Placing such boxes within the page itself could be better.

Helping people navigate your website

  • If your website has a big header or logo consider creating a "Skip to content" link at the top of the page.
  • Avoid menus that automatically close when the mouse is not on them.
    These can be a pain for people who are using eye tracking devices to use the mouse and it is also problematic for people who have unsteady hands. Click to open, click to close.
  • Make content easy to find and/or browse. Consider having a site map.

Issues for documents and other platforms

  • PDF (Portable Document Format) files are not always accessible; consider creating a regular web page with the information on it as well.
  • If you deliver content on multiple platforms then make sure that all platforms are accessible or have the content available on at least one that is accessible. Additionally you may want to link to the accessible version when putting up additional copies.

Tips for assisting people with forms

  • If you must use a CAPTCHA, ensure an audio version is available. Alternatively some sites use a plan English question or math problem. Bot software can read CAPTCHA images and people are paying those in undeveloped countries to constantly crack CAPTCHA codes. CAPTCHA still provides some protection but this is limited. Think carefully before requiring a CAPTCHA on contact forms as an example. If you make using your site too difficult some people will not bother.
    I remember trying to subscribe to a newsletter one time but failed the CAPTCHA; I was annoyed. I didn't bother going back and trying to subscribe again. On the other hand I have owned fairly inactive websites and hundreds of people have apparently subscribed to the newsletter. I don't think they are real people. Do a cost-benefit analysis. If not having a CAPTCHA is not causing major problems it is best not to have one.
  • Ensure that if a user makes a mistake on your form they don't have to redo the entire form. This is good as a general rule; most people don't like typing things repeatedly.
  • If you offer phone support it is important that people can still email you; some people cannot use phones.
  • Text boxes shouldn't automatically become active as this is a hazard for people who use the keyboard to scroll.
    A better option might be to put the text box as the first tab. Making sure that the text box is the first thing on the page is one way to do this. An additional way is getting the person that maintains your site to define a "tab index" for the text box in the code.
  • Give people enough time to use/read content and do activities such filling fill out forms. Give instructions where appropriate.
  • See information on labels in the screen reader section of this page.

WordPress

I don't use WordPress but I understand I they follow the W3C accessibility standards so it is probably a good platform to use. However if you're like me and prefer to code your own sites then the guide on this site will hopefully serve you well.

Accessible Search Engine Optimization

An accessible website can also help with search engine optimization or SEO for short. SEO on Google lately has given priority to algorithms that detect if people like your site and if after they clicked your search result they then go back to Google to click another result this can hurt your website's rankings. They are less likely to bounce back to Google if your website loads fast and is accessible.

The accessibility of your website can affect your ability to get links. Some people will not link to your site if it is inaccessible.

Different content for different people

People consume content differently. Some people may enjoy blogs and some may prefer a YouTube video or a slideshow. You don't have to do everything but if you choose to have your content available on multiple websites this can help with increasing awareness of your brand.

If you are doing different forms of content on multiple websites you may want to provide links to the different types. This could help people find the content in their desired form. Some people in the SEO industry think that linking to your content from these places would have benefits because of the backlink but I think that such backlinks would not be powerful enough to make a difference in most cases.

If you have captions and alt text it could be a bad idea to makes them the same as screen readers will read out both. Try to make them different.




This page was originally published at 19/04/2016 02:22:00 UTC

Share on Facebook | Twitter | Pinterest | Tumblr |