Setting a Decent Table

December 7, 2006

I guess the best way to do this is just to admit it straight out. Okay. Well. So. Recently I... I... I used a table for layout. There. I said it. Yes, I know, I know. But it was late. We were behind schedule. It wasn't a whole page or anything. Just a box across the top of the content on one page that would not stay put. I tried everything. I was desperate. I mean, what was I going to tell my boss? That I'd spent an entire day trying to get three lines of text to float to the left of an icon? I was going to tell him that was the latest holdup? I chose life. I tabled it. I've been feeling rotten about it, though. At least until I came across this in the Web Content Accessibility Guidelines (WCAG) 1.0:

5.3 Do not use tables for layout unless the table makes sense when linearized. Otherwise, if the table does not make sense, provide an alternative equivalent (which may be a linearized version).

What does this mean? WebAIM explains in Creating Accessible Tables

...using tables for layout is not the worst thing that you could do in terms of accessibility. People with all kinds of disabilities can easily access tables, as long as the tables are designed with accessibility in mind... Content linearization refers to the order of the content when all formatting is removed... Screen readers essentially ignore the fact that the content is inside of a table. The screen reader just reads the content in the literal order that it appears in the code. If the literal order of the content in the code is logical, then your linearized reading order is logical.

Does this mean I can stop feeling guilty? When it comes to screen readers, yes. I viewed the page in Opera with tables turned off and it makes sense. But I only used one table with three lines of text. Imagine if I'd used tables on my entire site to layout entire pages. Even if they'd made sense in screen readers, what kind of mess am I handing the site owner? And pity the poor designer who follows me and has to make a site-wide layout change. So, here's my own personal take on tables. Never use them for site-wide layout, unless you plan on leaving town soon after. Never use them when a CSS solution is available. Never use them if you can't make them accessible. However, if you get in a real bind and have struggled to find a CSS solution but can't, it's acceptable to use an occasional accessible table. Not preferable, just acceptable. Oh, yes, and adding a comment in the code apologizing to the next designer makes you feel a little bit better, too. Trust me.