A11y Beyond the Theory: Integrating Accessibility Testing Into Your Workflow

Rate this content
Bookmark

A practical look at automating core accessibility testing and integrating it into your workflow.

Lucky Nkosi
Lucky Nkosi
24 min
15 Nov, 2023

Comments

Sign in or register to post your comment.
  • Abdulrahman Yusuf
    Abdulrahman Yusuf
    Amazing talk you had there, Lucky. I really enjoyed it and learned a ton about the tools and technologies we can use to ensure our apps are more accessible to everyone.

Video Summary and Transcription

Ntandala Kengose, a software developer, emphasizes the importance of accessibility in software development and the responsibility it carries. The Web Content Accessibility Guidelines (WCAG) provide technical guidelines for making web content more accessible. Ntandala shares various accessibility testing tools and highlights the need for automation in testing. Tools like Pelly CI and GitHub Actions can be used for automated accessibility testing and CI integration. The X-Accessibility Ginter and Husky are tools that provide insights and ensure accessibility in development.

1. Introduction to Ntandala Kengose

Short description:

Hello, everyone. My name is Ntandala Kengose. I am a software developer from Johannesburg, South Africa. I work for PbD, a global software development firm. I'm part of the ATC unit, responsible for specialized consulting and training. Follow me on Twitter at unlikely underscore.

Hello, everyone. My name is Ntandala Kengose. I am a software developer, among many other people. I am giving this talk from the beautiful city of Johannesburg, where I was born, raised, and live till today.

Now, if you have no idea where Johannesburg is, it is a big city, not the capital, but definitely the economic hub of the beautiful country known as South Africa. And if you're not entirely sure where South Africa is, well, it's simple. It's in the to look at it. We are at the southern tip of beautiful continent of Africa. Now, this should be showing you that when they said that some of the most difficult things in computer science is naming things, they definitely didn't think about South Africans, because clearly we're really good at this.

As I said, I am a software engineer, and I work for a company called PbD. And again, because we're good at naming things, PbD stands for the founders. Now, PbD started about thirty nine years ago, right here in South Africa by three engineers. And we've now grown to be a global bespoke software development firm with probably about one thousand two hundred professionals spread across seven cities all over the world. We deliver bespoke software solutions into a number of sectors. But my job is slightly different from everyone else at PbD. That's because I work in a unit we call ATC. In paper we're responsible for a number of things, such as what we call specialized consulting. We are responsible for training PbD's 1000 plus employees. We're responsible for also doing community engagements and a whole bunch of other things that are quite interesting. I love community. And to fuel this passion, I also am involved with number of meetups around Johannesburg.

None of this matters. The most important thing for you to know about me is that my Twitter handle, X, is at unlikely underscore. Please feel free to follow me, let me know what you think of this talk. Let me dive straight into it. I turned 32 days before the recording of this video. Now, with this new age, I've realized that I need to start looking after myself a bit better. I need to get back into fitness and try and look after my health and what I eat. So a friend of mine strongly suggested that I try the gym. Now, there's a couple of problems with the gym.

2. The Importance of Accessibility

Short description:

I injured my knee while playing soccer and it made me realize the importance of accessibility. I experienced a temporary disability and struggled with inaccessible designs. The responsibility for accessibility lies with everyone involved in the software development life cycle. It's not enough for solutions to work on one machine. Accessibility affects the bottom line.

That's because it can be quite intimidating when you walk in and you see all of the heavy equipment and some of the things that people are doing can just be daunting. So I decided to go back to things that I actually enjoy, which is sports, two sports in particular, rather, namely football and soccer. And no, I don't mean it like this, I mean it more like this because I seem to be really, really prone to injuries.

I play two sports, one where the players are known for faking their injuries, and the other way the riders are really known for trying to avoid their injuries and getting back onto their horse. So take a wild guess as to which one of these two sports ended up or resulted in me having this knee brace on my knee for over three months. It's soccer. I had a minor incident, and I ended up damaging my knee.

Now, something interesting started happening after this injury. I started being very, very grumpy. My friends said it was just old age creeping in, but I realized that something else was happening. I was starting to experience the world like never before. I was experiencing it as someone who couldn't walk as long as I normally do, and I realized that I was actually experiencing a temporary disability and that this was making inaccessible designs around me much clearer. And all of those things were now starting to affect and frustrate me.

And the first thing that really, really, really made me angry was the shopping mall. I live about a block away from one, and I've always thought that it had parking all around it and was a great experience to go to. I hated it because when people think accessibility, all they think about is ramps. And I found these ramps everywhere, and I don't know if you've ever tried, but walking with crutches on a ramp is really, really difficult. And I struggled a lot. I was so furious and I did what every normal person would do, try and figure out whose responsibility is it. And now that I was faced with my own physical limitations and trying to figure out who to blame, it dawned on me. I started reflecting about whose responsibility it is to ensure that the solutions we build are as accessible to as many people as possible.

And to answer this, I think we just need a quick, common working definition of what we mean by accessibility. Well, firstly, A11Y is a numeronym where the 11 stands for, it represents the 11 letters in the word accessibility. And the major dictionaries really gravitate towards this general definition, where they define accessibility to be the quality of being easily reached, entered or used by people who have a disability. If we bring our focus much closer to home, we see that web accessibility means that websites, tools and technologies are designed and developed so that people with disabilities can use them. More specifically, that they follow the PAW principles, which means that people can perceive them, understand, navigate and interact with the web that we build.

So to simply answer the question, the answer is that it's everyone's responsibility, everyone that is involved in the software development life cycle. We have long agreed that it works on my machine is simply not enough. So I've always wondered why we're so comfortable with shipping solutions that work for some people and not necessarily others. And every time I've been engaged in conversations around accessibility, it's often treated as a nice to have, but what we don't realize is that it actually affects the bottom line.

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Accessibility at Discord
React Advanced Conference 2021React Advanced Conference 2021
22 min
Accessibility at Discord
Atomic Deployment for JS Hipsters
DevOps.js Conf 2024DevOps.js Conf 2024
25 min
Atomic Deployment for JS Hipsters
Deploying an app is all but an easy process. You will encounter a lot of glitches and pain points to solve to have it working properly. The worst is: that now that you can deploy your app in production, how can't you also deploy all branches in the project to get access to live previews? And be able to do a fast-revert on-demand?Fortunately, the classic DevOps toolkit has all you need to achieve it without compromising your mental health. By expertly mixing Git, Unix tools, and API calls, and orchestrating all of them with JavaScript, you'll master the secret of safe atomic deployments.No more need to rely on commercial services: become the perfect tool master and netlifize your app right at home!
Effective Performance Testing to your Server with Autocannon
TestJS Summit 2021TestJS Summit 2021
36 min
Effective Performance Testing to your Server with Autocannon
Top Content
Performance testing expertise that is developed for a long time. In order to measure your server performance you need a tool that can efficiently simulate a lot of abilities and give you good measurements according your analysing criteria.Autocannon NPM library gave me exactly that - that library is super easy to install and has a very simple API to work with. Within a really short amount of time you can start do performance testing to your application and get good measurements in development environment and in your performance labs, and generate complicated testing scenarios.In this talk I will introduce Autocannon, explain how to efficiently analyse your server performance with it, and show how it helped me to understand complicated performance issues in my Node.js servers. At the end of this lecture, developers will be able to have the ability to integrate a fast and easy tool in order to measure your server performance.
Configuring Axe Accessibility Tests
TestJS Summit 2021TestJS Summit 2021
30 min
Configuring Axe Accessibility Tests
Top Content
Axe-core is a popular accessibility testing engine that is used Google, Microsoft, and hundreds of other companies to ensure that their websites are accessible. Axe-core can even integrate into many popular testing frameworks, tools, and IDEs. In this advanced session, we'll be learning how to configure axe and its integrations to fine tune how it runs and checks your pages and code for accessibility violations.
Delightful Integration Tests With Testcontainers
TestJS Summit 2022TestJS Summit 2022
21 min
Delightful Integration Tests With Testcontainers
Top Content
Dockerized services are an excellent tool for creating repeatable, isolated environments ideal for integration tests. In this session, we'll look at the Testcontainers libraries which provide flexible and intuitive API for programmatically controlling lifecycle of your service dependencies in Docker containers. Running databases, Kafka, Elasticsearch, and even cloud technologies, straight from your test code ensures environment config is always up-to-date and consistent during local development and in CI pipelines.You’ll learn everything necessary to start adding powerful integration tests to your codebase without the headache of managing external service dependencies manually!
Visual Regression with Puppeteer, Playwright and Cypress
TestJS Summit 2021TestJS Summit 2021
9 min
Visual Regression with Puppeteer, Playwright and Cypress
Top Content
Visual Regression tests components via screenshot matching. I'll show how you do that in three different libraries/frameworks. Additionally, I will use Storybook to extract the components from your SPA choice.

Workshops on related topic

Web Accessibility for Ninjas: A Practical Approach for Creating Accessible Web Applications
React Summit 2023React Summit 2023
109 min
Web Accessibility for Ninjas: A Practical Approach for Creating Accessible Web Applications
Workshop
Asaf Shochet Avida
Eitan Noy
2 authors
In this hands-on workshop, we’ll equip you with the tools and techniques you need to create accessible web applications. We’ll explore the principles of inclusive design and learn how to test our websites using assistive technology to ensure that they work for everyone.
We’ll cover topics such as semantic markup, ARIA roles, accessible forms, and navigation, and then dive into coding exercises where you’ll get to apply what you’ve learned. We’ll use automated testing tools to validate our work and ensure that we meet accessibility standards.
By the end of this workshop, you’ll be equipped with the knowledge and skills to create accessible websites that work for everyone, and you’ll have hands-on experience using the latest techniques and tools for inclusive design and testing. Join us for this awesome coding workshop and become a ninja in web accessibility and inclusive design!
Automated accessibility testing with jest-axe and Lighthouse CI
TestJS Summit 2021TestJS Summit 2021
85 min
Automated accessibility testing with jest-axe and Lighthouse CI
Workshop
Bonnie Schulkin
Bonnie Schulkin
Do your automated tests include a11y checks? This workshop will cover how to get started with jest-axe to detect code-based accessibility violations, and Lighthouse CI to validate the accessibility of fully rendered pages. No amount of automated tests can replace manual accessibility testing, but these checks will make sure that your manual testers aren't doing more work than they need to.
Web Accessibility in JavaScript Apps
React Summit 2022React Summit 2022
161 min
Web Accessibility in JavaScript Apps
Workshop
Sandrina Pereira
Sandrina Pereira
Often we see JavaScript damaging the accessibility of a website. In this workshop, you’ll learn how to avoid common mistakes and how to use JS in your favor to actually enhance the accessibility of your web apps!
In this workshop we’ll explore multiple real-world examples with accessibility no-nos, and you'll learn how to make them work for people using a mouse or a keyboard. You’ll also learn how screen readers are used, and I'll show you that there's no reason to be afraid of using one!
Join me and let me show you how accessibility doesn't limit your solutions or skills. On the contrary, it will make them more inclusive!
By the end, you will:- Understand WCAG principles and how they're organized- Know common cases where JavaScript is essential to accessibility- Create inclusive links, buttons and toggleble elements- Use live regions for errors and loading states- Integrate accessibility into your team workflow right away- Realize that creating accessible websites isn’t as hard as it sounds ;)
Automated Testing Using WebdriverIO
TestJS Summit 2022TestJS Summit 2022
163 min
Automated Testing Using WebdriverIO
Workshop
Kevin Lamping
Kevin Lamping
In this workshop, I cover not only what WebdriverIO can do, but also how you'll be using it day-to-day. I've built the exercises around real-world scenarios that demonstrate how you would actually set things up. It's not just "what to do," but specifically "how to get there." We'll cover the fundamentals of Automated UI testing so you can write maintainable, useful tests for your website and/or web app.
JS Security Testing Automation for Developers on Every Build
TestJS Summit 2021TestJS Summit 2021
111 min
JS Security Testing Automation for Developers on Every Build
WorkshopFree
Oliver Moradov
Bar Hofesh
2 authors
As a developer, you need to deliver fast, and you simply don't have the time to constantly think about security. Still, if something goes wrong it's your job to fix it, but security testing blocks your automation, creates bottlenecks and just delays releases...but it doesn't have to...

NeuraLegion's developer-first Dynamic Application Security Testing (DAST) scanner enables developers to detect, prioritise and remediate security issues EARLY, on every commit, with NO false positives/alerts, without slowing you down.

Join this workshop to learn different ways developers can access Nexploit & start scanning without leaving the terminal!

We will be going through the set up end-to-end, whilst setting up a pipeline, running security tests and looking at the results.

Table of contents:
- What developer-first DAST (Dynamic Application Security Testing) actually is and how it works
- See where and how a modern, accurate dev-first DAST fits in the CI/CD
- Integrate NeuraLegion's Nexploit scanner with GitHub Actions
- Understand how modern applications, APIs and authentication mechanisms can be tested
- Fork a repo, set up a pipeline, run security tests and look at the results
Security Testing Automation for Developers on Every Build
GraphQL Galaxy 2021GraphQL Galaxy 2021
82 min
Security Testing Automation for Developers on Every Build
WorkshopFree
Oliver Moradov
Bar Hofesh
2 authors
As a developer, you need to deliver fast, and you simply don't have the time to constantly think about security. Still, if something goes wrong it's your job to fix it, but security testing blocks your automation, creates bottlenecks and just delays releases, especially with graphQL...but it doesn't have to...

NeuraLegion's developer-first Dynamic Application Security Testing (DAST) scanner enables developers to detect, prioritise and remediate security issues EARLY, on every commit, with NO false positives / alerts, without slowing you down.

Join this workshop to learn different ways developers can access NeuraLegion's DAST scanner & start scanning without leaving the terminal!

We will be going through the set up end-to-end, whilst setting up a pipeline for a vulnerable GraphQL target, running security tests and looking at the results.

Table of contents:
- What developer-first DAST (Dynamic Application Security Testing) actually is and how it works
- See where and how a modern, accurate dev-first DAST fits in the CI/CD
- Integrate NeuraLegion's scanner with GitHub Actions
- Understand how modern applications, GraphQL and other APIs and authentication mechanisms can be tested
- Fork a repo, set up a pipeline, run security tests and look at the results