Enable
A place to learn and share with developers what makes web work accessible.
Learn How To Create Accessible Code
Whether you are new to accessibility or are a seasoned veteran, Enable's aim to teach devlopers how to make something accessible and to show why it is. Developers can walk through the code step by step to understand what HTML, CSS and JavaScript are needed to ensure their work "just works" for all users, no matter how they navigate the web.
Add Accessible Code Quickly To Existing Projects
The Enable Accessibility Project follows the First Rule of ARIA when recommending code and encourages the use of native HTML5 functionality whenever possible (as long as browser accessibility support is there). However, since we know there are a lot of developers looking to make their existing custom widgets accessibile quickly due to time constraints, we also show custom code examples and what code features make them work with assistive technology.
Use Pre-built Accessible Components
Enable also includes components that can be included into your own projects via NPM, with instructions how to integrate them as Webpack modules, native ES6 Modules or as old school ES4 JavaScript libraries. Accessible hamburger menus, carousels and mobile friendly skip links, are only a few examples of prebuilt code you can use in your projects today. We also encourage developers to consider contributing their own code to us for the benefit of the developer community at large.
What Makes Enable Different?
- We strive to keep our codebase up-to-date, with a focus on innovation (some of the examples have not appeared on any other site before).
- The components have been tested on mobile devices (a lot of other components forget that screen readers on mobile devices work slightly differently to their desktop cousins).
- Enable is focused on UX. It's goal is to help developers make an accessible web that is usable by everyone.
- Not only do we want to help developers, but we want the help from developers to contribute their accessible code. If you have an accessible component that you don't see here, please consider donating by raising a pull request.
Want to donate code to Enable?
We would love to know about any code you would like to donate to enable!
- If you would like to discuss this with us first, please go to the Enable Github issue page and opening up a new issue describing the code you would like to donate and a sample page on how it works.
- If you would like to submit a PR, feel free to do so! Please read the Github article about creating a pull request from a fork for more information on how to do this.
Found a bug?
Feel free to log a bug on our Github project page! If are a developer and know how to fix, please create a PR (if you have never done this before, read the the Github article about creating a pull request from a fork).