[P Zero]

Now of course I understand the reasons to stay well away from tables for layouts, but whats wrong with using a table for a form?

If you use css to lay out a contact form for example, said contact form looks extremely untidy when the page is viewed without the stylesheet. If a simple two column table is used then the form still looks reasonable with no style applied.

I know this has probably been discussed before, but I would like to hear what peoples opinions are other than "do not use tables under any circumstances".

[cibgraphics]

Tables should be used for only one thing.... tabular data.

Is a form tabular data?

It is not, so don't use tables.

[smoothonline]

Other than the obvious, accessibility, slow download time, SEO...

I think people are a bit snobby about tables, because it makes them feel insercure- (I mean, they spent hours learning, and it's a threat to their job when someone says they are a web designer and does the job for half the price and in half the time on an editor) that's fair enough if they feel like that.

However, I think the never use tables under any circumstances is a bit extreme, expecially since half of these people were the people who thought up tables and used to code in it- after all, a record player is just as good as an Ipod- it's just better to look at and easier to use an IPOD it doesn't make the record player redundant it just makes it old fashioned. The same with all fashions, soon they will say html 5 is the only way to code.

If you get my metaphor.

I would wonder if a screen reader would get on with a form inside a table, That would be my concern.

char

[QUICKLYWEB]

Is form tubular data ? I don't think you can simply rule out tables just like that. What if you are collecting data in tubular way lol? Also if it is getting the job done there and there i don't think using tables are big deal.

[P Zero]

smoothonline, on 30 December 2009 - 08:54 PM, said:

I would wonder if a screen reader would get on with a form inside a table, That would be my concern.

If labels are used for all input, then I beleive screenreaders will have no problems. This is actually one of the reasons I brought up the subject. It questions any of the usual accessibility arguments.

[neilp]

smoothonline, on 30 December 2009 - 08:54 PM, said:

Other than the obvious, accessibility, slow download time, SEO...

I think people are a bit snobby about tables, because it makes them feel insercure- (I mean, they spent hours learning, and it's a threat to their job when someone says they are a web designer and does the job for half the price and in half the time on an editor) that's fair enough if they feel like that.

However, I think the never use tables under any circumstances is a bit extreme, expecially since half of these people were the people who thought up tables and used to code in it- after all, a record player is just as good as an Ipod- it's just better to look at and easier to use an IPOD it doesn't make the record player redundant it just makes it old fashioned. The same with all fashions, soon they will say html 5 is the only way to code.

If you get my metaphor.

I would wonder if a screen reader would get on with a form inside a table, That would be my concern.

char

Spot on there Char. All the experts say it's such a bad thing to use tables that people forget about them entirely and try and use masses of divs for what tables should be used for.

I remember i had to create a page full of thumbnail images of people and because it was drummed into me about not using tables, i had a whale of a time creating div after div after div and it took me bleeding ages. Then my lead designer suggested i used tables(with a sarcastic tone in her voice) and it was so much simpler.

Just as long as you don't use tables for the layout of every page i don't see nothing bad about using tables.

[P Zero]

neilp, on 30 December 2009 - 10:17 PM, said:

Just as long as you don't use tables for the layout of every page i don't see nothing bad about using tables.

I totally agree. The main argument for not using tables is because it creates larger files, lots of inline code, nested tables are bad, etc, etc. All of which I totally agree with. However, I think the argument must be reviewed when using a 2x4 table to create a contact form or some such, and when properly made with input labels where appropriate one which is also valid and accessible.

[P Zero]

I also think that the "only use tables for tabular data" argument is perhaps a little strict. There are lots of other bits of xhtml and css that we use that perhaps weren't originally designed specifically for the task at hand.

[ElanMan]

P Zero, on 30 December 2009 - 08:22 PM, said:

If you use css to lay out a contact form for example, said contact form looks extremely untidy when the page is viewed without the stylesheet. If a simple two column table is used then the form still looks reasonable with no style applied.

If your main concern is about screen-reader software, I would say the aesthetic appearance of the site without css is of minimal importance.
Have you heard a screen reader when confronted with a table? Not pleasant to say the least.
I have a link somewhere about screen-reader examples, will try and dig it out.
Having said that, tables have their place, just not sure a form is the 'correct' place

[Stardog]

This form looks fine without a stylesheet - http://www.31three.com/contact/

The fields aren't aligned but I doubt someone reading the web without a stylesheet is concerned about things lining up.

[Seth]

To be perfectly honest I use tables for tabular data and forms. Just how I roll. I roll on the wild side I guess. Everything else is css and div tags.

The slow down on a small for isn't that bad with a small table making it look neat and tidy.

-Seth

[Seth]

smoothonline, on 30 December 2009 - 08:54 PM, said:

I would wonder if a screen reader would get on with a form inside a table, That would be my concern.

Screen readers are the issue with tables.

[P Zero]

The reason I started this topic was because I've been spending some time getting my own XHTML and CSS framework set up and until now I've always used tables for setting out a form.

I was having some difficulty getting a decent form layout coded and dealing with all the different browser display defaults. Although after reading up on it some more and reading the replies on this topic I reckon that using css for forms is worth the effort. From an accessibility point of view it is well worth it due to the screenreader issue, but I don't think it will save many lines of code.

[davep]

i don't remember where i think it was on smashing magazine but the results of some survey or other found that users preferred forms laid out like this:

name
[ box ]

rather than

name [ box ]

which is a lot easier than messing about with tables or divs

[P Zero]

davep, on 02 January 2010 - 05:48 PM, said:

i don't remember where i think it was on smashing magazine but the results of some survey or other found that users preferred forms laid out like this:

name
[ box ]

rather than

name [ box ]

which is a lot easier than messing about with tables or divs

I've now coded both without tables or divs.

Due to its more robust layout my preference is

Name:
[ box ]

But I thought there are always going to be situations where

Name: [ box ]

is preferred.

[Gareth Daine]

Firstly, the use of tables for layout, whether for forms or not, is interfering with building a better, more accessible, flexible and functional web and it does not conform to best practices, the latest standards and what tables where originally designed for. That said, the use of tables in the manner suggested is not necessarily pure evil. As long as they are not overly used or used to layout an entire website, I consider this OK, although I would not do it myself.

When laying out simple forms you don't need to use tables or DIV's, and in my opinion there is absolutely no need to do so. XHTML and CSS alone will allow you to style your forms.

As long as you use legends, fieldsets, ul, li, span and labels where appropriate you can achieve what you're after, without the need for DIV's or tables.

With regards to why you wouldn't use tables for form layout, there are a few reasons.

1. Flexibility: CSS and XHTML alone provide far more robust and flexible tools for creating, laying out and maintaining forms than tables do. A table may do for now but when you wish to update your form or style it differently or in a more complex manner in the future, tables just won't suffice.

2. Accessibility: Tables make your layouts, even for forms, less accessible for people with disabilities and on mobile devices (which is where the web is increasingly heading towards).

3. Maintenance: By keeping our HTML structure separate from our presentation we make our websites easier to maintain and update. This is best practice.

4. Cross-browser Compatibility: You will find more inconsistencies cross-browser and cross-platform using tables than you would pure XHTML and CSS. Tables don’t degrade gracefully.

5. Markup: Using XHTML and CSS instead of tables for layout will decrease the amount of markup that is required in most circumstances, in turn decreasing loading times for people with slower connections or on mobile devices.

6. Printing: Although this does not really apply to forms as such, tables do not print well.

7. Current Trends: Using tables for layout of any kind is old-hat and if you want to stay up to date with the current development trends and be able to code well in the future when new technologies and browsers become available it would be wise to use tables for what they were originally designed for. Displaying tabular data.

8. Speed: Because of the way tables work, in most circumstances tables will take longer to load.

I'm sure there are many more reasons for not using tables to layout forms but I think I've listed enough for now.

To be fair, if you want to use tables to layout certain elements on your page then do so, I just wouldn't recommend it.

Hope this helps.

Regards

Gareth

[rallport]

smoothonline, on 30 December 2009 - 08:54 PM, said:

Other than the obvious, accessibility, slow download time, SEO...

How are using tables related to SEO?

[Gareth Daine]

rallport, on 03 January 2010 - 07:32 PM, said:

How are using tables related to SEO?

There seems to be some evidence to suggest that using XHTML and external stylesheets over tables will benefit your rankings.

By doing so you can greatly improve your site.

Firstly, using external JavaScript and CSS helps reduce code bloat which makes the visible text/content more important. Your keyword density will go up making the page more authoritative.

Similarly, minimising the use of tables also helps reduce the html to text ratio, giving more importance to your content.

Also, the visible text should appear as close to the top of your page as possible. Using CSS to reposition the text and those elements appropriately will solve this issue.

Essentially, the more content and less code you have the better you will rank.

[rallport]

You got any links for this, would be interested tbh.

Have a couple of clients who I've done seo work for on their existing sites that use tables for everything and very well for their terms.

[Gareth Daine]

Just type 'are tables bad for SEO' in Google I'm sure there is loads on the subject.

There seems to be some debate but from what I know it makes sense.

[Gareth Daine]

Check this. It's funny and informative. Listen to when he talks about using DIV's not tables.

[smoothonline]

From personal experience my web sites coded strict rank far higher than those I used to build using tables.

Most, if not all, rank page 1 of google, the others are lost someone in vast cyber space.

Charlotte

[Seth]

I do think I'm going to start trying to get away from using tables for my contact forms. As far as SEO, tables do hurt it overall but just one table really won't kill it. IMHO