Accessibility

Decidim follows the Web Content Accessibility Guidelines (WCAG) 2.1

Illogical heading order

Every page should have a logical heading order when using the <h1>, <h2>, <h3>, <h4>, <h5> and <h6> heading elements.

See further info here

Unique H1

Every page should have a unique H1 heading on it

See further info here

Heading on important sections

It is highly important that each important section of the page has a heading to make it easier to understand what important sections are on the page just by browsing through its headings.

See further info here

Color contrast

When creating user interfaces or modifying the colors, always make sure that you are not breaking accessibility with your changes. You can use the Color contrast checker to ensure that your colors have enough contrast against the background color where they are displayed at.

See further info here

Accessibility labels

When defining elements, always make sure they make sense for screen reader users.

See further info here

Dynamic functionality changes the page context unintuitively

Changes in the form inputs should not change the context of the page automatically.

See further info here

Use ARIA attributes where possible

Many elements that provide interactive functionality on the website require ARIA attributes on them to make them accessible.

See further info here

Elements hidden from the accessibility API

To hide an element from assistive technologies, use the aria-hidden="true" attribute on it.

See further info here