[Athen] Layout Tables - help!

[Schipul, Dan]

I agree with Dan and Leyna on this too.

Tables headings, captions, and summaries should be in any data table to make it accessible.
Tables Concepts on w3.org<https://www.w3.org/WAI/tutorials/tables/> and Creating Accessible Tables on webaim.org<https://webaim.org/techniques/tables/data> are very useful pages for learning about this topic.

I have also found, the less table complexity, the better for screen reader users.

Avoiding: nesting, merging, and multiple table headings for the same cell reduces confusion and ensures greater support.

"Despite being standard markup for tables for many years, some screen readers still do not fully support complex tables with spanned or multiple levels of row and/or column headers. When possible, try to 'flatten' the table and avoid spanned cells and multiple levels of header cells."

This is a simple table that should be understood by most screen readers:
EXAMPLE:
Concerts

Date

Event

Venue

12 Feb

Waltz with Strauss

Main Hall

24 Mar

The Obelisks

West Wing

14 Apr

The What

Main Hall


This is a lot more confusing and sometimes missed on some screen readers:
EXAMPLE:
Availability of holiday accommodation
Column one has the location and size of accommodation, other columns show the type and number of properties available


Studio

Apt

Chalet

Villa

Paris

1 bedroom

11

20

25

23

2 bedroom

-

43

52

32

3 bedroom

-

13

15

40

Rome

1 bedroom

13

21

22

3

2 bedroom

-

23

43

30

3 bedroom

-

16

32

40


But both are semantically correct but I find complex tables to be more cumbersome and less supported by screen readers.

Simple vs. Complex - Tables on accessibility psu.edu<http://accessibility.psu.edu/tables/>



Dan Schipul
Web Developer
The Office of Campus Technology Services
Certified Web Accessibility Specialist
dan.schipul at purchase.edu<mailto:dan.schipul at purchase.edu>
914-251-6464<tel:+19142516464>
[Purchase College - State University of New York]<https://www.purchase.edu/>

[Internation Association of Accessibility Professionals - Certified Web Accessibility Specialist (WAS)]


From: athen-list <athen-list-bounces at mailman12.u.washington.edu> On Behalf Of Leyna Bencomo
Sent: Monday, October 15, 2018 4:22 PM
To: Access Technology Higher Education Network <athen-list at u.washington.edu>
Subject: Re: [Athen] Layout Tables - help!

< - - MESSAGE FROM AN EXTERNAL SENDER - - >
I agree with Dan...hot mess, linearize or reformat using column headers and one row per course name or whatever that is in the 3rd column.

Leyna Bencomo
Assistive Technology Specialist
Office of Information Technology
University of Colorado Colorado Springs
1420 Austin Bluffs Parkway, EPC 215
Colorado Springs, CO 80918
(719) 255-4202 / lbencomo at uccs.edu<mailto:lbencomo at uccs.edu>
http://www.uccs.edu/~it/
[sig logo small]

From: athen-list <athen-list-bounces at mailman12.u.washington.edu<mailto:athen-list-bounces at mailman12.u.washington.edu>> On Behalf Of Bourne, Sarah (MASSIT)
Sent: Monday, October 15, 2018 2:04 PM
To: Access Technology Higher Education Network <athen-list at u.washington.edu<mailto:athen-list at u.washington.edu>>
Subject: Re: [Athen] Layout Tables - help!

Another option is to transform it into a series of tables, using the first column as a CAPTION and/or Heading (i.e., not in the table grid itself) and add headers to the table columns.

Sarah E. Bourne
Director of IT Accessibility
Executive Office of Technology Services and Security (EOTSS)
1 Ashburton Place, 8th Floor, Boston, MA 02108
Office: (617) 626-4502
sarah.bourne at mass.gov<mailto:sarah.bourne at mass.gov>  |  www.mass.gov/eotss<https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fwww.mass.gov%2Fanf%2Fresearch-and-tech%2Foversight-agencies%2Fitd%2F&data=02%7C01%7Clbencomo%40uccs.edu%7Cd102c8455e5b4938e50008d632d9b7a5%7C529343fae8c8419fab2ea70c10038810%7C1%7C0%7C636752308014998559&sdata=KBf5ccs6g0sFnYzXQm36E04Y2E993dxwl%2BiccxAt8H0%3D&reserved=0>

From: athen-list <athen-list-bounces at mailman12.u.washington.edu<mailto:athen-list-bounces at mailman12.u.washington.edu>> On Behalf Of Christine Robinson
Sent: Monday, October 15, 2018 3:47 PM
To: Access Technology Higher Education Network <athen-list at u.washington.edu<mailto:athen-list at u.washington.edu>>
Subject: [Athen] Layout Tables - help!

Someone has sent me a table, to ask for my help in making it accessible. I have a couple of ideas, but I would like to open this up to everybody here for help.

What would you do with a table like this?



Area A - Essential Skills

ENGL 1101

ENGL 1102

MATH 1113
MATH 2200

English (C&L)
English (L&C)
English (C&L)
English (L&C)
Mathematics AB/BC
Mathematics AB or
Mathematics BC

3 or 4
3 or 4
5
5
3, 4 or 5
4 or 5
3, 4 or 5

Area B - Institutional Option
*    Information Technology

ITEC 1001

ITEC 1001 proficiency and
ITEC 2120 credit (or ITEC 2140 if an IT major)

Computer Science Principles

Computer Science A

3, 4 or 5


3, 4 or 5


The actual table is much longer, but you probably get the idea. And by the way, the original table has no headers.

Christine Robinson | Technical Trainer/Writer | Center for Teaching Excellence
Georgia Gwinnett College | 1000 University Center Lane| Lawrenceville, GA 30043

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://mailman12.u.washington.edu/pipermail/athen-list/attachments/20181015/5b7571d8/attachment.html>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image002.gif
Type: image/gif
Size: 2387 bytes
Desc: image002.gif
URL: <http://mailman12.u.washington.edu/pipermail/athen-list/attachments/20181015/5b7571d8/attachment.gif>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image003.jpg
Type: image/jpeg
Size: 10972 bytes
Desc: image003.jpg
URL: <http://mailman12.u.washington.edu/pipermail/athen-list/attachments/20181015/5b7571d8/attachment.jpg>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image004.png
Type: image/png
Size: 15239 bytes
Desc: image004.png
URL: <http://mailman12.u.washington.edu/pipermail/athen-list/attachments/20181015/5b7571d8/attachment.png>