How to Accessify the NCAA Brackets? Hint: Forget ALT Tags

| | Comments (0)

I just found a great resource on accessifying technical (STEM) diagrams, from WGBH NCAM, but there's one diagram they did not cover - the NCAA Basketball Bracket diagram.

Obviously, any kind of ALT diagram will be very very long and really, really complicated, so following a general tip from NCAM, I am not going to attempt it. Instead, I am going to discuss a text based alternative that might help more than just the visually impaired.

The bracket in its traditional form looks like spider web branching from the center, but really the important information you probably need is:

  • Rounds and teams in that round
  • Winners and losers
  • Time, location of rounds (TV channels would be nice also)

Believe it or not, most of this can be accomplished by a series of lists/tables with headings. If you have dynamic pages, you can even tweak the presentation of the lists, but for this example I'll do the East Bracket plus first round.

I'll add that this is not the only possible solution. I'll also add that you are free to add color/size changes/bold via CSS, but you need to ensure that all information (e.g. the winner) is presented in text and not just via CSS formatting!

First Round

First Round NCAA Matches
Teams (Seed) Date/Time Winner Advances to
Mississippi Valley State (16) vs. Western Kentucky (16) Played Western Kentucky (WKY) South
Bringham Young University (14) vs. Iona (14) Played Bringham Young (BYU) West
Lamar (16) vs. Vermont (16) Played Vermont (VER) Midwest
California (12) vs. South Florida (12) Played South Florida (USF) Midwest

Second Round East Bracket (Main Tournament)

Key: [W] = Winner

Played in Pittsburgh (A)

  • [W] Syracuse (1), vs.
    UNC-Asheville (16)
  • [W] Kansas State (8), vs.
    Southern Mississippi (9)


  • [W] Vanderbilt (5), vs.
    Harvard (12)
  • [W] Wisconsin (4), vs.
    Montana (9)


  • Cincinnati (6), vs.
    Texas (11), March 16 at 12:15
  • Florida State (3), vs.
    St. Bonaventure (14), March 15 at 2:45

Pittsburgh (B)

  • [W] Gonzanga (7), vs.
    West Virginia (10)
  • [W] Ohio State (2), vs.
    Loyola (MD) (15)

Third Round (Boston)

  • Syracuse (1) vs. Kansas State (8), March 17 at 12:15
  • Vanderbilt (5) vs. Wisconsin (4), March 17 at 6:10
  • Winner of Cincinnati/Texas vs. Winner of Florida State/St. Bonaventure,Time TBA
  • Gonzonaga (7) vs. Ohio State (2), March 17 at 2:45

Sweet 16 (Boston)

  • Winner of Syracuse/Kansas State vs. Winner of Vanderbilt/Wisconsin
  • TBA (see Nashville schedule for teams) vs. Gonzonga/Ohio State

Elite Eight (Boston) - Determines East Bracket winner

  • TBA (see above for teams)

Final Four (New Orleans)

  • Midwest vs. East
  • South vs. West

Leave a comment