Over the years Maine CITE has offered a number of training workshops on Accessible Web Design (AWD) and we built this site as a support to those events. But the materials have become rather popular so we’ve kept them here and invite you to feel free to poke around and use what you find. Please also check out the jebswebs blog for more information about this topic.
- HOW-TO: Create accessible forms – The A11y Project
- Tips for Getting Started Developing for Web Accessibility – W3C-WAI.
- Accessibility for Teams – A ‘quick-start’ guide for embedding accessibility and inclusive design practices into your team’s workflow – GSA
- A11y.me – “a11y” is shorthand for accessibility: starts with an “a,” ends with a “y,” 11 letters in-between.
- Myths About Accessible Web Design (an oldie but goodie).
- W3C – WAI – WCAG v 2.1 Quick Reference.
- Section 508 (US Gov site).
- Section 508 (WebAIM site).
- Maine State WAP.
- WebAIM – Web Accessibility in Mind articles.
- Adobe Accessibility.
- Apple Accessibility.
- Microsoft Accessibility.
- HP Accessibility.
- IBM Accessibility.
- Google Accessibility.
- Google Developers: Web Essentials: Accessibility.
- WordPress Accessibility.
- Facebook Accessibility.
- US Dept of Justice – ADA – Web Access Suggestions.
- Twitter – search using #a11y hashtag
General Web Design Resources
See also the Links to Accessible Web and Universal Design found here on the Maine CITE web.
- Link to Accessibility Resources (UMN).
- WAI Resources for Evaluating Web Accessibility.
- University of Washington – DO-IT.
- Microsoft Disability Answer Desk
- Joe Dolson’s AWD Blog.
- Inclusive Design Principles
- Accessibility (#a11y) Rules podcasts
- A11Y Talks on Twitter
- The A11Y Project
- Web Accessibility Tutorials from WAI-W3C
- Accessibility Reviews.
- Web accessibility for seizures and physical reactions – Mozilla.
Content Management Systems
- Word Press Accessibility
- Drupal Accessibility
- Joomla Accessibility
Listservs and Groups
- Web-AIM – newsletter.
- LinkedIn Web Accessibility – Join LinkedIn and search for “Accessibility” groups.
- A11y Weekly – Accessibility Weekly News
Section 508 – Access Board Resources
- Federal Social Media Accessibility Toolkit Hackpad
- 508 Accessible Videos—Why (and How) to Make Them
- Section 508 webinars
Below we have provided a set of websites that provide a full range of free instructional content on web design and related topics. Exploring these sites is a great way to extend the content of this curriculum, particularly for advanced students. Many of these sites are additionally linked throughout the curriculum produced for the AccessIT Web Design and Development Course.
- CSS Zen Garden.
- Listamatic2 (sample stylized lists).
- WebAIM CSS page.
- Eric Meyer.
- Accessible Dropdown Menus by Terrill Thomas.
- HTML 5 – proposed standards .
- HTML 4.01 Specification.
- CSS 2 Specification.
- XHTML 1.0 Specification.
Usability and Accessibility
- Information and Communication Technology (ICT) Accessibility Resource Roundup – from AT3
- Usability 101, by Jakob Nielsen.
- Jakob Nielsen: Ten Usability Heuristics.
- AccessIT – includes a searchable Knowledge Base of accessible technology questions and answers.
- Videos from DO-IT.
- WebAIM Color Contrast Checker.
- Check my Colors.
- Dithering, from Web Style Guide.
- WebAIM on Color Blindness.
- Wellstyled Color Scheme Generator.
- VisiBone Color Chart.
- Visibone Webmaster’s Color Lab.
- Visicheck – Check your website for colorblindess issues.
- Designing UI with Color Blind Users in Mind
Graphics & Copyright
- What is copyright?
- 10 Big Myths about copyright explained.
- Stanford University Copyright and Fair Use Overview.
- United States Copyright Office – Questions and Answers: Copyright and Fair Use.
Accessibility Validators and Tools
- A nice List of Accessibility Testing Tools from The Paciello Group
- A-Checker by ICDR
- Accessibility Checker by Experte
- HTML Codesniffer by SQUIZ.
- W3C HTML Validator – also validates for HTML standards.
- W3C CSS Validator.
- WAVE Web Accessibility Tool.
- WAVE Toolbar Extension for Firefox & Chrome browsers.
- Vox Media Accessibility Guidelines – checklist to help build accessibility into your process.
- Web Site Accessibility Testing Tool from PowerMapper – trial issue with scan a whole site up to ten pages.
- a11yTools Extension for Safari macOS.
- Accessibility Developer Tools – Chrome plugin that works with Chrome Developer Tools.
- ARIA Validator – Chrome plugin to assess WAI-ARIA implementation issues.
- Functional Accessibility Evaluator (FAE) – from University of Illinois – requires creating free account.
- The Accessibility Cheatsheet – bitsofcode.
- Tota11y – helps visualize how your site performs with assistive technologies. Check out the announcement blog post.
- Eiii Page Checker – European Internet Inclusion Initiative.
- ANDI (Accessible Name & Description Inspector) is a free tool from Social Security Administration.
- SortSite – Accessibility Checker and Validator – from PowerMapper.
- Pa11y – has a variety of accessibility testing tools for different situations.
WAI Web Developer Tools
The Accessibility Education and Outreach Working Group (EOWG) has published:
ATAG Report Tool – Project managers, procurers, and others often need to know how well potential authoring tools support accessibility. This new ATAG Report Tool helps authoring tool vendors and evaluators provide that information.
ATAG Overview – Authoring tools are software and services used to create web content – such as content management systems (CMS) and what-you-see-is-what-you-get (WYSIWYG) HTML editors. W3C’s Authoring Tool Accessibility Guidelines (ATAG) addresses making the authoring tools themselves accessible and helping authors create more accessible web content.
There are a number of additional on-line tools available on Web Accessibility Evaluation Tools List published by the WAI. Tools include those that specifically evaluate PDFs, code for mobile devices, color contrast, and readability. Visit the Web Accessibility Evaluation Tools List…
- Heading Structure For Accessibility – by Rakesh Paladugula.
- Heading Tags (H1, H2, H3, P) in HTML – from Penn State.
- Semantic Structure – from WebAIM.
- WCAG Success Criteria.
- Accessible HTML Headings.
- WebAIM – Appropriate use of alternative text.
- Creating Accessible SVGs
- Wikipedia – Alternative text for images.
- Jim Thatcher – text alternatives for images.
- How To Build An Expandable Accessible Gallery
- WebAIM – Creating Accessible Tables.
- Jim Thatcher – Accessible tables.
- Accessify – Accessible Table Builder (actually builds the code for you).
- WebAIM – Creating Accessible Forms.
- Web Standards Project – Accessible HTML/XHTML Forms: Beginner Level.
- HOW-TO: Create accessible forms – The A11y Project
- Jim Thatcher – Accessible Forms.
- HTML Dog – Accessible Forms.
- A List Apart – Prettier Accessible Forms (lots of CSS if you are interested).
- Creating accessible menus-Part 1
- Creating accessible menus-Part 2
- W3C – WAI – Menu tutorial
- GreyGhost – Accessible DropDown Menu
- Inclusive Components – Menus and Menu Buttons
Accessible Audio and Video Content
- “Captioning Video” resource – revised to include “description” for video content and transcripts for podcasts.
TOOLS AND RESOURCES – PODCASTS
- 6 Tips for Improving Podcast Accessibility – 3Play Media
- Podcasts and accessibility: an introduction from the University of Montana
- Captions and Transcripts and Audio Descriptions, Oh My!
- Semi-automated podcast transcription.
- Do It Yourself Transcripts and Captions.
- Diverse and Accessible Podcasts.
- Scribie – Free Podcast Transcription – Note: long waiting list.
- 10 Essential Tools to Record, Edit, Transcribe and Share Podcasts.
- Sonix for Podcasters.
- The Importance of Including Transcripts with your Podcasts. And a swift solution.
RESOURCES AND TOOLS – VIDEO CAPTIONING
- WebAIM – Captions, Transcripts, and Audio Descriptions.
- Captions and Transcripts and Audio Descriptions, Oh My!
- Open vs Closed Captioning.
- Captioning Your Own Video for Free.
- YouTube – Add your own subtitles & closed captions.
- Canvas LMS.
- BlackBoard LMS.
- Zoom – Getting Started With Closed Captioning.
- Captioning video on Facebook.
RESOURCES – DESCRIPTION
- Audio description, caption, and transcript resources – Indiana University
- 3 Play Media.
- AST Caption Synch.
- Audio Description Project – American Council of the Blind.
- How JW Player Approaches Video Player Accessibility – 3Play Media
- Audio Description Associates – Joel Snyder.
- 508 Accessible Videos – How to Make Audio Descriptions.
- Audio Description from Perkins Learning.
- Audio Description Resource Guide – National Library Service.
- Audio Descriptions – At a Glance – YouTube video from Microsoft
- Audio Eyes – vendor
- Caption Max – vendor
- Mind’s Eye – vendor
- WGBH Media Access Group – vendor
PDF CONVERSION TOOLS/SERVICES
Below we have pulled together list of some “tools and services” that can assist in this process of converting PDFs to accessible digital documents. Thanks to Jiatyan Chen of Stanford University, Damian Sian of Princeton University and Tristan Price of Mt. Hood Community College who generated the initial list. Thank you to Krista Greear at Inclusive Instructional Design and Terrill Thomas for some recommendations (revised 8/15/2019). No endorsement of any of these products implied.
Open Access Technologies – This remediation service is delivered via the internet. They take example documents from clients, perform compliance analysis against the WCAG 2 and PDF/UA standards, and re-mediate the files to meet those standards. Clients will able to submit similar PDF documents in bulk to the service, which will make them accessible and return them to the client.
SensusAccess – is a self-service, alternate media solution for educational institutions. SensusAccess allows students, faculty, staff and alumni to automatically convert documents into a range of alternate media including audio books (MP3 and DAISY), e-books (EPUB, EPUB3 and Mobi) and digital Braille. The service can also be used to convert inaccessible documents such as image-only PDF files, JPG pictures and Microsoft PowerPoint presentations into more accessible and less tricky formats.
CommonLook – NetCentric Technologies, a global leader in document accessibility, provides software products and professional services enabling faster, more cost-efficient, and more reliable processes for achieving compliance with the leading PDF and document accessibility standards, including WCAG, PDF/UA, and Section 508. CommonLook software makes the creation, remediation, and management of accessible PDF and Microsoft Office documents easier than ever before.
247 Accessible Documents – On-demand Accessible Documents – Upload a Document and receive an Accessible PDF, Accessible Word Document or an Accessible PowerPoint that meets Accessibility Standards & Guidelines 2.0 in 5 days.
inclüd – Accessible content conversion, creation, and consulting services, inclüd provides institutions with a path to accessible information, ensuring that those with exceptional needs can access content tailor made for them.
Equidox – is an automated solution that simplifies the process of discovering, converting, and publishing PDF documents to WCAG 2.0 compliant HTML.
BrailleWorks – is a solution for repair or remediation of your documents so organizations can meet WCAG and 508 compliance standards. WCAG and Section 508 document compliance can be difficult and navigating these waters is not a job for the inexperienced. Elements of a document such as paragraph structure, tables, charts, lists etc, need to be properly organized and tagged to provide true accessibility.
T-Base Communications – takes one digital file and converts it into every accessible format you need: braille, large print, audio or accessible PDF. Guided automation and QA by our subject matter experts ensures a high-quality end product, consistently.
Microassist – creates, delivers, and hosts custom training for our clients’ internal and external learners with a special emphasis in usability and accessibility.
PubCom – has been developing accessible materials since the mid-1990s, before the US Sec. 508 amendment was passed and put into effect in 2000. They offer a suite of services from custom designed accessible templates to an audit of public-facing documents.
RoboBraille – is accessible 24/7 as a self-service solution and is available free of charge to individual, non-commercial user not affiliated with an institutional setting obligated to provide support (academic institution, organisation, association or similar). Users need not register in order to use the service. The objective is to support and promote self-sufficiency of people with special needs socially, throughout the educational system and on the labour market. As an additional benefit, RoboBraille helps to protect the privacy of of those who need material in alternate formats.
AbleDocs, Inc – makes document accessibility fast, easy, secure, and cost-effective. With best-in-class technology and deep category expertise, Abledocs offers solutions that are compliant every single time.
Accessibility Insights (Microsoft) – When teams first use Accessibility Insights, they sometimes see failures that aren’t immediately clear whether they’re false positives or legitimate accessibility issues. In most cases, investigation has revealed that Accessibility Insights has identified a legitimate accessibility issue. In the few cases where an actual false positive has been discovered, the Accessibility Insights team has quickly fixed it and deployed an update.
Center for Inclusive Design and Innovation (CIDI) – is committed to the promotion of technological innovation and the development of user-centered research, products, and services for individuals with disabilities. As a research and service center within Georgia Tech’s College of Design, we address unmet needs in higher education, government, non-profits, and corporations by providing accessible and inclusive environments for all.
Open Access Technologies (OAT) – is dedicated to helping organizations build fully accessible and usable digital document libraries. OAT’s suite of robust document accessibility tools helps organizations convert and remediate PDF, ePub, Word, Excel, and PowerPoint documents to better serve their customers and comply with mandated accessibility standards, including WCAG 2.1, PDF/UA and Section 508.
Adobe Acrobat Pro DC – The defacto PDF conversion tool. Includes an Accessibilty Checker to assess your PDF files.
axaio MadeToTag – is an Adobe InDesign CS6 to CC plug-in to properly prepare InDesign documents for export as accessible, tagged PDF file – much more easier, faster and more reliable. The tagged PDF complies with the terms of the PDF/UA-Standard, the international standard for universally accessible PDF. PDF/UA is important to all organizations and companies delivering documents which have to be conform to regulations requiring accessible electronic content including WCAG 2.0, Section 508 in the US.
CommonLook Validator – is a 100% Free and Complete Tool for Testing Document Accessibility. The PDF Validator combines CommonLooks’s proven PDF technology and feature set into the perfect tool for testing and validating documents against the leading accessibility standards.
Grackle Docs – is a cloud-based service that can convert Google Doc, Sheet, PDF and Slide into an accessible PDF. Used with Grackle’s Accessibility Checkers, Grackle Docs brings compliance, remediation and version control under one roof.
PDF Accessibility Training
Microsoft PDF Accessibility Training YouTube Videos – This PDF Accessibility training series was provided to Microsoft employees on creating accessible PDF documents. Use these videos, along with documentation from Adobe Accessibility to learn to create, remediate, and check for accessibility issues.
Legal references regarding web accessibility
The following are on-line resources that have listed and documented historic information about legal issues related to web accessibility. Resources include references to legal cases and rule interpretations.
World Wide Web Consortium (W3C) – Web Accessibility Laws and Policies – lists United States and international governmental policies related to web accessibility, although it is not a comprehensive or definitive listing.
Law Office of Lainey Feingold – Legal Updates – The articles listed on this page are about legal developments related to web, mobile (digital), technology and information accessibility. These articles include advocacy initiatives by the Law Office of Lainey Feingold and her co-counsel and clients, and also by other lawyers, organizations, and government agencies.
Resources primarily focused on institutions of higher education
ATHEN – Legal news – Focused on Office for Civil Rights (OCR) complaints and resolutions in that have occurred in higher education.
University of Washington – Legal Cases by Issue – Recent legal actions against higher education institutions related to the inaccessibility of information technology (IT).
University of Minnesota – Higher Ed Accessibility Lawsuits, Complaints, and Settlements – List of higher educational institutions face liability for inaccessible web content and technologies.
Below are some articles and resources discovered over the past few years related to AWD that are some of the better resources:
How to Make Your Charts More Accessible with Color Blind Friendly Palettes
I would like to rename this article, “Everything you ever wanted to know about colorblindness but were afraid to ask…” but the article also includes things you perhaps don’t really want to know about. But if you want to get right to the point, use this link to get to the “key giveaways”… In the meantime, this is a great reference on color blindness – Read How to Make Your Charts more Accessible with Color Blind Friendly Pallets
Truths about digital accessibility
An article by Eric Bailey describing many “truths” about accessibility, how people with disabilities use and access digital content and assistive technologies. A very well written article, Bailey dispels myths, provides incite and explains fully what is happening in the real world when folks access you digital content. This should be required reading for anyone who does this work. Read/view “Truths About Digital Accessibility.”
Universal Design: 11 Practical Tips to Make Your Sites and Apps More Accessible
An article from Shopify discusses how Accessibility has come a long way over the last few years. Practical actions/tips are provided to make you content accessible to all. Read/view “Universal Design: 11 Practical Tips to Make Your Sites and Apps More Accessible.”
Some Accessibility Resources
Freelancer Scott O’Hara who frequently blogs about about UX development with a focus on accessibility has published a list of 13 resources that might be useful to folks wanting to learn more about Accessible Web Design. Read/view “Some Accessibility Resources.”
Tips for Getting Started Developing for Web Accessibility
This page introduces some basic considerations to help you get started developing web content that is more accessible to people with disabilities. These tips are good practice to help you meet Web Content Accessibility Guidelines (WCAG) requirements. Follow the links to the related WCAG requirements, detailed background in the “Understanding” document, guidance from Tutorials, user stories, and more. Read/view “Tips for Getting Started Developing for Web Accessibility.”
Color accessibility: tools and resources to help you design inclusive products
Good summary of the reasons to be concerned about color usage and accessibility in web design plus a number of tests that can be use to assess you design. Read/view Color Accessibility: Tools and Resources…
Tips for making interactive elements accessible on mobile devices
WCAG was recently updated to version 2.1, which includes a whole new section on guidelines for mobile accessibility. There are several new mobile-specific rules, such as rule 1.3.4, that “content should not restrict its view and operation to a single display orientation, such as portrait or landscape, unless a specific display orientation is essential.” This article covers some of the new guidelines that relate to interactive elements on a web page. Read/view “Tips for making interactive elements accessible on mobile devices.”
Assistive technology tools you can test with at no cost
Here’s some advice on what free assistive technology tools are available. Testing on these technologies does not replace an accessibility audit, but by testing early on you can spot potential issues, improve your service and save money. Read/view “Assistive Technology Tools You Can Test with at no Cost.”
Accessibility is Not What You Think
Accessibility is about designing for everybody, not the few. It is not about designing just for the disabled. It is about designing for every one of us…. Read/view “Accessibility is not What You Think.”
Designing UI with Color Blind Users in Mind
While the science behind color blindness is pretty complex, the gist of it is that color blind people have difficulty seeing color clearly or differentiating between some colors. With this in mind, in this article, we’ll share some tips on how you can improve your site’s accessibility and the experience it delivers for color blind people. Read/view “Designing UI with Color Blind Users in Mind.”
A Toolkit for Digital Accessibility
In this webinar, Jack Nicolai, Accessibility Product Manager at Adobe, shares tools, techniques, and best practices to integrate accessibility requirements into your web development and technology projects. Included are: Best practices for documenting accessible workflows; ARIA attributes and content specifically targeting assistive technology, and; Validating accessibility during testing. Read/view “A Toolkit for Digital Accessibility.”
Which accessibility testing tool should you use?
Good article from Paul Stanton in which he tests the major “automatic” web accessibility tools: aXe, SiteImprove, Tenon, WAVE, Lighthouse. He ranks them in order of preference based upon the results generated on a specific page. Read “Which accessibility testing tool should you use?”
Alt-texts: The Ultimate Guide
Recent article that covers all the bases on how and why you need to use Alternative Descriptions for images in digital documents (including the web) and lots of good do’s and don’ts. Read “Alt-Text: The Ultimate Guide”…
The Many Meanings of Headings
Interesting blog post from css-tricks talking about the use of Headings and the debate surrounding. This section, “The Many Meanings of Headings” is part of a larger article called, “The Document Outline Dilemma” which discussed the debate and some of the history. Warning, this is not for newbies! Read “The Many Meanings of Headings”…
Web Accessibility: Tools and Considerations
Nice article by Shaumik Daityai summarizing the “whys” and “whatnots” of Accessible Web Design. Easy to read and full of great screen shots. Check out Web Accessibility: Tools and Considerations…
24 ways to impress your friends
last updated: 10/12/2021