Accessibility (A11y)

General recommendations

In any EPFL project, you need to be thoughtful about accessibility: this does not only concern people browsing the web with a screen reader, but also people using the keyboard only, colorblind people, people who don't understand the language, etc.


Specific recommendations

Colors and contrasts

Good color contrasts for accessibility mean using colors that provide maximum contrast. You need to make sure there is enough contrast between the content and its background.

Please refer to the color palette page. The accessibility table provides color pairings that respect this recommendation.

HTML5

Use HTML5 as much as possible, don't use a basic <div> everywhere and prefer the correct and semantic elements instead.

Aria

Use Aria tags whenever it is needed, and remember it is better to not use an aria tag than to use the wrong one.

Skip links (access nav)

Don't forget to add the skip links to every page of your project. They should allow the user to more easily get to the main areas of the website.

To do that:

  1. Set main area to: <main role="main" id="main">
  2. Set main navigation to: <nav class="nav-main" id="main-navigation" role="navigation">
  3. Set search field to: <input type="text" class="form-control" id="search" placeholder="Rechercher">
  4. Set a contact email

Official A11y guidelines

Elements follows the Web Content Accessibility Guidelines 2.1. Those guidelines must be applied the best way possible and follow the level AA recommendations.

You can as well verify the requirements (success criteria) and techniques about WCAG 2.

Further read

Please consider those links when adressing specific accessibility features:


A quote, for when you need to advocate about accessibility

The Web is fundamentally designed to work for all people, whatever their hardware, software, language, culture, location, or physical or mental ability. When the Web meets this goal, it is accessible to people with a diverse range of hearing, movement, sight, and cognitive ability.