WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Layout tables

for

From: Josh Schroder
Date: Dec 5, 2017 2:33PM


I agree with Nick -- it's all about maintaining the proper reading order.

Layout tables aren't inherently inaccessible, but the author (in this case your web app folks) needs to understand the principles of content linearization and actually care about correct implementation.

A better solution would be to encourage them to use something like Bootstrap for layout instead.

Josh Schroder
Web Administrator II
Office of Strategic Communications
Texas Department of Licensing and Regulation
(512) 936-8937

-----Original Message-----
From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf Of Beranek, Nicholas via WebAIM-Forum
Sent: Tuesday, December 5, 2017 3:14 PM
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] Layout tables

They're not that bad when you add role="presentation" to the <table>, and each descendant <table>, as well. It kills the semantics of the table and a screen reader user won't get that noise. I'd be more concerned about SC 1.3.2 Meaningful Sequence than SC 1.3.1 Info and Relationships in this case. Make sure that the positioning of the content falls in line with the DOM order as to create a proper reading order. I don't think not having a role="presentation" is a classic failure of SC 1.3.1, but it is highly recommended as a best practice to do so. Oddly enough, it is a failure if you use role="presentation" on an element that needs to convey semantic information.

I hope this helps,

Nick Beranek
Capital One

-----Original Message-----
From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf Of Joseph Sherman
Sent: Tuesday, December 05, 2017 4:09 PM
To: 'WebAIM Discussion List' < <EMAIL REMOVED> >
Subject: [WebAIM] Layout tables

How bad are layout tables? I believe that WCAG 2.0 discourages but allows them. My web application folks love layout tables and put everything in them, including forms with multiple layout tables (e.g. https://globalsearch.cuny.edu/CFGlobalSearchTool/search.jsp). This results in screen readers reading out "table with 3 rows and 3 columns, row 1, column 1", YES "row 1, column 2" College, and similar for each row and column in the form. Must/should we add role="presentation" to all the layout tables or use CSS for layout?


Joseph

The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.