Essential Tools for Inclusive Coding

Hello everyone, I'm Scott Vinkle, a front end developer and accessibility advocate at Shopify.

During this 1-day workshop we'll be covering quite a few different topics. All of which will be focused on usability, accessibility, and inclusive thinking in design and development.

Essentially what we'll be discussing is common accessibility issues found in design and development, how they affect different user groups, and ways to overcome the barriers introduced for people with disabilities.

We'll also be fixing up a small blog website that is ripe full of accessibility issues! Throughout the day we'll be looking at various issues and ways to make sure the site is accessible and inclusive for everyone!

The topics we will discuss include:

1. What is accessibility?
2. Understanding Disabilities
3. The four principles of accessibility
4. Keyboard
5. Semantic HTML
6. Testing with screen readers
7. Page title
8. Page structure
9. Image alt text
10. Links vs Buttons
11. Skip links
12. Color contrast
13. Forms
14. Proximity/text zoom
15. Responsive design
16. Offscreen content
17. Animation
18. ARIA
19. Dynamic components

For the workshop you'll need:

• A laptop running the latest macOS or Windows with your favorite browser and text editor installed
• If you are using a Windows computer, please install NVDA screen reader
• The demo site source files – unzipped and loaded in your editor

Some of the exercises will require:

• Knowledge of HTML and CSS
• Experience with JavaScript and jQuery

Before we get started, let's review this video on digital inclusion to help set the tone for the forthcoming content.

• Apple – Accessibility – Sady

The key takeaway here is when we design and develop with an inclusive mindset, we can make any product work well for everyone, including people with disabilities.

“The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.”

— Tim Berners-Lee, W3C Director and inventor of the World Wide Web

This project and its source code is licensed under the MIT license.