The A11Y style guide comes with pre-populated accessible components that include helpful links to related tools, articles, and WCAG guidelines to make your site more inclusive. These components also serve as a guide for both HTML markup and SCSS/CSS code, to inform designers, front-end and back-end developers at every stage of the website’s creation.
Content tagged “patterns”
-
-
Frend — A collection of accessible, modern front-end components.
Frend components are modest and dependency-free. They are built with web standards as a priority and aim to avoid assumptions about tooling or environment. Care has been taken to make sure each component is compliant, keyboard navigable and properly interpreted by assistive technologies.
-
BBC GEL Technical Guides
The BBC Global Experience Language (GEL) Technical Guides are a series of framework-agnostic, code-centric recommendations and examples for building GEL design patterns in websites. They illustrate how to create websites that comply with all BBC guidelines and industry best practice, giving special emphasis to accessibility.
This technical companion to the BBC’s Global Experience Language serves as a reference for developers implementing GEL’s user experience recommendations.
-
WAI-ARIA Authoring Practices 1.1
This document provides readers with an understanding of how to use WAI-ARIA 1.1 [WAI-ARIA] to create accessible rich internet applications. It describes considerations that might not be evident to most authors from the WAI-ARIA specification alone and recommends approaches to make widgets, navigation, and behaviors accessible using WAI-ARIA roles, states, and properties. This document is directed primarily to Web application developers, but the guidance is also useful for user agent and assistive technology developers.
-
Vox Product Accessibility Guidelines
Making work accessible creates a better experience across the board. Use this checklist to help build accessibility into your process no matter your role or stage in a project.
The team at Vox open-sourced their accessibility guidelines. Check the announcement blog post for more details on their process.
-
eBay MIND Patterns
This book will assist frontend developers in building accessible e-commerce websites and components.
A tremendous living resource documenting eBay’s approach to building accessibly for the Web.
-
Design Patterns on CodePen
Ideas, inspiration and examples for your own projects.
-
The A11Y Project
A community-driven effort to make web accessibility easier.
This is a great resource, chock full of helpful links to tutorials and examples. Be sure to check out the patterns page.
-
Pears
Collect, test, and experiment with interface pattern pairings of CSS & HTML. Pears is an open source WordPress theme, enabling people like you to get your own pattern library up and running quickly.