Archive | December 2015

A Novice’s Advice on an Accessible Website

By Talley Wells, OlmsteadRights.org and the Atlanta Legal Aid Society, Inc.

novice website2As an attorney who wanted to start a website, it was an intimidating prospect to ensure that our website would be accessible.  I didn’t know, and I still don’t know, how to code.  I am a novice.

Still, it was essential our website be accessible.  The following are lessons that we learned along the way that I hope can help make accessibility easier for novice website creators.

Before I get into specifics, it is important to say why accessibility is important.  The first reason is it is the right thing to do.  We are an inclusive society and want to make sure people who have impairments have equal access to the material on our websites.

A more selfish reason is because we want as many people to use and enjoy our websites as possible.  Twenty percent of website users have an impairment, including 10% of men who are color blind.  This is a huge group of people our websites exclude when the sites lack accessibility.  The reason we build websites is to deliver information, tools, and resources for an intended audience.  It makes little sense to exclude one fifth of users.

It also may be the law to ensure websites are accessible.  The 1998 Amendment to Section 508 of the Rehabilitation Act requires that technology purchased by federal agencies be accessible.  While this does not include recipients of federal funds that are not purchased by federal agencies, it is important to know the accessibility laws, regulations, rules, and grant requirements that may apply to any website that is developed.  For instance, the Americans with Disabilities Act prohibits discrimination and requires reasonable accommodations by local and state entities, including in their websites.

Finally, an accessible website is often a better website.  While the most important reason to have close captioning is for people who have hearing impairments, it is also helpful to people who may not have sound on their computer and  for people who simply like to read what they are listening to.   I use close captioning on the treadmill to listen to music while I am watching a sporting event.  Many accessibility features are used by people without specific impairments because of functionality and efficiency.

Once you have made the correct decision to build an accessible website, you will need to plan ahead before building the website.  The more planning done ahead of time, the easier it will be to make an accessible website.  A metaphor I often use is putting in a wheelchair in a house.  It is much less expensive to put the elevator in the house when the house is built than it is to try to put the elevator in during a renovation.

_MG_7910.jpg

PLANNING AHEAD FOR ACCESSIBILITY

Such planning should include:  budgeting for accessibility, planning the layout, content, and functionality of each page, and planning time for making changes and fixes along the way.

Part of any plan should include budgeting for the cost of ensuring the website is accessible.  This will include budgeting for the time it will take to ensure accessibility, hiring an expert to audit the website, and additional time to make corrections after the audit.  You should also make sure that your platform provider knows you will want the website to be accessible and include in the budget time and effort for making changes to the platform to ensure accessibility will be possible and will be part of the cost for the platform.  When it comes to choosing a platform provider, you should investigate how accessible the platform is, whether any additions or special features you will want for your website can be done in an accessible way, and how amenable and responsive the provider will be in making changes based on accessibility.  (We worked with ProBono.net who was very amenable and responsive to making our website accessible).

You also need to know the important features to making a website accessible as you plan the layout of the website.  You will want to pay special attention to the color scheme, ensuring pictures and images are accessible, and how navigation will be done from one page to the next.

Finally, you need to be prepared that you won’t get it perfect the first time.  You will need to make corrections and additional accommodations along the way.  You should plan your budget and time so that you can afford to make the changes after an audit of the website.

How to Learn About Making Your Website Accessible

Before you start planning, and then throughout the process of making your website accessible, you will need to learn and relearn the key components of an accessible website.  The best place I found to start is through LSNTAP’s Guide to Web Accessibility by Liz Leman and Brian Rowe.

The LSNTAP Guide follows the main guidelines for website accessibility created by the World Wide Web Consortium.  The guidelines are called Web Content Accessibility Guidelines version 2.0.  The Guidelines are divided into four main sections, which are the main categories to be concerned about in creating an accessible website:  1. Perceivable; 2. Operable; 3. Understandable; and 4. Robust.

WCAG 2.0 Guidelines include the following:

Perceivable

1.   Text Alternatives

2.   Captioning

3.   Readable content by different devices

4.   Visually and audibly distinguishable

Operable

5.   Keyboard functionality

6.   Provide time to read and use content

7.   Make content so as to avoid seizures

8.   Make sure all users can navigate from where they are

Understandable

9.   Make text readable and understandable

10. Make web pages predictable

11. Help users avoid and correct mistakes

Robust

12. Maximize compatibility with current and future users.

Top Five Tips

Based on these guidelines and experience, I have five top tips for novice website creators.

Tip 1:  Use the Alt Attribute for Images

Make sure that you use the alt attribute for all images on your website.  When you put an image into a website, your platform should give the opportunity to provide information to users who cannot see the image.  Many images on a website do not have a real purpose other than to be decorative.  For instance, on our website we have a lot of people with disabilities.  The pictures make the website more interesting and powerful but it does not convey information.  For decorative images, you should simply input “” in the alt text section so that a screen reader would simply skip the image.  However, if the image provided information the website visitor needed, then you should provide an accurate concise description.  For instance, if the picture was of the Master Card and American Express logos, you might write “Master Card and American Express accepted.”  This can become tricky if you have images that convey some information but are also decorative.  For instance, if a website had a picture of the President addressing the country, it would depend on why the picture was on the website and whether it is meant to convey information.

Tip 2: Captioning is Easy

Captioning videos to ensure that people who visit your website can fully use videos on your website is easy and should be done for every video.  It is particularly easy if you use and embed YouTube or a similar platform that allows for captioning.  You can find a simple guide for captioning on YouTube here.  It is important to make sure to input all of the words rather than allowing YouTube to use its computers to guess what the words are.  It is much more accurate when you input the words.  YouTube has an easy way to enable you to time the words to what is being said in the video.

Tip 3: Color Contrast Early and Often

It is very important in the planning of your website and in adding pages that you test them out to make sure they can be read by people who are color blind.  The easiest way to do this is to use the webaim.org color contrast checker.  This tool allows you to input a foreground color and a background color and ensure that text will be readable with these contrasts.  You can then use WebAim’s Wave tool to provide a link to a web page you are developing to ensure the color contrast is accessible.   For documents that are not publicly accessible, you can use the Wave toolbar through the WAVE Chrome extension.

Tip 4:  Make Sure There is Enough Time to Read and See Web Pages

You need to ensure that all web users have enough time to go through the content on each web page.  To the extent that you have images or content scrolling automatically on a page, there should be a way to turn that function off, adjust it, or extend it.

Additionally, web pages should not have any content that flashes more than three times in a second to avoid seizures.

Tip 5:  Keyboard Accessibility

It is also important that your website is fully functional with a keyboard without requiring specific timing for any individual keystrokes.  This should not prevent using a mouse but instead ensure that if a mouse is not used a person can fully navigate the website.  It is also important that there not be a keyboard trap.  There should not be a place where a person reaches on the website that he or she cannot get back out of or to the next place with the keyboard.

Selecting a Website Auditor

A good website accessibility auditor should be able to do more than just tell you what is wrong with your website.  He or she should be able to tell you how to fix it by providing suggestions as to how to change code, change color contrast or whatever else needs to be fixed.  Auditors are not cheap but you may be able to find one who will provide a non-profit website with a discount or be willing to do part of it pro bono.  We worked with Kathy Wahlbin at Interactive Accessibility, who was an incredible teacher, resource, and adviser.

Use People First Language and Inclusive Images

Your website should not just meet requirements for accommodations but it should also be inviting and respectful to people with disabilities.  For this reason, it is essential to use People First Language.  People First Language puts the person first rather than his or her disability.  This means use the words “person with a disability” rather than “disabled” or “handicapped.”  An individual may be a veteran, a teacher, a lawyer, a mother, or son.  In addition to these attributes, he or she may have a disability.  By calling a person “disabled,” all of the attributes that make up the person will often be lost in this one word description.  The Georgia Council on Developmental Disabilities has a People First Language Page that provides helpful hints.

About Olmstead picture 800 x 300You should also try to include images of a diverse group of people on your website, including people with disabilities.  For OlmsteadRights.org, we had a pizza party and had volunteers with and without disabilities join us for a photo shoot.  They were each willing to sign a release so that we could use their images on the website.  In addition to providing great images of a diverse group of people, it also was a great way to promote the website as people shared that they were on the web pages.

Conclusion

You can have an accessible website.  In order to do so, it will take some time to become familiar with what is needed for accessibility, planning, time to ensure it is done well, and an expert to audit the website and provide recommendations.  While this will take some work, it is worth it to ensure that everyone can visit and use your website.