WCAG (Web Content Accessibility Guidelines) is an international standard for ensuring web accessibility.
Before diving deep into WCAG's principles, it's helpful to understand its overall structure.
For a comprehensive overview of WCAG's structure, please refer to this article:
Now, let's explore the four principles (Perceivable, Operable, Understandable, and Robust) that form the foundation of WCAG.
Perceivable
Information and user interface components must be presentable to users in ways they can perceive.1
The concept is straightforward.
This principle requires that web content and interfaces must be perceivable to users.
This means content shouldn't be in a state where it's "neither visible, nor audible, nor tactilely perceivable."
While we won't delve into the specific guidelines under this principle, here are some key requirements:
- Enable screen reader users to understand information through audio
- Provide captions for video content so deaf users can understand it
- Ensure form requirements are indicated by both color and text for color-blind users
If content can't be perceived visually, make it perceivable through audio.
If it can't be perceived through audio, make it perceivable visually.
If it can't be perceived through color vision, make it perceivable through other visual means.
Providing information through only one sensory channel makes it "imperceivable" to those with impairments in that specific sense.
Therefore, offering information through multiple sensory channels significantly expands the range of "perceivability."
However, implementing accessibility involves complex challenges.
For example, even if visual information is made available through audio, it remains "imperceivable" to deafblind users who have both visual and hearing impairments.
This doesn't mean such accommodations are meaningless.
Many deafblind users access the web using refreshable braille displays.
For instance, adding alt attributes to images not only conveys information audibly through screen readers but also enables tactile information transmission through braille displays.
To accommodate diverse disabilities, it's crucial to combine multiple sensory information delivery methods.
Each accommodation may benefit users with different disabilities.
Improving accessibility is achieved through such multi-layered approaches.
https://www.w3.org/WAI/WCAG22/Understanding/perceivable
Operable
User interface components and navigation must be operable.1
This principle requires that user interfaces and navigation must be operable.
While many people use a mouse to browse websites, mouse usage primarily assumes a visual interface.
However, some visually impaired users find mouse operation difficult and rely solely on keyboard navigation.
The "Operable" principle demands that websites be designed to accommodate various input methods to meet diverse needs.
Beyond keyboards, we must consider users who rely on various input devices such as touchscreens, voice recognition software, and braille displays.
This principle isn't just for people with disabilities; it also applies to temporary situations where specific devices are unavailable (e.g., when a touchpad malfunctions).
In such cases, ensuring keyboard-only operation becomes crucial.
Furthermore, the Operable principle emphasizes preventing seizures and allowing sufficient time to understand and operate content.
Rapid light flashes may trigger seizures in users with conditions like epilepsy.
Since information processing speeds vary among users, adequate time must be provided.
(For example, implementing speed control features for slideshows.)
https://www.w3.org/WAI/WCAG22/Understanding/operable
Understandable
Information and the operation of user interface must be understandable.1
This principle requires that web content and interfaces be clear and usable for users with various abilities and experiences.
Let's consider the hamburger menu button as an example.
This button typically consists of three horizontal lines and expands a menu when clicked.
https://en.wikipedia.org/wiki/Hamburger_button
While many readers of this article, such as engineers and designers familiar with web interfaces, might predict that "clicking will expand a menu," this isn't universally intuitive.
The following users might find it difficult to understand the meaning and function of this interface:
- Elderly people
- Those unfamiliar with web technology
- People with cognitive or learning disabilities
To avoid such situations, approaches like using alternative, more predictable user interface operations are necessary.
- Design user interface operations to be predictable
- Provide clear and understandable labels for buttons and links
- Maintain consistent design and navigation throughout the site
- Clearly identify errors and provide correction methods when they occur in input forms
These measures help various users understand and properly operate web content.
https://www.w3.org/WAI/WCAG22/Understanding/understandable
Robust
Content must be robust enough to be interpreted reliably by a wide variety of user agents, including assistive technologies.1
This principle requires that content be reliably interpretable by various user agents and assistive technologies.
As we transition from PCs to smartphones, new devices may emerge in the future.
Input devices continue to evolve, and more convenient alternatives to current keyboards and mice may be developed.
Browser market share may also shift. While Google Chrome currently dominates, emerging browsers might gain prominence in the future.
Technology and user agents continue to evolve. Therefore, content itself needs to be "accessible" to accommodate these changes.
Here, "accessible" means "being reliably interpretable by evolving technologies and user agents."
It's important to ensure consistent behavior and content across different browsers and devices.
To ensure "robustness," consider the following approaches:
- Writing structured HTML
- Conducting multi-browser and cross-platform testing
- Improving dynamic content accessibility through proper WAI-ARIA implementation
https://www.w3.org/WAI/WCAG22/Understanding/robust
Summary
The four WCAG principles (Perceivable, Operable, Understandable, and Robust) are fundamental guidelines for web accessibility.
These principles form the highest-level concepts in WCAG and serve as the foundation for ensuring web content accessibility.
A deep understanding of these principles enables a more conceptual understanding of the guidelines and success criteria based on them.
While WCAG receives major updates periodically, these principles remain more stable compared to individual success criteria.
These principles function as core concepts of web accessibility regardless of technological or situational changes.
Therefore, they can serve as long-term guidelines for teams and organizations.
-
"Web Content Accessibility Guidelines (WCAG) 2.2", W3C, December 12, 2024, https://www.w3.org/TR/WCAG22/ (accessed 2024-12-27) ↩
Top comments (1)
This article does a fantastic job breaking down the four core WCAG principles in a clear and actionable way. Ensuring that web content is Perceivable, Operable, Understandable, and Robust is essential for making the web accessible to everyone.