If your applications aren’t usable by people with disabilities, your job isn’t done.
It is your responsibility to deliver high-quality applications that work as expected for as many users as possible.
There is no magic wand that you can wave and create accessible applications.
There is no single tool that will make these challenges go away.
To build accessible applications, your team needs to make accessibility a priority.
Most importantly, your team needs to acquire an accessibility mindset shift.
The AccessibilityMindset Shift
Ensuring your application is accessible requires a mindset shift— not just for you as a developer but also for your designers and the stakeholders in your organization.
Each of these areas brings its own set of challenges:
How should I prioritize application features?
What can I do to ensure my solutions work for people with disabilities?
How do I get buy-in from my team?
How do I approach working through accessibility issues that I don't even know I have?
These questions typically require years of hard-won experience to answer and are even harder if you're just getting started.
Work needs to be done on both the technical skills and people-skills parts of the business to deliver accessible features and functionality to your users.
Plan and Execute in EveryArea of Web Accessibility
- Build Your Accessibility FoundationLearn the common vocabularyUnderstand the business case for accessibility
- Develop an Organizational Culture of AccessibilityRecognize potential issues before writing a line of codeEnable focused cross-team collaboration
- Identify Issues in Your Web ApplicationUse industry-standard toolsEmpower non-developers to identify accessibility issues
- Best Practices from the StartDevelop complex interactions that fully support Assistive TechnologyImplement automated testing that prevents issues from being deployed
I signed up for the workshops to get coherent and collected information from a leader in the space. Besides a wealth of usable knowledge I can apply to projects I currently work on, the most significant benefit was a transformation of how I understand what a user interface is and the complexity that is often overlooked. Marcy is an amazing instructor and has a deep understanding of the topic within real-world applications.— Adam H., Senior Web Developer
A Repeatable, Well-Defined Process for Accessibility Testing
Get accessibility buy-in from stakeholders and colleagues through effective manual and automated testing plans.
Identify the highest value user flows in your application.
Document “mouse only” and “keyboard only” instructions for completing the flow, supplemented with expected output from browser-based accessibility tools.
Write focused unit tests for every interactive control involved in a user flow to ensure they meet industry-standard accessibility guidelines.
Simulate a user working through the most important flow through integration testing.
Build Confidence and Pride in Your Skills
“Because WCAG said so” is a better reason for making a decision than none at all, but it’s not the most compelling argument.
Practice testing, refactoring, and implementing accessibly from scratch and you will develop a deep understanding of why standards and guidelines are set the way they are.
You will be able to show, not just tell.
Build the confidence that you can demonstrate, describe, and develop accessible approaches to important interactions.
Accessibility is your opportunity to make an impact.
Not only for the people using your web application who have a civil right to access, but in your career as well.
Organizationally I'm seeing more awareness of thinking about accessibility, shifting accessibility left in the process, as well as attention paid to fixing accessibility issues. I've gotten a lot of value from every Marcy Sutton course I've attended, and I hear the same from others.J. Decker, Director of Product Strategy/Accessibility Lead
Stop Relying on Guesses
What if your team had concrete blueprints for design reviews and user testing procedures, as well as techniques and templates for conversations with different departments in your organization?
What if your team had everything they needed to create inclusive web applications and become accessibility champions in your organization?
What if your team could identify and remediate accessibility issues in an application and prevent them from happening again?
That’s precisely what Testing Accessibility will deliver for you and your team.
The lessons in Testing Accessibility are based on years of work in the field at organizations of all sizes.
Apply what you learn and you will transform the way your organization approaches accessibility.
Accessibility matters to me and our team. I signed up for Marcy’s workshop out of a never-ending thirst for learning. The content was great, relevant and we learned just enough while not feeling overwhelmed. I’ve realized I know more than I give myself credit for. I also got to experience a full spectrum of tools which was nice to compare.Gerardo Rodriguez, Senior Front End Developer
Three Steps to Becomingan Accessibility Pro
- Understand Accessibility EssentialsDive into the components and standards of web accessibility and how to best utilize them. Hone your skills of recognizing issues in the design phase and suggesting alternative approaches.
- Learn to Test Existing ApplicationsDevelop expertise with the same testing tools used by the pros. Write real-world unit and integration tests that ensure the accessibility of your application.
- Build Accessibly From the StartProperly use semantic elements and ARIA. Understand methods of hiding elements with CSS and when to use which. Programmatically supply accessibility information to Assistive Technologies.
I have become the 'accessibility expert' for my small team. Marcy directed me to multiple tools that I use regularly such as Parallels as well as the Chrome extensions Web Developer and Accessibility Insights for the web. I am able to test my site on the NVDA/Chrome combo most often used by those with screen readers. I'm able to recognize focus traps and have been given good insights on how to handle those situations. She talked through her thought process a great deal, which helps me when I start thinking about how I'm going to solve accessibility fixes.Desiree Bradish, Software Developer
Identify Dealbreakersin the Design Phase
Accessibility requires a lot more than code.
For accessibility to be successful, we need to make it a core part of the product design process, addressing it in the design phase.
The reality is that designs that developers are given to implement don't always cover all of the aspects of what makes an application accessible. There’s an art to evaluating visual designs and mockups for potential issues.
Some questions can be answered with a yes or no:
Do color combinations have an accessible contrast ratio?
Other questions require a bit more thought and understanding of the nuances:
Who can we talk to with personal experience of the disabled user impact for this pattern?
What happens as the size of the viewport shifts?
It is critical that you can provide detailed explanations and suggestions to ensure the collaborative design process is as inclusive as possible.
Prevent Barriers to Access
There’s more to accessibility than just adding some attributes to your tags. The Americans with Disabilities Act puts it best:
Accessibility is about removing barriers to access.
If the core function of your application can’t be completed without using a mouse, there is a barrier to access.
Menus, modals, and forms are some of the most common widgets on the web.
Just because a pattern is popular doesn’t mean it has been implemented accessibly (or that it’s the best solution in the first place).
Your team has to be equipped with the knowledge to build their own accessible interactions that work intuitively with keyboards and screen readers.
You need to understand the considerations for the semantic structure of your markup, the elements you use, and how CSS choices impact the user's experience on your site.
Keeping a component library for your application is a great way to test the parts of your application in different states without having to click through your app. This is also useful for working with components you bring in from a design system.
Be deliberate with testing your web application, and the barriers to access will fall.
Discover and Fix IssuesBefore Your Users Find Them
Automated testing alone can’t find everything.
Your team needs a testing workflow that will help them discover and fix issues before they ship to production. You need to be familiar with all of the industry-standard tooling, and know how to best audit the applications you build.
In order to make a lasting change and adopt an accessibility focus across your organization, your team needs to know how to prioritize, develop a process, and effectively communicate– even if it means pushing back on designs or "managing up" in certain situations.
Testing Accessibility is the Complete Course For Shipping Accessible Web Applications
Testing Accessibility gives you the knowledge and skills you need to ensure your web app is accessible and usable for all– From the first stages of a visual design, all the way through requiring tests to pass before deployment.
- DesignIdentify potential issues with the look and proposed interactions of a web application before writing a single line of code.
- BuildStructure the correct elements and attributes to enable the best possible experience for people using screen readers and other Assistive Technologies.
- TestUse the best tools for identifying issues in any web app. Expand your automated test suites to ensure your components meet accessibility guidelines.
- ShipBlock your web application from being deployed if any tests fail through implementing continuous integration.
Hi, I'm Marcy Sutton
I'm an award-winning accessibility specialist and freelance web developer. In this self-paced workshop, you will benefit from my years of experience as a senior engineer and educator as you learn how to build a culture of accessibility at your organization.
6 Workshops Designed to Maintain a Focus on Accessibility No Matter Where You Are in The Development Process
The six self-paced workshops in Testing Accessibility are a hybrid of carefully crafted text instruction, supporting video with transcripts, and learning challenges with worked-out solutions.
Testing Accessibility is the distillation of years of experience training hundreds of developers in live and remote workshops, mixed with my real-world experience in accessibility consulting at organizations of all sizes.
It’s like attending a live workshop, but with the benefit of learning on your own time. No more timezones or scheduling difficulties– learn as you have the time.
Just because the workshops are self-paced doesn’t mean they’re only passive reading. Testing Accessibility is designed to put you in the driver's seat and challenge you to do the work. Each module contains carefully crafted learning challenges that will help you cement your learning.
Whether you’re a staff-level developer or just getting started, you’ll come away with a deeper understanding of how to build accessible web applications.
The Workshops in TestingAccessibility Include:
Foundations of Accessibility
An introduction for technologists of all roles, skills, and experience levels. Learn the definitions and motivations for accessibility, including making a business case in the global market. You’ll also dive into the essential components of accessibility, setting the scene for the following workshops in the series.
Design Thinking and People Skills for Accessibility
Ensure the application designs you implement are usable for all by learning how to watch for potential issues before they happen and tactfully discuss alternative approaches. There is also guidance on how to create and adopt a culture of accessibility in your organization.
- Accessibility as User Experience
- Collaboration on Designs and Prototyping
- Animation and Design Impacts on Accessibility
- Finding Answers to Accessibility Issues
- Creating a Culture of Accessibility
Manual Accessibility Testing
From keyboard testing to browser DevTools and web extensions, manual accessibility testing is more powerful than ever. In the Manual Testing workshop module, you'll learn recommended testing steps and accessibility requirements used by the pros, so they become second nature. You'll practice testing the CampSpots app and fixing the issues you find.
- Keyboard Testing
- DevTools Testing
- Accessibility Browser Extensions
- Zoom Testing
- Screen Reader Testing
- Issue Remediation
Semantic Markup with HTML and ARIA
Accessibility best practices can be baked in from the start. Learn my approach to plumbing accessibility information into sites by following along as we implement accessible parts of the CampSpots application from scratch. This workshop includes features specific to React applications but is applicable to any web application.
- Headings and Landmarks
- The “When” and “How” of ARIA
- Accessible naming
- Programmatic Accessibility Information
- The AOM (Accessibility Object Model)
- React Hooks and Portals
Coding Accessible Interactions and Mechanics
Continuing with building for the CampSpots application, but this time with a focus on ensuring interactive components are usable by keyboard and screen reader users. You’ll also practice building accessible versions of common components from scratch using React.
- Accessible navigation and skip links
- CSS visibility and impact on assistive technologies
- Adding ergonomic keyboard interactions to a date picker component
- Focus management with key events
- Announcements with assistive technology
- Advanced scripting with ARIA
- React Hooks and Refs
Automated Accessibility Testing
Writing reliable automated tests that assert things like keyboard operability, ARIA states, and other common accessibility requirements we can bake quality into your applications and potentially help you sleep better at night. Learn about the many automated tools at your disposal and their strengths and weaknesses to gain an understanding of how to configure accessibility tests that serve your team’s needs.
- Cypress and Cypress Component Testing
- Automated Browser-based Snapshot Testing
- Continuous Integration
A Learning Experience Designed Through Testing and Developing a Real-World Application
Throughout the Testing Accessibility workshop series, you’ll get hands-on experience identifying and remediating a plethora of issues in the application.
Identifying missing image alt attributes with a linter in VSCode, troubleshooting page landmarks with a browser extension, and managing roving
tabindex with React’s
useState hook are just a few examples of the things you’ll experience in the workshops.