This is a TwigCS accessibility ruleset. It statically checks twig templates for known accessibility issues.

The ruleset is inspired by Deque's Axe Linter

Note: Automated tests do not guarantee your site is accessible. Manual testing is the only way to make sure.

Want to learn more about creating accessible websites? Check out The A11Y Collective.

composer require --dev nielsdeblaauw/twigcs-a11y

vendor/bin/twigcs --ruleset \\NdB\\TwigCSA11Y\\Ruleset

Example Output

./tests/test.twig
l.2 c.0 : ERROR [A11Y.TabIndex] Invalid 'tabindex'. Tabindex must be 0 or -1. Found `tabindex=1>.`
l.12 c.20 : ERROR [A11Y.TabIndex] Invalid 'tabindex'. Tabindex must be 0 or -1. Found `tabindex=test.`
l.12 c.53 : ERROR [A11Y.TabIndex] Invalid 'tabindex'. Tabindex must be 0 or -1. Found `tabindex='test'.`
l.16 c.0 : ERROR [A11Y.BannedHTMLTags] Tag 'marquee' is dissallowed. Found `<marquee>`.
l.18 c.0 : ERROR [A11Y.BannedHTMLTags] Tag 'blink' is dissallowed. Found `<blink>`.
5 violation(s) found

For additional options read the TwigCS documentation.

The following rules are implemented as part of this ruleset.

Axe Tabindex rule description.

Using a non 0 or -1 value for tabindex results in unexpected behaviour for keyboard users. Variables in the tabindex property of an element are considered invalid.

Axe Blink rule description.

Axe Marquee rule description.

The blink and marquee tags are disallowed from use. These elements can cause issues for users with cognitive disabilities.

Axe aria-roles rule description.

Catches invalid Aria role values. Typo's, non-standard and dynamic roles are not allowed.

Invalid roles can not be correctly interpreted by assistive technology.

The idea is to implement as many rules as possible from the Axe Linter ruleset.