Developing Websites for Older People:
How Web Content Accessibility Guidelines (WCAG) 2.0 Applies

in Older Users and Web Accessibility: Meeting the Needs of Ageing Web Users

About WCAG 2.0

The Web Content Accessibility Guidelines (WCAG) 2.0 includes organizing principles and guidelines, and has success criteria at three levels: A, AA, AAA. WAI recommends meeting at least all WCAG 2.0 Level A and AA success criteria.

A related document provides techniques that include specific details on meeting the success criteria, such as code examples. WAI encourages developers to use the How to Meet WCAG 2.0 quick reference to access the guidelines, success criteria, and techniques, along with the additional descriptions, examples, and resources from “Understanding WCAG 2.0”.

To learn more about WCAG, see:

WCAG Overview - provides background, an introduction to WCAG, and links to additional information
The WCAG 2.0 Documents - describes the different WCAG 2.0 technical and supporting documents
How to Meet WCAG 2.0 - is a customizable quick reference to Web Content Accessibility Guidelines 2.0 requirements (Success Criteria) and techniques

How WCAG 2.0 Applies to Older People

This section explains how many of the Web Content Accessibility Guidelines (WCAG) 2.0 guidelines and success criteria specifically meet the needs of older web users. Although not all the WCAG 2.0 success criteria are listed here, WAI recommends meeting at least all WCAG 2.0 Level A and AA success criteria. Some of the Level AAA success criteria that are particularly important for older people are listed in this section too.

When implementing WCAG 2.0, developers can use different techniques to meet the success criteria. In some cases, using one technique instead of another can optimize accessibility for certain users. This section lists some of the techniques that can help optimize websites for older people. (Many of the techniques link to additional information; those with “(future link)” will be written up with later edits to the WCAG Techniques.)

This section is organized under the four principles of web accessibility from WCAG 2.0: perceivable, operable, understandable, and robust. Success criteria are listed thematically, to help readability. Sometimes they are drawn from different guidelines to address a particular aspect.

Perceivable information and user interface

Using relative font-sizes such as percent (C12) or ems (C14) and ensuring text containers resize (C28)
Providing large fonts by default (future link)
C17: Scaling form elements which contain text
Avoiding the use of text in raster images (future link)
G178: Providing controls on the Web page that allow users to incrementally change the size of all text on the page up to 200 percent

More techniques are listed under 1.4.4 - Resize text in “How to Meet WCAG 2.0”.

Literature review reference: Vision decline with ageing.

Text style and text layout

Text style and its visual presentation impacts how hard or easy it is for people to read, especially older people with declining vision.

WCAG 2.0 success criteria:

1.4.8 - Visual Presentation (AAA) includes requirements on text style, text justification, line spacing, line length, and horizontal scrolling

Example techniques to consider:

Avoiding fully-aligned text (C19) or center-aligned text (future link)
Using readable fonts (future link)
Using upper and lower case according to the spelling conventions of the text language (future link)
Avoiding chunks of italic text (future link)
G188: Providing a button on the page to increase line spaces and paragraph spaces
Providing sufficient inter-column spacing (future link)
Avoiding overuse of different styles on individual pages and in sites (future link)

More techniques are listed under 1.4.8 - Visual Presentation in “How to Meet WCAG 2.0”.

Literature review references: Vision decline with ageing, Previous approaches to ‘senior friendly’ Web guidelines, and Studies of elderly Web users’ specific disabilities - Vision.

Color and contrast

Most older people’s color perception changes, and they lose contrast sensitivity.

WCAG 2.0 success criteria:

1.4.1 - Use of Color (A) requires that color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element
1.4.3 - Contrast (Minimum) (AA) requires a contrast ratio of at least 4.5:1 for the visual presentation of text and images
1.4.6 - Contrast (Enhanced) (AAA) requires a higher contrast ratio of at least 7:1 for the visual presentation of text and images

Example techniques to consider:

G18: Ensuring that a contrast ratio of at least 4.5:1 exists between text (and images of text) and background behind the text
G14: Ensuring that information conveyed by color differences is also available in text
Using a light pastel background rather than a white background behind black text to create sufficient but not extreme contrast (future link)
G183: Using a contrast ratio of 3:1 with surrounding text and providing additional visual cues on focus for links or controls where color alone is used to identify them

More techniques are listed under 1.4.1 - Use of Color, 1.4.3 - Contrast (Minimum) and 1.4.6 - Contrast (Enhanced) in “How to Meet WCAG 2.0”.

Literature review references: Vision decline with ageing, and Studies of elderly Web users’ specific disabilities: vision.

Text-to-speech (speech synthesis)

Some older people use text-to-speech (speech synthesis) software, which is becoming increasingly available in browsers and operating systems.

WCAG 2.0 success criteria:

1.1.1 - Non-text Content (A) says “a text alternative that serves the equivalent purpose” is required
1.3.1 - Info and Relationships (A) says “information, structure, and relationships” to be made available, for example to text-to-speech software

Example techniques to consider:

More techniques are listed under 1.1.1 - Non-text Content and 1.3.1 - Info and Relationships in “How to Meet WCAG 2.0”.

CAPTCHA

Older people with declining eyesight may not be able to discern the characters in a CAPTCHA, especially because CAPTCHAs often have low contrast and do not increase in size when users have text sized larger.

CAPTCHA stands for ‘Completely Automated Public Turing tests to tell Computers and Humans Apart’. An example of CAPTCHA is:
the letters 'c
a p t c h a' are difficult to read because they are skewed and on a
complex background

WCAG 2.0 success criteria:

1.1.1 - Non-text Content (A) includes a requirement for alternative CAPTCHAs

Example techniques to consider:

G143: Providing a text alternative that describes the purpose of the CAPTCHA AND G144: Ensuring that the Web Page contains another CAPTCHA serving the same purpose using a different modality
Providing more than two modalities of CAPTCHAs (future link)
Providing access to a human customer service representative who can bypass CAPTCHA (future link)
Not requiring CAPTCHAs for authorized users (future link)

Literature review reference: Vision decline with ageing.

Operable user interface and navigation

Mouse use

It is difficult for some older people to use a mouse due to declining vision or dexterity.

WCAG 2.0 success criteria:

2.4.7 - Focus Visible (AA) says that focus indicators should be visible
3.3.2 - Labels or Instructions (A) says that labels should be provided “when content requires user input”
1.1.1 - Text Alternatives (A) says to provide “text alternatives for any non-text content” such as form controls
1.4.4 - Resize Text (AA) says that text should be resizable up to 200 percent

Example techniques to consider:

Highlighting a link or control when the mouse hovers over it (future link)
G195: Using an author-supplied, highly visible focus indicator
H44: Using label elements to associate text labels with form controls which increases the clickable area for form controls
Using real text with relative font size (e.g. C12, C14) and avoiding the use of text in raster images (future link) as larger text is easy to click

More techniques are listed under 2.4.7 - Focus Visible, 3.3.2 - Labels or Instructions, 1.1.1 - Text Alternatives and 1.4.4 - Resize Text in “How to Meet WCAG 2.0”.

Literature review references: Motor skill diminishment and Studies of elderly Web users’ specific disabilities - Mobility.

Keyboard use and tabbing

Some older people cannot use a mouse well or at all and instead use a keyboard.

WCAG 2.0 success criteria:

2.1.1 - Keyboard (A) says “the content is operable through a keyboard interface”
2.1.2 - No Keyboard trap (A) makes sure that keyboard focus “can be moved away from that component using only a keyboard”
2.1.3 - Keyboard (No Exception) (AAA) says “all functionality of the content is operable through a keyboard interface “
2.4.1 - Bypass Blocks (A) says “a mechanism is available to bypass blocks of content that are repeated”
2.4.3 - Focus Order (A) says “components receive focus in an order that preserves meaning and operability”
2.4.7 - Focus Visible (AA) requires an ability for the “keyboard focus indicator (to be) visible”

Example techniques to consider:

H91: Using HTML form controls and links to ensure that users can use the form without the mouse
G90: Providing keyboard-triggered event handlers
G1: Adding a link at the top of each page that goes directly to the main content area
G59: Placing the interactive elements in an order that follows sequences and relationships within the content
G195: Using an author-supplied, highly visible focus indicator
Providing a highly visible highlighting mechanism for links or controls when they receive keyboard focus (future link)

More techniques are listed under various success criteria for Guideline 2.1 - Keyboard Accessible and Guideline 2.4 - Navigable in “How to Meet WCAG 2.0”.

Literature review references: Motor skill diminishment and Studies of elderly Web users’ specific disabilities - Mobility.

Distractions

Some older people are particularly distracted by any movement and sound on web pages.

WCAG 2.0 success criteria:

2.2.2 - Pause, Stop, Hide (A) says “a mechanism for the user to pause, stop, or hide” moving or blinking content
2.2.4 - Interruptions (AAA) says “interruptions can be postponed or suppressed”
1.4.2 - Audio Control (A) says “a mechanism is available to pause or stop the audio”

Example techniques to consider:

G4: Allowing the content to be paused and restarted from where it was paused
G11: Creating content that blinks for less than 5 seconds
Providing the user with a means to stop moving content even if it stops automatically within 5 seconds (future link)
G76: Providing a mechanism to request an update of the content instead of updating automatically
G60: Playing a sound that turns off automatically within three seconds
G171: Playing sounds only on user request

More techniques are listed under 2.2.2 - Pause, Stop, Hide, 2.2.4 - Interruptions, and 1.4.2 - Audio Control in “How to Meet WCAG 2.0”.

Literature review references: Cognitive decline with age and Studies of elderly Web users’ specific disabilities - Cognition.

Sufficient time

It takes some older people longer to read text and complete transactions due to declining vision, dexterity, or cognition.

WCAG 2.0 success criteria:

2.2.1 - Timing Adjustment (A) says that users can turn off, adjust, or extend any time limits
2.2.3 - No Timing (AAA) says “timing is not an essential part of the event or activity presented by the content” (except for multimedia or real-time events)
2.2.2 - Pause, Stop, Hide (A) says that scrolling content should be able to be paused and that auto updating content can be also paused or controlled

Example techniques to consider:

More techniques are listed under 2.2.1 - Timing Adjustment, 2.2.3 - No Timing, and 2.2.2 - Pause, Stop, Hide in “How to Meet WCAG 2.0”.

Literature review references: Cognitive decline with age and Studies of elderly Web users’ specific disabilities - Cognition.

Understandable information and user interface

Page organization

Many older people are inexperienced web users without advanced browsing habits and therefore read the whole page, so good page organization is important.

WCAG 2.0 success criteria:

2.4.6 - Headings and Labels (AA) says “headings and labels describe topic or purpose”
2.4.10 - Section Headings (AAA) says “section headings are used to organize the content”
1.4.8 - Visual Presentation (AAA) includes techniques to help with text organization

Example techniques to consider:

G130: Providing descriptive headings
G131: Providing descriptive labels
G141: Organizing a page using headings
Using vertical (bulleted or numbered) lists rather than inline lists (future link)

More techniques are listed under 2.4.6 - Headings and Labels, 2.4.10 - Section Headings and 1.4.8 - Visual Presentation in “How to Meet WCAG 2.0”.

Literature review references: Cognitive decline with age and Previous approaches to ‘senior friendly’ Web guidelines.

Understandable language

Many older people find it particularly difficult to understand complex sentences, unusual words, and technical jargon.

WCAG 2.0 success criteria:

3.1.3 - Unusual Words (AAA) says “a mechanism is available for identifying specific definitions of words or phrases used in an unusual or restricted way”
3.1.4 - Abbreviations (AAA) says “a mechanism for identifying the expanded form or meaning of abbreviations is available”
3.1.5 - Reading Level (AAA) requires providing a version that “does not require reading ability more advanced than the lower secondary education level”

Example techniques to consider:

Using the clearest and simplest language appropriate for the content (future link)
G102: Providing the expansion or explanation of an abbreviation
G153: Making the text easier to read

More techniques are listed under 3.1.3 - Unusual Words, 3.1.4 - Abbreviations and 3.1.5 - Reading Level in “How to Meet WCAG 2.0”.

Literature review references: Cognitive decline with age and Previous approaches to ‘senior friendly’ Web guidelines.

Consistent navigation and labeling

For people who are new to the web, and older people with some types of cognitive decline, consistent navigation and presentation is particularly important.

WCAG 2.0 success criteria:

3.2.3 - Consistent Navigation (AA) requires that navigation is presented in the same relative order across a website
3.2.4 - Consistent Identification (AA) requires that components with similar functionality are identified consistently

Example techniques to consider:

More techniques are listed under 3.2.3 - Consistent Navigation and 3.2.4 - Consistent Identification in “How to Meet WCAG 2.0”.

Literature review references: Cognitive decline with age and Previous approaches to ‘senior friendly’ Web guidelines.

Pop-ups and new windows

Some older people experiencing cognitive decline can be confused or distracted by pop-ups, new windows, or new tabs.

WCAG 2.0 success criteria:

3.2.1 - On Focus (A) says “when any component receives focus, it does not initiate a change of context”
3.2.5 - Change on Request (AAA) says “changes of context are initiated only by user request or a mechanism is available to turn off such changes”

Example techniques to consider:

Giving users advanced warning when opening a new window (future link)
G107: Using “activate” rather than “focus” as a trigger for changes of context
Opening new windows only when best from an accessibility perspective (future link)
SCR24: Using progressive enhancement to open new windows on user request
Opening new windows by providing normal hyperlinks without the target attribute (future link), because many user agents allow users to open links in a new window or tab

More techniques are listed under 3.2.1 - On Focus and 3.2.5 - Change on Request in “How to Meet WCAG 2.0”.

Literature review reference: Training the elderly to Use ICT and the Web

Page refresh and updates

Some older people with declining vision or cognition can miss content that automatically updates or refreshes in a page.

WCAG 2.0 success criteria:

3.2.1 - On Focus (A) says “when any component receives focus, it does not initiate a change of context”
3.2.2 - On Input (A) says that changing a setting does not automatically change the context unless the user has been advised beforehand
3.2.5 - Change on Request (AAA) says “changes of context are initiated only by user request or a mechanism is available to turn off such changes”

Example techniques to consider:

G80: Providing a submit button to initiate a change of context
G13: Describing what will happen before a change to a form control that causes a change of context to occur is made
G107: Using “activate” rather than “focus” as a trigger for changes of context
Not causing persistent changes of state or value when a component receives focus, or providing an alternate means to reset any changes (future link)
G76: Providing a mechanism to request an update of the content instead of updating automatically
SCR19: Using an onchange event on a select element without causing a change of context

More techniques are listed under 3.2.1 - On Focus, 3.2.2 - On Input and 3.2.5 - Change on Request in “How to Meet WCAG 2.0”.

Literature review reference: Studies of elderly Web users’ specific disabilities - Cognition

Instructions and input assistance

It is difficult for some older people to understand the requirements of forms and transactions.

WCAG 2.0 success criteria:

3.3.2 - Labels or Instructions (A) says “labels or instructions are provided when content requires user input”
3.3.5 - Help (AAA) says “context-sensitive help is available”
3.2.4 - Consistent Identification (AA) says “components that have the same functionality within a set of Web pages are identified consistently”

Example techniques to consider:

G184: Providing text instructions at the beginning of a form or set of fields that describes the necessary input
Providing linear form design and grouping similar items (future link)
G194: Providing spell checking and suggestions for text input
G89: Providing expected data format and example
G197: Using labels, names, and text alternatives consistently for content that has the same functionality

More techniques are listed under the success criteria for 3.3.2 - Labels or Instructions, 3.3.5 - Help and 3.2.4 - Consistent Identification in “How to Meet WCAG 2.0”.

Literature review reference: Aspects of Web Design affecting the elderly - Forms.

Error prevention and recovery for forms

It is difficult for some older people to use forms and complete transactions due to declining cognitive abilities.

WCAG 2.0 success criteria:

3.3.4 - Error Prevention (Legal, Financial, Data) (AA) says that pages with legal commitments or financial transactions have reversible submissions and can be checked and corrected
3.3.6 - Error Prevention (All) (AAA) says that users can check and correct any information they submit
3.3.1 - Error Identification (A) says “if an input error is automatically detected, the item that is in error is identified and the error is described to the user”
3.3.3 - Error Suggestion (AA) says “if an input error is automatically detected and suggestions for correction are known, then the suggestions are provided to the user”

Example techniques to consider:

G98: Providing the ability for the user to review and correct answers before submitting
Accepting input data in a variety of formats (future link)
Informing the user what irreversible action is about to happen (future link)
Making error messages easy to understand and distinguishable from other text in the Web page (future link)
G83: Providing text descriptions to identify required fields that were not completed
G85: Providing a text description when user input falls outside the required format or values
G139: Creating a mechanism that allows users to jump to errors
Re-displaying a form with a summary of errors (future link)
G177: Providing suggested correction text
Providing a text description that contains information about the number of input errors, suggestions for corrections to each item, and instructions on how to proceed (future link)

More techniques are listed under the success criteria for [Guideline 3.3

Input Assistance](http://www.w3.org/WAI/WCAG20/quickref/#minimize-error-reversible) in “How to Meet WCAG 2.0”.

Literature review reference: Aspects of Web Design affecting the elderly - Forms.

About WCAG 2.0

How WCAG 2.0 Applies to Older People

Perceivable information and user interface

Operable user interface and navigation

Understandable information and user interface

Robust content and reliable interpretation