Web standards and WAI (web accessibility initiative)

1. Web Standards

Explanation (Simple English):
Web standards are rules and guidelines for building websites. They are made by organizations like W3C. Following standards ensures your website works on different browsers and devices.

Example:

• Using <header>, <footer>, <nav> instead of only <div>
• Using CSS and JavaScript properly according to the specification

Key point: Standards make websites accessible, consistent, and future-proof.

2. WAI-ARIA (Web Accessibility Initiative – Accessible Rich Internet Applications)

Explanation:
WAI-ARIA is a standard that helps people with disabilities use websites, especially when the site uses complex UI elements like menus, sliders, or modal dialogs.

• Roles → Define the purpose of an element (e.g., role="button")
• States → Show the current state (e.g., aria-checked="true")
• Properties → Extra information for screen readers (e.g., aria-label="Close menu")

Example (HTML):

<button role="switch" aria-checked="false" aria-label="Toggle dark mode">
  Dark Mode
</button>

• role="switch" → Tells assistive technology this is a toggle switch
• aria-checked="false" → Shows the switch is OFF
• aria-label="Toggle dark mode" → Describes the button to screen readers

Key point: WAI-ARIA improves accessibility, making your website usable for everyone.