Implementing an accessibility-focused design system in Drupal

In January 2020, The University of Minnesota Libraries developed and applied a principles-based design system to their Health Sciences Library website. Refining this design, we subsequently launched the main University Libraries site in June 2021. With the design system at its center, this site was built with elegantly accessible semantic HTML-focused code on Drupal 9 with highly curated and considered content, striving to meet and exceed WCAG 2.1 AA guidance and addressing cognitive and learning considerations through the use of plain language, templated pages for consistent page-level organization, and no hidden content. As a result, the site better supports all users regardless of their abilities, attention level, mental status, reading level, and reliability of their internet connection, all of which are especially critical now as an elevated number of people experience crises, anxieties, and depression.

At the technical core of this implementation is a Drupal theme designed to accommodate modular, Paragraphs-based editing while directing rendered output through component-based design elements. This session will draw heavily from the article "Considered Content: a Design System for Equity, Accessibility, and Sustainability" published in the Code4Lib Journal in February 2021, but will focus instead on the implementation for www.lib.umn.edu (rather than the article's focus on hsl.lib.umn.edu). This session will focus heavily on details of the Drupal implementation (theme and supporting modules), while providing much of the same background information as the referenced article.

Presenters from University of Minnesota Libraries
Amy Drayer, user interface developer
jen neveau, web content strategist
Gabe Ormsby, web applications developer

https://2023.tcdrupal.org/session/implementing-accessibility-focused-design-system-drupal

Drupal is a registered trademark of Dries Buytaert.