Accessibility (a11y) for Web – Basics for More Inclusive Sites
Buildifyer··12 min read
Accessibility (a11y) for Web
Accessibility means the site can be used by people with disabilities – visual, motor, hearing or cognitive. Good a11y improves the experience for everyone: clearer structure, better keyboard navigation, readable text.
Core practices
- Semantic HTML: use <header>, <nav>, <main>, <button>, <label> instead of divs and spans for everything. That way screen readers and browsers understand roles.
- Alt text for images: describe content for those who can’t see the image. Decorative images: alt="" or role="presentation".
- Contrast: text must have sufficient contrast against the background (WCAG recommends at least 4.5:1 for normal text).
- Keyboard navigation: all interactive elements should be reachable with Tab and have a visible focus style. Don’t remove outline without an alternative.
- Forms: associate label with input (for/id), show errors clearly and suggest correction.
Tools
Lighthouse (in DevTools) has an accessibility audit. axe DevTools or WAVE help with detailed analysis. Test with a real screen reader (NVDA, VoiceOver) or at least keyboard-only navigation.
Want an accessible, semantically correct site? Contact us.
accessibilitya11yweb accessibilitysemantic HTMLARIA
