An accessible UX framework is an important part of Blackbaud’s commitment to deliver solutions that help drive positive change in the world. We endeavor to meet the World Wide Web Consortium’s Web Content Accessibility Guidelines 2.0 Level A & AA success criteria. In SKY UX, we build support for accessibility into our components.
This page outlines the best practices to follow when you to contribute to SKY UX. And since accessibility is a work-in-progress, it also describes some known issues.
Design for users with differing abilities
Focus on the four principles that make experiences accessible for people with differing abilities. The design must be perceivable to all user senses. User interface components and navigation must be operable for users to interact with the interface. Information and the operation of the user interface must be understandable. And content must be robust enough for a wide variety of user agents, including assistive technologies, to reliably interpret it.
Evaluate your design ideas from the perspectives of users with disabilities. Become familiar with the design issues and solutions for various disabilities.
SKY UX design evaluation
We utilize a UI design accessibility checklist to evaluate new patterns and components for SKY UX. New components are reviewed against this checklist to ensure that they meet WCAG 2.0 Level A & AA success criteria.
Code using best practices
The following best practices help to ensure that SKY UX supports accessibility features and meets WCAG 2.0 Level A & AA success criteria.
- Use structural semantic markup. This ensures that the role of elements and their relationships is available programmatically to user agents that help to communicate the content's meaning.
- Apply accessible techniques to HTML forms, tables, links, media, and scripting, as well as to keyboard use.
- If you create custom interactive components or use HTML elements differently than the default semantics:
- Follow the five rules of Accessible Rich Internet Applications (ARIA) from the W3C recommendation.
- Follow the W3C's WAI-ARIA Authoring Practices 1.1.
Test for accessibility
SKY UX employs several methods to test for accessibility. To contribute to SKY UX, follow these methods for your feature before you submit it.
- Run aXe automated tests until they all pass. aXe is an open source library of automated accessibility tests that can identify potential issues for a subset of the WCAG 2.0 Level A & AA success criteria. aXe is integrated into SKY UX.
- Perform a review using the SKY UX accessibility code review checklist to identify potential accessibility problems that automated aXe testing could not evaluate.
- Complete manual keyboard tests to ensure that people can use your feature with a keyboard only.
- Have users with various disabilities test your feature.
You can help make SKY UX accessible for everyone.
- Help fix an existing accessibility issue.
- Highlight an accessibility issue on the SKY UX Slack channel, or file an issue with an accessibility label on the SKY UX GitHub repository.
We are currently in the process of auditing existing components and logging the issues that we identify in GitHub.
In addition, we are working to update the SKY UX color system to meet color contrast criteria. The following elements do not currently meet the criteria: