This project involved conducting an accessibility evaluation of the Refuge Network International website. My goal was to identify key usability barriers, particularly for users with disabilities, and provide actionable insights for improving the site's accessibility, ensuring it serves a wider audience. The evaluation was grounded in UX principles and WCAG 2.2 standards.
This project focused on evaluating the Refuge Network International website for compliance with Web Content Accessibility Guidelines (WCAG) 2.2 standards at Level AA and grounded in UX principles.
Using a combination of automated tools, manual testing, and persona-based scenarios, I identified critical accessibility issues. These included challenges with resizing content, inadequate error input assistance, missing alternative text, and keyboard traps. My findings highlighted how these barriers impacted users with visual, motor, and cognitive disabilities.
Key recommendations included adopting responsive design techniques, providing clear error feedback, improving focus visibility, and ensuring adequate alternative text for media. These changes aim to create a more inclusive digital space, enabling users with diverse needs to navigate and engage effectively.
It highlighted the importance of embedding accessibility into every design stage, underscoring its impact on user satisfaction and engagement.
WCAG framework
Aligned with WCAG 2.2 (Level AA) accessibility guidelines
Accessibility personas
Personas—Ashleigh, Claudia, and Simone—from the Government Digital Service were selected. These personas represent diverse challenges faced by potential users, like partially sighted, arthritis, and dyslexic individuals. Their experiences guided the exploration of common user journeys using mainstream assistive technologies and inspired solutions tailored to their needs.
1. W3C's "Easy Checks":
W3C’s “Easy Checks” for structural and keyboard accessibility.
2. Automated tools:
Automated tools (WAVE, TAW, and manual developer tool) were employed for a comprehensive review of elements like headings, contrast, and alternative text.
3. Manual testing:
Manual testing with assistive technologies (screen readers - VoiceOver, browser magnification, and keyboard navigation).
4. Severity analysis:
Issues prioritised based on user impact and resolution effort.
Several critical accessibility issues were identified that impacted users with disabilities:
Issues
Details
Recommendations
Content and Function Loss During Resizing
The website’s layout broke down at higher zoom levels, hindering users with visual impairments.
Implement fluid layouts with responsive design principles and provide better scaling for text and elements.
Inadequate Error Assistance in Forms
Users with visual and cognitive disabilities struggled with unclear form instructions and error feedback.
Include detailed error messages and visual cues for mandatory fields to guide users effectively.
Missing Alternative Text for Media
Some important images lacked descriptive alternative text, making it difficult for users relying on screen readers to comprehend the content.
Provide accurate alternative text for all media, ensuring users with visual impairments can access content.
Color Contrast Issues
Low contrast between text and background colors posed a significant barrier for users with low vision.
Increase contrast ratios to meet WCAG guidelines, improving readability for all users.
Keyboard Accessibility and Trapping
Keyboard users encountered navigation difficulties and got "stuck" on certain elements.
Ensure that all interactive elements are fully keyboard-navigable and that users can easily dismiss pop-ups.
For more detailed findings and solutions, please refer to the full evaluation report below.
This project was an eye-opening experience in understanding the real-world challenges users with disabilities face when navigating digital spaces. As a UX designer, it reinforced the importance of integrating accessibility into the design process from the outset. The iterative approach to identifying and resolving issues helped me sharpen my ability to balance technical requirements with user-centred design, ensuring an inclusive experience.
I’ve not only deepened my understanding of WCAG guidelines but also learned the value of proactive testing with real-world scenarios and assistive technologies. Addressing accessibility not only enhances usability but also ensures digital equity. This experience further solidified my commitment to creating solutions that empower all users, regardless of their abilities.
