Website Accessibility for Philippine Businesses

Who benefits

Accessibility helps people with visual, hearing, motor and cognitive disabilities, older users, people with temporary injuries, and anyone using a phone in bright sunlight, a noisy place or on a slow mobile connection. It also tends to improve search visibility and conversion, because clear structure and plain language help every visitor.

What WCAG 2.2 is

The Web Content Accessibility Guidelines, published by the W3C, organize requirements under four principles: content must be perceivable, operable, understandable and robust. Each success criterion has a level: A, AA or AAA. Level AA is the usual target. WCAG 2.2, published in October 2023, added criteria including focus not obscured, dragging movements, minimum target size, consistent help, redundant entry and accessible authentication.

The Philippine context

The Magna Carta for Persons with Disability (Republic Act No. 7277, as amended) promotes equal opportunity and access, and Batas Pambansa Blg. 344 covers accessibility of buildings and facilities. Specific website accessibility obligations can also come from sector rules, contracts, or customers in other countries. Check your obligations with legal counsel; whatever the legal position, an accessible website serves more customers.

Common failures and how to fix them

Forms deserve special attention

• Give every field a visible label and clear instructions.
• Mark required fields in text, not only with color or an asterisk.
• Show an error summary with links to the fields that need attention, and keep what people typed.
• Use autocomplete attributes for names, emails and addresses.
• Do not ask people to re-enter information they already provided in the same process.
• Allow people to extend time limits.

How to test

1. Run an automated checker, such as axe or Lighthouse, to catch obvious issues.
2. Complete key tasks using only a keyboard.
3. Test with screen readers: NVDA on Windows, VoiceOver on Apple devices and TalkBack on Android.
4. Zoom to 200% and check that content reflows on narrow screens, down to a width of 320 CSS pixels, without horizontal scrolling.
5. Check color contrast for text and interface elements.
6. Where possible, test with people who use assistive technology every day.

Building accessibility into projects

• Write WCAG 2.2 AA into requirements and contracts.
• Use a component library that is accessible by default.
• Give content editors guidelines for headings, alt text, link text and plain language.
• Add automated accessibility checks to development pipelines.
• Include accessibility in acceptance testing before launch.
• Publish an accessibility statement with a way to report problems.
• Re-test after significant changes.

A checklist for content editors

• Use one main heading per page and headings in order.
• Write alt text that conveys the purpose of each image.
• Caption videos and provide transcripts for audio.
• Use real tables with header cells for tabular data.
• Prefer web pages over PDFs for important information.
• Write in plain language and explain technical terms.