Add Accessibility
It is important that you add accessibility to your site to make it easier for people with disability to use your web site. It is also important to have the proper headings, links and tables as well as good color contrast.
Add Accessibility to Images
You can add alternative text to each descriptive image so that it can be read by a blind user who is using a screen reader to “hear” the alternative text and other content on your site.
- Open the Home page and click on an image.
- Right-click and select Edit Image Properties to open its dialog box.
- Optionally, in the Tooltip field add a tool tip.
- If the image is decorative, in the Alternative Text field don’t add anything; otherwise, add an alternative text.
TIP: Don't add the phrase "image of" or "picture of" when writing the alt text. Most screen readers will announce that the object is an image. So if you typed "An image of a cat." as the alt text then the screen reader will announce "image of image of a cat." However, it's alright to use descriptive phrases like "illustration of", "painting of", "drawing of", "blueprint of", "stecth of" or something similar.
- Repeat for EACH descriptive image on the page.
- Repeat the previous steps for EACH page in your site.
Check For Accessibility
While most web sites have the following elements, they may not have the “proper” format so that it can be read correctly by an Assistance Technology (AT) software like a screen reader (e.g., JAW, NVDA, VoiceOver).
- Proper Heading Levels that are nested correctly (e.g., h1, h2, h3)
- Proper Alt Text on images (See above)
- Proper Color/Contrast Ratio (Use color analyzer tool like the Colour Contrast Analyser from ThePacilloGroup)
- Proper Link names (Don't use "Click here..." links rather use links with meaningful name to where links are going)
- Proper Table Headings (Table column headings and row headings that describes table cells below and to the right of them)
- Proper Bullet Lists (Instead of a series of sentences with related content)
Additional things that you can do to make site accessible:
- Add some type of highlight for form fields and buttons. For example, you can add a small border when a form element is in focus either by a user tabbing to it or clicking on a form element.
- Add open or closed captions for videos.
- Add alternating row colors for long tables.
- Add multiple columns instead of a long stretch of text. Rule of Thumb: Text should not span longer than a dollar bill.