Tips for Screen Reader Users
What makes the Accessible NCAA Tournament Bracket accessible is its use of structure. The entire bracket is structured using sections, headings, sub-headings, and lists. To navigate within this structure using a screen reader, simply use your screen reader's shortcut keys for navigating between sections (landmarks), headings, and lists. Here are additional details about the bracket structure:
- Each of the four regions is coded as a section.
- Each round within the regions is also coded as a section.
- Each of the four regions begins with a level 2 heading.
- Within each region, each of the first four rounds begins with a level 3 heading.
- Within each round, the complete set of games is marked up as an ordered list, with each game marked up as a nested unordered list of two teams.
- The seed within each region is indicated prior to the name of each team.
- For completed games or games in progress, each team's score is shown following the name of the team.
- If you find seeds and scores to be distracting, these can be toggled off and on using a set of radio buttons at the top of the bracket.
- When games are in progress, their scores are updated in the bracket every few seconds. These updates are presented in an ARIA live region, which means supporting screen readers will automatically announce the updated scores.
- In rounds where teams are not yet known, the brackets are populated with hidden text (visible to screen reader users only) identifying who will play in that game. For the round of play immediately following the current round, that will actually include names of teams once those teams are known. For later rounds, it simply says something like "Winner, Round 2 Game 3". With this information you can return to the previous round using level 3 heading keys, and navigate to the indicated game to identify the teams.