By: Peter Stringer

Peter Stringer — Wed, 12 Oct 2005 06:19:33 +0000

I just wrote about this topic and started looking for other thoughts...apparently I'm not the only one who thinks its semantically correct to build forms with tables.

By: Seth Thomas Rasmussen

Seth Thomas Rasmussen — Thu, 15 Jul 2004 00:09:08 +0000

Trying to semantically structure a form makes my head hurt.
Word…

By: Dave Cheslow, PhD

Dave Cheslow, PhD — Thu, 22 Apr 2004 21:50:24 +0000

Not to get too esoteric, but a TABLE is just a visual respresntation of three semantic concepts – COLUMN, ROW and CELL. Since EF Codd expanded those concepts with relational algebra, we have RELATIONS, ATTRIBUTES and TUPLES. Again, three semantic concepts… which happen to be displayable as a TABLE. All of us who work with relational databases know that there are many ways to display TUPLES and their relationships…. some representations are better than others, depending on the circumstances.
From a purely abstract position (a position you cannot practically adopt today), there is no purpose for

tags in XHTML – not EVEN for so-called “tabular data.”
My point is that the discussion of whether it is “good” or “bad” to use tables for form layout (or for any display layout) is simply establishing an arbitrary definition of what is a “valid” table and what is not. In fact, all tables are invalid markup because all tables infer a physical representation that may, or may not, exist semantically for the data at hand.
Let’s push the envelope and use CSS whenever we can stand it, use tables when it gets too frustrating for us, and promote the advancement of CSS to include constructs like “display: table-row;” which don’t really solve the problem, but, at least, separate the markup from the represntation.

By: Jules

Jules — Fri, 19 Dec 2003 16:38:48 +0000

There have been discussions regarding the use of tables to format forms. One interesting answer was to imagine a completed form – the questions (label) and answers (various types of inputs) are tabular data.
I too have struggled with positional CSS to create table-less forms and it is not easy. However, in browsers that support “display: table-row” and “display: table-cell” the layout becomes just as easy as using tables. In my opinion, when these two display options become better supported, then there will be much easier development of table-like structures without tables.

By: Mike

Mike — Tue, 30 Sep 2003 01:28:53 +0000

I've used unordered lists for, well, lists of elements, with list-type: none. Seems "semantically correct" and renders well, albeit somewhat confusing if CSS is off (with the bullets and radio buttons competing for clickiness). I also always use label elements with radio buttons and checkboxes, as I can't stand when I click on a label and nothing happens.

By: Conan

Conan — Mon, 29 Sep 2003 04:31:16 +0000

Oops, it's been a while since I checked this thread. :D Scott > Yes, this form can be redesigned without using tables, and I do not think that it would need over-complicated nestings of div's to do it. Just looking at it briefly, there are about only five places where I think floated div's would be needed. I will have a go at redesigning the page when I have a spare moment next week sometime.

By: Scott Johnson

Scott Johnson — Mon, 22 Sep 2003 20:51:57 +0000

Conan, I have an example for you. This form is used by many people every day. Whether in this location or another installation of the Bugzilla software, the query form is accessible, intuitive, and user-friendly. In my opinion, the form is well-designed, as it packs a lot of functionality into a small amount of space. Can you redesign this form without using tables?

By: Gabe da Silveira

Gabe da Silveira — Thu, 18 Sep 2003 18:36:58 +0000

Sorry Conan, but I’m going to have to disagree with you on this one. If all forms were of the registration or comments variety then I maybe could swallow it. In other words, I think if it’s the type of form where you basically have to go linearly through the form from start to finish then your methods should be sufficient.
The difficulty lies in forms that are more of the control panel type. You know like a search form or something where you want to layout several adjacent columns and specific horizontal and vertical alignments. Sure you can probably cobble something together with a number of divs and CSS positioning, but there comes a time when a table with it’s natural liquidity and alignment simplifies the markup and minimizes browser quirkiness.
The real problem with table-based designs is when the tables infiltrate every part of the page and get in the way of the semantic flow of actual content. When tables are used to achieve all layout effects, we quickly end up with an unreadable quagmire.
For a complex, frequently-used form things are different… Frequently the entire form fits in one table, and if you need to control over columns and rows, then TRs and TDs make semantical sense. At least as much as having 3 layers of nested DIVs all with custom CSS that ends up being much more cumbersome than the natural presentational logic associated with a table. Let’s not forget that we will always be stuck using DIVs as hooks for our presentational CSS, so it’s not as if HTML itself can ever be free of presentational encumbrances. Before using a table for a form, I don’t ask myself, “Is this semantically correct?”, I ask myself, “Is there a more semantically correct method that is reasonably cross-browser compatible?”
For simple forms I think the answer is a resounding YES! But I don’t believe on principle that any form is better without tables.

By: Conan

Conan — Thu, 18 Sep 2003 18:05:39 +0000

I do not agree that table is the best way to go for controlling the layout of complex forms. As you design your form, if a time comes when you think to yourself, "a table would make this easier," you should entertain the notion that you're designing your form badly. Split the form across several pages, or divide it up into smaller chunks on the same page, with clear divisions. There is also the issue of semantics. Unless your td's contain only form-fields, and your th's contain only their respective labels*, I do not think that you'd have a semantic and accessible solution. At least, you don't if you assume the notion that just because the contents of a database shares some inherent meaning with an HTML table you can get away with structuring a form using them and still make sense at the markup-level. * - Nesting a label in a th could also be argued to be wasted markup, since they are both used for labelling. I think the best solution for marking-up a complex form is to try not to have one in the first place. It would be a rare occurence indeed for someone to write a form so complex that it simply cannot be broken down into smaller sub-forms, styled using code similar to that in ALA's Practical CSS Layout article.

By: Jai

Jai — Thu, 18 Sep 2003 15:34:44 +0000

Tables for forms makes sense to me, because in many situations you are entering tabular data. How many forms end up in a database? It’s a lot, you can bet on it! I’m thiking that tables may even make semantic sense in conjunction with forms. That’s a bit to chew on and think about… Thoughts?

Comments on: SimpleQuiz › Form(atting) › Conclusion

By: Peter Stringer

By: Seth Thomas Rasmussen

By: Dave Cheslow, PhD

By: Jules

By: Mike

By: Conan

By: Scott Johnson

By: Gabe da Silveira

By: Conan

By: Jai