In today’s digital age, the internet is a vital source of information and services. It’s crucial that websites are accessible to as many people as possible, including those with disabilities. This is where accessibility standards like AA and AAA come into play. In this article, we’ll explore what AA and AAA accessibility mean and why they are important for your website.
What Are AA and AAA Accessibility Guidelines?
Firstly, to understand how you can make your website more accessible to a wider audience, we need to understand what AA and AAA accessibility is.
AA and AAA accessibility refer to two levels of compliance within the Web Content Accessibility Guidelines (WCAG). These guidelines provide internationally recognized standards for making digital content more accessible and understandable by a wider range of people, including those with disabilities.
In October 2023, the WCAG guidelines were updated from WCAG 2.1. WCAG 2.2 contains the latest guidelines and will therefore be the focus of this article.
AA and AAA Accessibility can be summarised as follows:
AA Accessibility (Level AA):
- AA is the second level of accessibility compliance defined by the Web Content Accessibility Guidelines (WCAG).
- Meeting AA standards means that a website is reasonably accessible to a broad range of people with disabilities, including those with more common disabilities like blindness, low vision, deafness, and mobility impairments.
- AA compliance addresses a significant number of accessibility issues and is considered a strong baseline for creating digital content with a diverse range of users in mind.
AAA Accessibility (Level AAA):
- AAA is the highest level of accessibility compliance defined by WCAG.
- Meeting AAA standards requires a higher level of commitment to accessibility, as it addresses a broader range of disabilities, including those that are less common or more severe.
- AAA compliance includes all the requirements of AA compliance and additional, more stringent guidelines.
Why AA and AAA Accessibility Guidelines Are Important
Organisations that prioritise website accessibility benefit both individuals with disabilities, as well as their own reputation and business outcomes.
Let’s take a deeper look as to why these accessibility standards are important:
Inclusivity: Ensuring AA and AAA accessibility means that your digital content is accessible to a wider audience, including people with various disabilities. This promotes inclusivity and equal access to the information and services your website provides.
Legal Compliance: Many countries and regions have laws and regulations that require websites and digital content to be accessible to individuals with disabilities. Meeting AA or AAA standards can help organisations comply with these legal requirements and avoid potential lawsuits and penalties.
Improved User Experience: Accessibility improvements often lead to an overall better user experience for everyone, not just individuals with disabilities. Websites that are easier to navigate and understand benefit both the users and support business goals.
Wider Audience: By making your digital content more accessible, you can include audiences who rely on assistive technologies, or those with specific accessibility needs, thus allowing your site content to reach a larger and more diverse audience.
Ethical and Social Responsibility: Promoting accessibility is an ethical responsibility of everyone creating content in a digital space. Website accessibility reflects an organisation’s commitment to providing equal opportunities and respect to all individuals, regardless of their abilities.
Business Benefits: Accessible websites promote a commitment to providing equal access to digital spaces. This improves a company’s reputation, customer loyalty, and brand image. Expanding the audience who can access your business offerings can also open up new markets and revenue streams.
How do you achieve AA and AAA Accessibility?
Now that we know what accessibility standards are and why they are important, let’s take a look into how you can make your site accessible.
We’ll delve into each of the points for AA and AAA compliance in more detail, in line with the Web Content Accessibility Guidelines (WCAG) 2.2:
For AA Compliance:
Perceivable;
Presenting information and user interface components to users in ways that can be perceived by all.
Text Alternatives (AA 1.1): Provide text alternatives for non-text content, such as images and multimedia. These alternatives should convey the same information or function as the non-text content.
An example of a text alternative is alt text, where you provide a written description of an image. This allows users with screen readers to understand the content and purpose of an image.
Time-Based Media (AA 1.2): Provide captions and transcripts for multimedia content, like videos and audio. This ensures that people with hearing impairments can access the content.
Operable;
User interface components and navigation must be operable.
Keyboard Accessibility (AA 2.1): Ensure all functionality is accessible using a keyboard alone. This is crucial for individuals who cannot use a mouse or other pointing devices.
Enough Time (AA 2.2): Provide users with enough time to read and interact with content. Avoid content that automatically refreshes or moves unless users can control or pause it.
Seizures and Physical Reactions (AA 2.3): Avoid content that may cause seizures or physical discomfort in users with photosensitive epilepsy or other sensitivities.
Navigable (AA 2.4): Make navigation consistent and predictable. Users should be able to find and move through content easily.
Focus Not Obscured (AA 2.4.11): When a user interface component receives keyboard focus, the component is not entirely hidden due to author-created content.
When using a keyboard to navigate the website, the content that the user has navigated to should be at least partially visible. For example, if a user has navigated to a text box using their keyboard, that text box must not be completely hidden by other site content, such as the cookie banner.
Dragging Movements (AA 2.5.7): All functionality that uses a dragging movement for operation can be achieved by a single pointer without dragging, unless dragging is essential, or the functionality is determined by the user agent and not modified by the author.
If your web page includes a dragging interaction, there must be a simple click-only alternative. An example is Google Maps – you can either move the map by clicking and dragging, or you can use the single-click arrows.
Target Size (AA 2.5.8): The size of the target for pointer inputs is at least 24 by 24 CSS pixels with some exceptions (Please check WCAG guidelines for a comprehensive list of exceptions).
All clickable elements and buttons must meet a minimum size of 24 by 24 CSS pixels. CSS pixels are a unit of measurement in a coding language that controls the style of a website.
Understandable;
Information and the operation of user interface components must be understandable.
Readable (AA 3.1): Use clear and concise language. Avoid jargon and complex terms. Provide definitions or explanations where necessary.
Predictable (AA 3.2): Ensure that navigation and operation of the website are consistent and predictable. Users should not be surprised or disoriented.
Input Assistance (AA 3.3): Help users avoid and correct mistakes by providing clear error messages and suggestions. Ensure forms are easy to complete.
Accessible Authentication (AA 3.3.8): A cognitive function test (such as remembering a password or solving a puzzle) is not required for any step in an authentication process unless that step provides at least one of the following: Alternative, Mechanism, Object Recognition, Personal Content.
Alternative: A different authentication method that is not a cognitive function test.
Mechanism: There are tools available that will adequately assist the user in completing the cognitive function test.
Object recognition: The test is to recognize objects, which can be completed through images, video or audio.
Personal content: Authentication is made by having the user identify non-text content that they provided to the web site.
Robust;
Content must be robust enough that it can be interpreted by a wide variety of user agents, including assistive technologies.
Robust (AA 4.1): Organise content and structure in a logical manner, making it easier for users to understand and navigate.
Compatible (AA 4.1): Maximise compatibility with current and future user agents (browsers and assistive technologies) by following coding and markup standards.
For AAA Compliance:
Achieving AAA compliance requires meeting all the AA requirements and addressing the following stricter guidelines:
Enhanced Perceivability;
Sign Language (AAA 1.2.6): Provide sign language interpretation for prerecorded audio and video content to cater to users who rely on sign language.
Adaptable (AAA 1.3.4): Offer alternative presentations for content that relies on sensory characteristics, such as 3D modelling or spatial audio.
Readable (AAA 1.4.8): Ensure text content has a reading level suitable for the intended audience, making it more accessible to individuals with cognitive disabilities.
Enhanced Operability;
Keyboard Shortcuts (AAA 2.1.3): Implement keyboard shortcuts for complex user interface components, allowing users to navigate and interact more efficiently.
User Interface Customization (AAA 2.2.1): Allow users to customise the user interface, including text spacing, colour schemes, and other presentation preferences.
User Interface Navigation (AAA 2.4.10): Provide navigation mechanisms for finding and navigating to specific content within a page, facilitating easier access to information.
Focus Not Obscured (AAA 2.4.12): When a user interface component receives keyboard focus, no part of the component is hidden by author-created content.
When using a keyboard to navigate the website, the content that the user has navigated to should be completely visible. For example, if a user has navigated to a text box using their keyboard, that text box must not be even partially hidden by other site content, such as the cookie banner.
Focus Appearance (AAA 2.4.13): When the keyboard focus indicator is visible, an area of the focus indicator is at least as large as the area of a 2 CSS pixel thick perimeter of the unfocused component or sub-component, and has a contrast ratio of at least 3:1 between the same pixels in the focused and unfocused states.
When a user has navigated to a section of the website using their keyboard, it should be visible what is selected. For example, a button that has been selected, could be surrounded with a different colour border.
When selected, the colour should change by a contrast ratio of at least 4.5:1, and the area that changes colour should be at least double the area of a 1 CSS pixel thick perimeter. The part of the content that has changed to indicate selection should not be hidden by any other website content.
Note – CSS pixels are a unit of measurement in a coding language that controls the style of a website.
Enhanced Understandability;
Additional Cues (AAA 3.3.5): Provide additional cues and context for complex content, aiding users in understanding intricate or technical information.
Help with Forms (AAA 3.3.6): Offer user guidance on how to complete forms and other interactive elements, ensuring that users can interact with them effectively.
Wide Range of Users (AAA 3.3.7): Ensure that content can be read and understood by a wide range of users, including those with cognitive disabilities who may require additional support.
Accessible Authentication (AAA 3.3.9): A cognitive function test (such as remembering a password or solving a puzzle) is not required for any step in an authentication process unless that step provides an alternative or mechanism to assist the user.
Enhanced Robustness;
Compatibility with Assistive Technologies (AAA 4.1.3): Strive to achieve compatibility with a wider range of assistive technologies, enabling more users to access and interact with your content.
Code Validation (AAA 4.1.4): Validate code and content against the latest web standards to enhance overall reliability and compatibility.
Keep in mind that achieving AAA compliance is challenging and may not be necessary or feasible for all websites.
It’s important to prioritise and address the specific needs of your target audience while considering the available resources and constraints when implementing accessibility improvements. Starting with AA compliance is a strong foundation for creating more accessible web content.
So, what does all that mean?
In a world where digital content is ubiquitous, ensuring accessibility is not just a legal requirement; it’s a moral and practical imperative.
AA and AAA accessibility standards exist to ensure that websites are usable and understandable by a diverse range of people. By prioritising accessibility, you can create a more inclusive online space, improve user experience, and potentially reap the benefits of enhanced reputation and broader reach. So, consider implementing these standards on your website to make the internet a more inclusive place for everyone.