Our approach to Web Accessibility is that of Inclusion. We believe that all websites should have a single version of the page that’s designed for accessibility rather than text-only versions. An accessible page is of value even for individuals who don’t require accessible pages – as it follows good web design principles.
A holistic approach for accessible design goes beyond template design. It needs to become part of project lifecycle, product evaluation, operational procedures etc. However, at MindTree, we divide template level accessibility design at four broad levels.These broad guidelines are detailed into a checklist.
Organisation of Content: The content across and within pages should be organised so that
A holistic approach for accessible design goes beyond template design. It needs to become part of project lifecycle, product evaluation, operational procedures etc. However, at MindTree, we divide template level accessibility design at four broad levels.These broad guidelines are detailed into a checklist.
Organisation of Content: The content across and within pages should be organised so that
- Summary on top: Since visually impaired users can’t scan a page, a summary of the page at the top is useful both for accessibility and search engine optimisation.
- Means to skip common content (like top and side navigation) so that a screen reader can jump to the content. This is useful for everyone.
- Quick Search: Since visually impaired users can’t scan on-page text, page design should not interfere with use of Browser’s Find functionalities (e.g. some DHTML, show/hide features.)
Creative Design for Accessibility:
- Avoid pixel-perfect designs as these don’t look good when text & screen sizes are changed
- Use relative font-sizes within a fluid layout so that it works well even when text sizes are changed using Browsers’ native controls.
- Avoid use of Graphics for labels, menus, links and avoid use graphics for small text
- Don’t use colour only to portray meaning. Use high-contrast to allow better readability.
- The pages should work well even without CSS.
- Avoid layouts that may interfere with use by dyslexic users.
Provision of Equivalents within the code:
- Use tags within HTML that enhances accessibility.
- Text equivalents for all meaningful visual content – this also helps in better search engine indexing of visual content. This could be alternative text, audio captioning, transcripts, subtitles etc.
Testing with Users:
- No amount of proactive planning and automated testing can substitute for actual user testing using different browsers and screen-readers. While planning Usability/User Testing include user(s) who access accessible version of the pages to iron out accessibility issues.
