Layout tables are probably one of the most hated web things within the accessibility community. They used to be all the rage before CSS became popular, and they were used inline among other HTML elements to control positioning.

As a result of their overuse, screen readers ignore them by default. Well, they mostly do.

VoiceOver, the built-in screen reader on the Mack, is apparently the exception. As long as a layout table has no borders, VoiceOver will ignore it as such and only give you the option to view data tables from its rotor. But if you add any kind of border, including transparent ones, that goes out the window and VoiceOver will report the existence of the table from the rotor. This is true regardless of whether or not the layout table has headers.

Layout tables are bad. Layout tables without headers are even worse. Layout tables with borders can have the added value of extra annoyance for VoiceOver users.

Friends don’t let friends use layout tables, so as a service to the WordPress community, here’s yet one more reason not to use them. See the link above for all kinds of CodePen goodness and screenshots.