Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Accessibility documentation for ticket-panel.md #446

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 13 additions & 0 deletions docs/components/ticket-panel.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,19 @@ The border on the left can be used to reinforce the status when used with a [sta

It can be used to display information in full width panels or columns of upto four panels per row.

## Accessibility information
There are 2 known usability issues with this component that might get flagged in an accessibility review or audit.

### 1. Overuse of sectioning elements
*Problem:* the current markup uses labelled article and section elements. This creates two landmarks for each ticket panel. This can create too many landmarks on a page, particularly one that uses many ticket panels. Landmarks work best when used sparingly to guide screen reader users to the main sections on a page. When too many are used the benefit of providing quick navigation to larger areas of content is lost.

*Fix* a development fix to streamline the markup is being investigated.

### 2. List markup isn’t used for multiple ticket panels
*Problem:* Lack of list structure when many ticket panels are used. List structures are helpful for providing extra semantics to screen readers such as how many items are in the list.

*Fix:* a development fix to add this markup is being investigated.

## Research on this component

This component is marked as experimental because it needs more research.
Expand Down