NSPCC Accessibility Testing Framework

A slide from the Accessibility Toolkit providing an overview of disabilities

1. Project Overview/Introduction:

Creating accessible websites is not a one-time fix, but an ongoing process. Organisations need the tools and knowledge to manage accessibility and create inclusive digital experiences.

This project partnered with the NSPCC, a leading children's charity in the UK, to develop an internal accessibility testing framework. This framework empowers their team to independently monitor and maintain website accessibility, reducing reliance on external resources and ensuring a consistently inclusive user experience for all visitors, including those with disabilities.

This project followed a prior UX review of their eCommerce store that I had conducted, where accessibility was identified as a key area of focus for the NSPCC.   

2. The Challenge/Problem:

Following my comprehensive UX review of the NSPCC's e-commerce store, the client expressed a strong desire to further enhance their website's accessibility. While the UX review touched upon accessibility issues, the NSPCC recognized the need for a more proactive and sustainable approach.

They wanted to empower their internal team to conduct regular accessibility checks and address any emerging issues independently. This desire stemmed from a need to both improve the user experience for people with disabilities and to future-proof their website against evolving accessibility standards.

They needed a solution that would allow them to regularly assess and improve their website's accessibility without constant reliance on external audits. This approach would not only be more cost-effective but also provide them with greater control and agility in addressing any accessibility issues that arose. Failing to maintain accessibility could lead to the exclusion of users with disabilities, potential legal repercussions, and negative impacts on their brand reputation.   

3. My Role:

As a UX Consultant and Accessibility Specialist, building upon my prior UX review, I was responsible for:

• Developing a user-friendly accessibility testing framework and toolkit.

• Creating and delivering a training presentation on web accessibility principles and best practices.

• Providing guidance and support to the NSPCC team on using the toolkit.

4. The Process:

This project followed a structured approach to ensure the delivered solution met the NSPCC's needs and was practical for their team to use.

• Context from UX Review: This project directly stemmed from a prior UX review I conducted for the NSPCC's e-commerce store. This prior work provided a valuable foundation for this project, allowing me to build upon existing knowledge of their website and internal processes.

  
  

• Accessibility Training Presentation: A key component of the project was educating the NSPCC team on the fundamental principles of web accessibility. The presentation covered the following key areas:

  • What is Accessibility? Defining digital accessibility as the inclusive practice of removing barriers to interaction with digital content.

  • Why is it Important? Emphasising the ethical, legal, and business case for accessibility.

  • Types of Disabilities: Explaining the spectrum of disabilities, including permanent, temporary, and situational impairments, and how they affect website usage. (Visual: Example slide showing different types of disabilities.)

  • How People Access Information: Discussing assistive technologies, such as screen readers, and how users with disabilities interact with websites. (Visual: Example slide showcasing a screen reader interface.)

  • WCAG 2.1 and POUR Principles: Introducing the Web Content Accessibility Guidelines and the four core principles of Perceivable, Operable, Understandable, and Robust. (Visual: Diagram illustrating the POUR principles.)   

  • Testing Accessibility: Outlining various testing techniques, ranging from quick manual checks (like keyboard-only navigation) to more comprehensive automated testing tools.

A further slide from this deck, outlining 'temporary disabilities' to illustrate that disabilities can come in a variety of types, and often are not permanent.

• Toolkit Development: The core deliverable was a practical accessibility testing toolkit designed for ease of use and regular application. The toolkit was structured as a checklist, directly mapping to WCAG 2.1 success criteria. Examples of checklist items included:

  • "All images have descriptive alt text."

  • "Keyboard navigation is fully functional and logical."

  • "Color contrast meets WCAG AA standards."

  • "Form fields have clear labels and instructions."

• The toolkit also provided guidance on using various testing tools, including:

  • Keyboard Testing: Instructions on how to navigate the website using only the keyboard to identify any focus issues or keyboard traps.

  • Google Lighthouse: Guidance on using Lighthouse for automated accessibility audits and interpreting the results.

  • WAVE Toolbar: Instructions on using the WAVE accessibility evaluation tool to visualize accessibility issues on a webpage.

  • Axe DevTools: Guidance on using the Axe browser extension for in-depth accessibility testing during development.

• Delivery and Training: The toolkit and presentation were delivered to the NSPCC team through a dedicated training session. This session provided hands-on practice using the toolkit and addressed any questions the team had.

5. The Solution/Outcome:

The project successfully delivered a comprehensive accessibility training program and a practical, user-friendly testing toolkit. This solution empowered the NSPCC team to:

• Proactively monitor and maintain website accessibility.

• Reduce reliance on external accessibility audits, leading to cost savings.

• Create a more inclusive online experience for all users, including those with disabilities.

• Mitigate the risk of legal issues related to accessibility compliance.

Snapshot of one section of the Toolkit, used for ongoing monthly monitoring of website accessibility

6. Key Learnings/Reflection:

This project reinforced the importance of empowering clients with the knowledge and tools to manage accessibility independently. A key takeaway was the effectiveness of combining educational training with practical, actionable resources. This approach ensures that teams not only understand why accessibility is important but also how to implement it effectively.

One challenge was tailoring the toolkit to the NSPCC's specific technical environment and skill level. This was addressed by conducting interviews with the website management team and iteratively refining the toolkit based on feedback.

The fact that this project directly resulted from a previous UX review highlights the value of building strong client relationships and identifying opportunities to provide further value.

This experience has further cemented my belief in the importance of user-centered design and the power of accessibility to create truly inclusive digital experiences.