When websites and web tools are properly designed and coded, people with disabilities can use them. Making the web accessible benefits individuals, businesses, and society. WCAG  2.1 is based on 4 design principles: perceivable, operable, understandable, robust.

• [ ] Focus on principles. Empathize different ways that people interact with content 🟢 e.g. Use a keyboard instead of a mouse, voice commands to navigate a website, use a screen magnifier to enlarge part or all of a screen, etc.

• [ ] Text alternatives (‘alt text’) for non-text content 🟢 Keep alt text short and concise (around 140 characters or less)

• [ ] Color Contrast A small text must be a minimum of 4.5:1 contrast ratio and large text must be a minimum of 3:1 Check color contrast

• [ ] Structure content logically 🟢 Make sure the site can be navigated and read by a screen reader - this also helps if stylesheets are disabled

• [ ] Device Accessibility

  The difference in content structure depending on the device

• [ ] Understandable without color

  Colors should not be necessary to understand the content and its current state. ❌ Don’t: highlight errors just with red text. Add an icon.

• [ ] Clear interactions

  🟢 Use interactions to show how elements change while hovered, active, disabled

• [ ] Write descriptive links

  ❌ Don’t: use generic descriptions f.ex Click here

  🟢 Do: tell the user what’s the link is about

Tools

🛠 Stark