Website accessibility basics: building for everyone who might use it.

Who it helps

• People with visual impairments, who use screen readers or magnification.
• People who are deaf or hard of hearing, who need captions and transcripts.
• People with motor difficulties, who cannot use a mouse and rely on a keyboard or voice control.
• People with cognitive or learning differences, who benefit from clear language and predictable pages.
• Everyone, sometimes: a broken arm, a noisy train, glare on a screen, an older phone, a slow connection.

Hong Kong's population is ageing, which makes this more relevant, not less.

The standard: WCAG

The Web Content Accessibility Guidelines (WCAG), published by the W3C, are the common reference. They are organised around four ideas: content must be perceivable, operable, understandable and robust. Conformance has three levels, A, AA and AAA. Level AA is the usual target for business sites. Newer versions, such as WCAG 2.2, add further checks.

Hong Kong government websites are required to meet WCAG at level AA, and bureaux and departments are advised to adopt newer versions when building or revamping sites. The government has encouraged private-sector websites to follow accessibility practice. Whether and how any law applies to your own site is a legal question we cannot answer, so take advice if it matters to you.

A practical checklist

• Can you do everything on the site using only the keyboard, and always see where you are?
• Does text have enough contrast, and can the page be enlarged to 200% without losing content?
• Does every form field have a label, and does every error explain itself?
• Do images that carry information have descriptions, and are decorative ones ignored?
• Are the headings in a logical order, and are links and buttons described by their text rather than “click here”?
• Do videos have captions?
• Is the language of each page, and of any part in another language, declared?
• Is the site usable on a phone, with large enough tap targets?
• Has a person who uses assistive technology tried it?

This site's own pages are checked for several of these items, including contrast, labels, headings, language and target size, as part of building them.

Testing and keeping it accessible

• Automatic checkers catch roughly the mechanical problems, such as contrast and missing labels. They cannot judge whether a description is useful or the flow makes sense.
• Manual testing with a keyboard, a screen reader and a phone finds the rest.
• Test with real users where you can. Nothing replaces it.
• Make it part of editing. Every new image, form and video can undo good work. Give your editors a short guide.
• Publish a way to report problems and respond to it.

Keep reading

The accessibility items also appear in the launch readiness checklist.