So, this one is going to be quite a long one as its one of the most important elements of UX in my opinion and I feel quite strongly about it. In an increasingly digital world, accessibility is a fundamental aspect of responsible and equitable design. Accessibility is not an afterthought, it embodies the principle that digital experiences should be inclusive and available to everyone, regardless of their abilities or disabilities. Early incorporation of accessibility into design and development processes is more cost-effective and yields better results than retrofitting accessibility later.
I want to explore its importance, the role of ethnographic research and intersectionality, best practices, governing bodies, web vs. app accessibility, industry standards, and when and how to conduct accessibility tests and audits. Accessibility should be considered from the project’s inception.
Overview
The Role of Ethnographic Research and Intersectionality
Ethnographic research plays a pivotal role in understanding the diverse needs and challenges of users. It involves immersing yourself in the users’ environments to gain insights into their daily experiences and needs.
When applying ethnographic research to accessibility, it’s crucial to think intersectionally, considering how different aspects of a person’s identity (e.g., gender, race, age) intersect with their disabilities. This approach ensures a more holistic understanding of user requirements.
Some Best Practices
These are general guidelines, and specific industries or projects may have additional standards or requirements. It’s essential to consider the specific needs of your target audience and consult the latest accessibility standards, such as WCAG, when designing digital interfaces.
Additionally, user testing and feedback from individuals with disabilities can help ensure that your design meets their accessibility needs.
Some things to consider in no particular order:
Buttons should have a minimum target size to make them easily tappable or clickable. Determine standard button sizes based on their importance and usage in the interface.
The Web Content Accessibility Guidelines (WCAG) recommend a minimum touch target size of 44×44 CSS pixels, which is approximately 9mm by 9mm on most screens.
Define different button states (e.g., normal, hover, active, disabled) to provide visual feedback to users.
Include transcripts for audio content and captions for videos to make multimedia accessible.
Organise navigation menus logically and consistently, considering dropdown menus and submenus. (See Information Architecture)
Use clear and recognisable navigation icons and labels.
Maintain adequate colour contrast and use legible fonts to assist users with visual impairments.
Form fields should have clear and descriptive labels.
Design consistent error messages and validation indicators for form fields.
Input fields, such as text boxes and text areas, should be appropriately sized to accommodate expected input. Specify the width and height of input fields, text areas, and selection controls.
Dropdown menus (select elements) should display all available options without requiring users to scroll.
Text should be resisable without loss of content or functionality. Users should be able to zoom in on text without any loss of information. Establish standard font size ranges for different types of content (e.g., body text, headings, captions) to ensure readability.
WCAG recommends a minimum text size of 16 CSS pixels for body text (approximately 12 points) and 18.66 CSS pixels (approximately 14 points) for large text.
Define appropriate line heights to improve legibility and readability. Determine the optimal line length to prevent excessively long lines of text.
Establish standard icon sizes for different contexts, such as navigation bars, buttons, and headers.
Ensure that icons follow a consistent visual style (e.g., outline, filled, or solid) for better recognition.
Specify consistent margins and padding around elements for visual balance and touch targets.
Set consistent spacing between UI elements to prevent clutter and improve touch interactions.
Implement a grid system to maintain alignment and consistent spacing throughout the design.
Text and interactive elements should have sufficient contrast against their background to ensure readability.
Define minimum colour contrast ratios to ensure text is legible against background colours, following WCAG guidelines. WCAG recommends a minimum colour contrast ratio of 4.5:1 for normal text and 3:1 for large text.
Create a colour palette with designated primary, secondary, and accent colours to maintain brand consistency.
Interactive elements, such as buttons and form fields, should have visible and clear focus states to indicate which element is currently selected or active.
Focus states should be distinguishable from the surrounding content.
All interactive elements should be navigable and usable using only the keyboard.
Users should be able to move through content in a logical and predictable order using the Tab key.
Use semantic HTML tags to ensure proper document structure and screen reader compatibility.
Use Accessible Rich Internet Applications (ARIA) roles and attributes to enhance the accessibility of complex UI components like sliders, accordions, and modal dialogs.
Provide clear and concise error messages for form validation. Ensure that users can easily identify and correct errors.
Create a consistent heading hierarchy (e.g., h1 for page titles, h2 for section headings) for improved SEO and accessibility.
Specify character limits or guidelines for different content types, such as headlines and product descriptions.
Set standard image sizes for thumbnails, featured images, and other visual elements.
Optimise images for web and mobile to reduce page load times.
All non-text content, including images, should have descriptive alternative text (alt text) to convey their purpose and content to screen reader users.
Define the duration and easing of animations for smooth transitions.
Ensure that motion effects do not cause motion sickness or accessibility issues.
Ensure that your design is responsive and adapts to various screen sizes and orientations. Content should reflow and remain accessible on both small and large screens.
Establish responsive breakpoints for different screen sizes and orientations.
Define how content should adapt or reflow on smaller screens to prioritise essential information.
Web vs. App Accessibility
While the principles of accessibility apply to both web and app design, there are nuances in implementation. Apps, for instance, need to consider platform-specific accessibility guidelines (e.g., iOS vs. Android).
It’s important to note that web and app accessibility are not mutually exclusive, and many accessibility principles overlap. However, developers and designers working on web and app projects should be aware of these platform-specific considerations to create inclusive digital experiences. So staying updated with the latest accessibility guidelines for the chosen platform is crucial to ensure compliance and provide the best user experience for everyone.
There are some nuanced differences between web and app accessibility considerations:
Platform Independence
Web accessibility focuses on ensuring that websites are usable across various browsers and devices, regardless of the user’s operating system.
Markup and Semantic HTML
Web developers rely heavily on using semantic HTML to create accessible web content. Properly structured HTML elements (e.g., headings, lists, forms) are essential for screen readers to interpret content correctly.
Responsive Design
Web developers emphasise responsive design principles to ensure web content adapts seamlessly to different screen sizes, including desktops, tablets, and smartphones.
Browser Compatibility
Ensuring compatibility with different web browsers (e.g., Chrome, Firefox, Safari, Edge) is a critical consideration in web accessibility.
Keyboard Navigation
Web accessibility places a strong emphasis on keyboard navigation. Users should be able to navigate and interact with web content using only a keyboard.
Focus Management
Properly managing keyboard focus states and ensuring that interactive elements (e.g., links, buttons) are focusable and usable is a core aspect of web accessibility.
URL Structure: Creating meaningful and descriptive URLs is important for both accessibility and SEO.
Platform-Specific Guidelines
Mobile app accessibility guidelines may vary depending on the platform (e.g., iOS, Android). Developers need to adhere to platform-specific accessibility standards and APIs.
Native Components
Apps often use native UI components provided by the operating system, which may have built-in accessibility features. Developers should leverage these components when possible.
Screen Reader APIs
Mobile operating systems provide screen reader APIs (e.g., VoiceOver for iOS, TalkBack for Android) that allow developers to enhance app accessibility. Developers should implement these features to ensure compatibility with screen readers.
Touch Gestures
App accessibility includes considerations for touch gestures, ensuring that users with disabilities can perform actions like swiping, tapping, and pinching.
Voice Commands: Some mobile apps integrate voice commands for navigation and interaction. Ensuring these features are accessible and responsive to voice input is important.
Content Descriptions
Providing clear and concise descriptions for images and other non-text content is crucial in app accessibility, just as it is on the web.
Mobile-Specific Interactions
Apps may have unique interactions like shake gestures, tilting, or utilising device sensors. Accessibility considerations must extend to these interactions.
Offline Functionality
Apps often work offline, so developers need to consider how accessibility features function in offline mode.
App Permissions
When requesting permissions (e.g., location, camera), apps should provide clear explanations and options for users with disabilities.
Some Governing Bodies
In addition to the Web Content Accessibility Guidelines (WCAG) and the World Wide Web Consortium (W3C), several other governing bodies, organisations, and standards play essential roles in promoting and enforcing accessibility.
When working on digital projects with global audiences, it’s important to consider the specific accessibility standards and regulations of the regions you are targeting. This ensures that your digital products and services are inclusive and compliant with local accessibility requirements.
Accessibility is a global concern, and addressing it not only improves user experiences but also aligns with international principles of human rights and inclusion. Here are some of the global governing bodies and places for information.
A widely adopted set of guidelines for web accessibility, categorised into three levels (A, AA, AAA) based on the degree of compliance.
In addition to physical disabilities, consider cognitive accessibility. Guidelines like the Cognitive Accessibility Roadmap and WCAG’s Cognitive and Learning Disabilities Accessibility Task Force offer recommendations for designing for individuals with cognitive disabilities.
While WCAG is widely adopted globally, different countries and regions may have their own accessibility standards or requirements. For instance, the European Union has the European Accessibility Act (EAA), which sets accessibility standards for certain public sector websites and mobile applications.
In the United States, federal agencies are required to make their electronic and information technology accessible to people with disabilities. The Section 508 standards outline specific accessibility requirements for various types of digital content, including websites, software, and hardware.
The EAA is a European Union directive aimed at harmonising accessibility requirements for a range of products and services, including information and communication technology (ICT) products. It sets accessibility standards for products and services sold within the EU.
The IEC develops international standards for electrical and electronic technologies. IEC 62443 focuses on cybersecurity for industrial automation and control systems, which includes considerations for accessibility.
ITU is a specialised United Nations agency that develops standards for telecommunications and ICTs. Their Focus Group on Technologies for Accessible and Inclusive ICTs works on enhancing the accessibility of ICTs worldwide.
The Australian government has its own set of accessibility standards and guidelines. The Web Content Accessibility Guidelines (WCAG) are used as a basis for digital accessibility in Australia.
In the United Kingdom, accessibility regulations require public sector organisations, including government websites, to comply with specific accessibility standards based on WCAG. This ensures that digital services are accessible to all citizens.
Canada has its own accessibility standards and regulations. The Accessible Canada Act and various provincial laws ensure that digital services and information are accessible to Canadians with disabilities.
While IAAP is headquartered in the United States, it is an international organisation that supports accessibility professionals worldwide. They offer certification programs and resources for accessibility practitioners globally.
the plan
Tips on How to Conduct Accessibility Tests and Audits
Clearly define the scope of your accessibility audit. Determine which aspects of your digital product you want to evaluate (e.g., website, mobile app) and which accessibility standards you want to comply with (e.g., WCAG 2.1 AA).
Set specific objectives for the audit, such as identifying accessibility issues, assessing compliance with standards, and recommending improvements.
Form a diverse team that includes individuals with expertise in accessibility, usability, design, and development. It’s essential to have individuals with disabilities or assistive technology users on your team.
Develop a comprehensive test plan that outlines the testing methodology, test cases, and success criteria. Include details about the specific pages or components you’ll evaluate.
Use assistive technologies like screen readers (e.g., JAWS, VoiceOver), keyboard navigation, and other tools to manually test your digital product. Document any issues or barriers encountered during testing.
Run automated accessibility testing tools to scan your digital product for common accessibility issues. Note that automated tools can identify many issues but may not catch all accessibility barriers.
Conduct a thorough code review to identify issues at the code level, such as missing alt text, improper semantic markup, or keyboard navigation problems.
Review the design of your digital product to ensure that color contrast, text size, and interactive elements meet accessibility standards.
Create a detailed report documenting all accessibility issues and barriers identified during the audit. Include information about the impacted web pages or components, severity of issues, and their impact on users.
Prioritise accessibility issues based on their severity and impact on users. Use a scoring system to rank issues from critical to minor.
Provide recommendations for addressing each accessibility issue. Include clear instructions on how to fix the problems and make the product more accessible.
Develop an accessibility roadmap that outlines the timeline for addressing and resolving each identified issue. Assign responsibilities to team members for implementing fixes.
After implementing the recommended fixes, conduct follow-up testing to verify that the accessibility issues have been resolved successfully.
Create a final report that summarises the accessibility improvements made based on the audit findings. Include information on how the product now complies with accessibility standards.
Accessibility is an ongoing process. Implement regular accessibility checks and audits to ensure that new features or content additions remain accessible
Clearly communicate the accessibility status of your digital product to stakeholders, including management, developers, designers, and users. Consider adding an accessibility statement to your website or app.