Accessibility Fundamentals : From the Webinar

Website accessibility is a large complex issue with design, technology, legal and content concerns to contend with. We have had many events and webinars on the subject to help educate nonprofits about website accessibility. In this blogpost you will find a small part of one of these webinars.

Breaking Down Accessibility Fundamentals

This section covers the fundamental areas of website accessibility and what to look for. This is a great place to start if you want to learn more about how to implement accessibility features in your website.

Website Platform and Structure

The platform your website is built on and it's basic structure can have a huge impact on website accessibility. Hopefully you have a website built on a platform that inherently has few out-of-the-box accessibility issues and is flexible enough to build a website that is both engaging and accessible.

The basic structure of your website should also contain some key accessibility features like defining the language, viewport, navigation and content areas. Pages should make use of navigation, section and heading tags to help screen readers easily navigate the site.

Key Website Platform and Structure Features

• Website CMS platform with good support for accessibility features
• No major accessibility issues baked into your CMS
• Viewport / language definition
• Skip to content feature
• Clear definition of navigation VS content
• Good use of heading tags

Website DESIGN

Website design is often the area nonprofits struggle with the most when it comes to accessibility. Most organization's brand colors and design aesthetic are not very accessible. You may need to add some additional colors to your website pallet to create a more accessible design, or limit the use of proprietary fonts, imagery, icons or other design elements.

The main areas you want to pay close attention to are site contrast, font usage, button and link design. Logos and any design element that aren't key to the understanding or usage of the website are exempt from accessibility standards but it's always a good idea to consider accessibility even for exempt items.

Key Website Design Accessibility Features

• Meet minimum contrast requirements in design
• Meet minimum font size and contrast requirements
• Have high contrast buttons and links
• Use descriptive button text and link anchor text

Website CONTENT

Having good accessibility for your website content is absolutely critical, as most visitors are going to your site for the purpose of consuming content. All your images should have good descriptive ALT tag content, videos and other multimedia should have closed captioning and transcripts, and external files like PDFs or other documents should be checked for accessibility issues.

Key Website Content Accessibility Features

• Descriptive image ALT tags
• Closed captioning and transcripts
• PDFs and other file downloads should be accessible

Website Functionality

How your website functions and it's interactive features is another important area of website accessibility. Forms, image sliders, popups, chat and other interactive features should all be checked for accessibility. All form fields should have the proper label coding and buttons or other forms controls need to have descriptive text. If your forms are very complex and have validation and other features that rely heavily on scripting code you may need to implement ARIA tags. Popups can be especially troublesome for accessibility if they don't receive "focus" on activation.

Key Website Functionality Accessibility Features

• Label text / code for all form fields
• Good button and form control text
• ARIA coding for complex interactive forms
• Proper focus coding for popups or other full screen elements