Web Development and Design
Creating and maintaining accessible websites, applications, and digital assets requires collaboration between designers, developers, and content providers. To ensure equal access to information for all people, digital content creators should be familiar with web accessibility standards and principles.
The Web Content Accessibility Guidelines (WCAG), developed by the W3C, provide a shared standard for web accessibility. WCAG 2.0 introduced the core principles of perceivable, operable, understandable, and robust; WCAG 2.1 expanded coverage for mobile and cognitive accessibility; and WCAG 2.2 added new criteria to improve usability, such as consistent help options and more accessible login methods.
The following sections outline practical ways to apply accessibility standards to web content:
Facilitating Accessibility on Web Pages
- Use descriptive ALT text for images that convey meaning.
- Use empty ALT attributes for decorative images.
- Use tables only for data, not for layout, and include clear table headers and an optional summary if needed for context.
- Ensure navigation and key functions remain usable without JavaScript.
- Keep navigation and menus consistent across pages.
- Use semantic HTML elements (like <main>, <nav>, <header>) to help assistive technologies interpret content correctly.
If you have further technical questions on how to use specific markup features to support accessibility, visit the W3C online technical reports or email the Web Accessibility Initiative at wai@w3.org.
Recommended Practices
- Consult the latest W3C guidelines.
- Use high-contrast color combinations with minimal or no patterned backgrounds.
- Use proper heading levels (<h1>, <h2>, etc.) to structure content logically.
- Use CSS for layout and design rather than tables.
- Use relative units (like em) for font sizes to improve scalability.
- Ensure all interactive elements are accessible by keyboard and clearly indicate focus.
- Make sure the website functions well in different browsers and devices.
Strongly Discouraged
- Avoid using red and green together to convey meaning.
- Don’t use bold or font size alone to mark headings, use proper heading tags.
- Avoid making navigation or key information depend solely on images or icons.
- Don’t rely on color alone to convey information (e.g., “fields in red are required”).
- Avoid auto-playing video or audio content that can distract or interfere with assistive technologies.