Tables for layout

[stealthmode666]

Been using tables all my life, tricky at first to understand, but you learn how to hold them open to predefined sizes, even with-out data in them. Let me see css do what tables can do. Both go hand in hand very nicely tho'

Not difficult to maintain if you know what you are doing. excellent for showing anything in tabular form. also good for attaching external style sheets to the tabular text or images or other data you have in them.

I'M PRO TABLES and am older than most .

Although struggling with PHP as only started about 5 weeks ago (Never had to learn it)

[corbin]

Let me see css do what tables can do.

 

 

Let me see tables do what CSS can do ;p.

 

 

 

I agree that tables definitely have their place, but I've seen lots of sites that shouldn't have a single table in them with 20.

[waynew]

Enjoy your extra bandwidth cost Stealth.

[GingerRobot]

Eugh. Can we please not have another thread about why we should use CSS over tables. Please? I remember where the last one went...

[nrg_alpha]

Tables are only good for:

 

- eating / drinking

- occasionally having sex on (preferable not on a table you eat at [especially not while someone else is currently eating])

- playing board / card games

- and smashing people into in a wrestling match that allows such props.

[toxictoad]

if you're going to use tables for page layout you might as well use layers/floating divs or whatever...it's not good design but better than tables and will give you precise positioning with ease (using the right WYSIWYG editor) and contained in an external pussy.css file

[corbin]

- occasionally having sex on (preferable not on a table you eat at [especially not while someone else is currently eating])

 

 

I don't usually eat directly on tables.

[Liquid Fire]

I agree that using tables to style an entire page is the worst thing however some things are some much easier to styling with table.  One of the biggest things is make rounded corners.  I find that using tables makes it a lot easier to put content in rounded corners and i know it will show up the same in most browsers.

[nrg_alpha]

I agree that using tables to style an entire page is the worst thing however some things are some much easier to styling with table.  One of the biggest things is make rounded corners.  I find that using tables makes it a lot easier to put content in rounded corners and i know it will show up the same in most browsers.

 

Rounded corners isn't hard in CSS... if you properly structure your divs, and how you manage your rounded-corner pieces (sometimes even as one piece in conjunction with CSS backgrounds and a CSS sprite sheet), it shouldn't be problematic.

With regards to CSS vs tables, I'm reminded of the song from 'Annie get your gun':

 

"Anything you can do, I can do better. I can do anything Better than you. No, you can't. Yes, I can. No, you can't. Yes, I can. No, you can't. Yes, I can, Yes, I can!"

[.josh]

Read me.  All of me.

 

 

 

 

[Liquid Fire]

I agree that using tables to style an entire page is the worst thing however some things are some much easier to styling with table.  One of the biggest things is make rounded corners.  I find that using tables makes it a lot easier to put content in rounded corners and i know it will show up the same in most browsers.

 

Rounded corners isn't hard in CSS... if you properly structure your divs, and how you manage your rounded-corner pieces (sometimes even as one piece in conjunction with CSS backgrounds and a CSS sprite sheet), it shouldn't be problematic.

With regards to CSS vs tables, I'm reminded of the song from 'Annie get your gun':

 

"Anything you can do, I can do better. I can do anything Better than you. No, you can't. Yes, I can. No, you can't. Yes, I can. No, you can't. Yes, I can, Yes, I can!"

 

Yea but than it come down to is it worth the time.  I can create all these dive and then figure out the css to position everything correctly and then make sure it works in all major browser or use a very small/simple and table and call it a day, which is easier?

 

It comes down to the overall benefit i gain when it comes to tables.  I have work with a website done if full table and i never want to try to maintain that type of site again but i am also not going to spend hours trying to figure out every like quirk about why my css rounded corners are not working in all browsers.

 

Read me.  All of me.

 

This guys has some pretty misleading information about css in there which make me think he does not know what he talking about on the css side of things.  I agree that a website should not be 100% css with no tables(because table can be very useful) but I think that css should be used where it can be without causing to much headaches with browser compatibility issues and stuff that that but say that usins tables to layout an entire site is just idiotic.

[.josh]

If you actually read everything in the link, you would know that at the end of the day, he actually does use css.  He's not a css hater.  He, like me, just thinks that too many people jump on the "yay css, bash tables!" bandwagon, without actually looking at the facts.

[Adam]

Hah there's some pretty strong 'FULL CSS' fan boys here!

 

Personally I aim to be compliant with todays standards as a means to promote myself as a web developer. A valid website gives a stronger impression than an invalid one! I don't hold no hatred to tables but try to not use them where possible, occasionally I give up. I pretty much always use a table to layout a form nicely though..

 

Though I must imagine FULL CSS websites will climb search engine rankings quicker?

 

A

[Daniel0]

Though I must imagine FULL CSS websites will climb search engine rankings quicker?

 

Semantic markup might. CSS has no effect on SEO.

[corbin]

Hah there's some pretty strong 'FULL CSS' fan boys here!

 

Personally I aim to be compliant with todays standards as a means to promote myself as a web developer. A valid website gives a stronger impression than an invalid one! I don't hold no hatred to tables but try to not use them where possible, occasionally I give up. I pretty much always use a table to layout a form nicely though..

 

Though I must imagine FULL CSS websites will climb search engine rankings quicker?

 

A

 

 

I must admit that I use tables for most forms...  a lot.  I could do it in CSS, but not worth the effort most of the time.  And, the layout of forms is often tabular ;p.  The data isn't obviously, and I choose to make forms tabular, but bleh...

[nrg_alpha]

Semantic markup might. CSS has no effect on SEO.

 

I'm not so sure about that. In this article, point 6 out of 13 reasons why CSS beats out tables:

 

In a nutshell, the reason touted for CSS with regards to SEO are as follows:

 

• Smaller file sizes makes for less markup, thus making it easier for search engine spiders to crawl through.
  
• On a related note, less mark-up makes it easier for search engine spiders to decipher between code and content.
  
• Admittedly, I'm not sure I can vouch for the third point, which involves H1, H2 and H3 tags (which we know has an impact on search engines) in place of font tags (which don't help SEO at all), as we could use H1, H2 H3 tags within a table. Therefore, this issue is not truly a CSS vs table one IMHO...But one benefit of CSS in this regards is that an header which contains a graphics can have text wrapped in such an H1, H2 H3 tag that is positioned off screen.. The result is that while the image itself has no effect on SEO, the offscreen positioned Hx tags do...
  
• The last point involves CSS rollovers instead of Javascript rollovers (again, this kind of straighs away from CSS vs tables explicitly).
  
• 
  

 

So just the first two points is enough to make a case of how CSS does have an impact on SEO. This is further supported by this SEO book, which in the first chapter discusses web standard compliant page code, and how it effects SEO results.

 

With regards to markup strategies, one paragraph states (page 20):

"Using complex nested tables for layout does, in fact, penalize your search engine rankings to some degree - probably because of the increased ratio to code content, which makes the page seem less valuable"

 

further along in that chapter, a paragraph titles "The right and wrong ways to use tables" (page 35), starts with this:

"Table-based layouts, as you may already be aware, cause significant accessibility issues for users with disabilities. As we saw earlier in Mike Davidson's research on the relationship between web standards and SEO, table-based layouts can also negatively impact your search engine rankings. The best we can do is speculate as to why this is, but there are likely two reasons: Perhaps the increased ratio of code to content leads search engines to downgrade the ranking, or mabey the sheer complexity of the nested table structure is more time consuming for the spiders crawl. Whatever the reason, a table-based layout is not worth the risk of a downgraded ranking. Stick to CSS-based layout systems for better results."

 

From here on, the section starts describing how to make tables more SEO friendly (I suppose for those who have not yet embraced CSS). All in all, it seems (throughout articles as well as books) the benefits of CSS over tables are there and practically unanimous. I was once relunctant to learn CSS, as I was comfortable with table code.

Good god, am I ever glad I made the switch. I'll never go back, that's for sure. I'll continue to use CSS (for layout purposes as well).

 

For all you table-huggers out there, pull up a seat to your table and code the way you want.. but just note that CSS isn't going away.. It isn't perfect, but the pros and cons of CSS vs tables become more apparent as you learn and build using CSS without tables. My personal opinion (with regards to my building habits) when dealing with tables is best reflected by stating what I once read in a CSS book that kickstarted it all..

 

'Tables are dead'.

[Liquid Fire]

'Tables are dead'.

 

Table are dead for full site layouts.  Tables are not dead for smaller simple design issue(like rounded corner content).

[nrg_alpha]

'Tables are dead'.

 

Table are dead for full site layouts.  Tables are not dead for smaller simple design issue(like rounded corner content).

 

That's what the quote is referring to.. site layouts (and this includes any smaller rounded corner design panels and such). Yes, you can use tables for those things.. but it is not necessary at all.

[Liquid Fire]

'Tables are dead'.

 

Table are dead for full site layouts.  Tables are not dead for smaller simple design issue(like rounded corner content).

 

That's what the quote is referring to.. site layouts (and this includes any smaller rounded corner design panels and such). Yes, you can use tables for those things.. but it is not necessary at all.

 

well until IE gets its act together to start build W3C complaint browsers(which will be never), I am not going to spend hours trying to figure out why IE 7 sucks, and then IE 6(and soon IE with small things like rounded corner divs when tables are a much quicker fix and don't have problems that complete table site designs have(that ones that require many table and 100's of table rows/cells).

[nrg_alpha]

While it is agreeable that IE is lacking in the CSS support department, even IE 6 has enough 'rudementary' support for 'basic' CSS tasks when it comes to layout purposes. I think it really depends on how you attack the design problem at hand. Like in many other disciplines, there are usually more than one way to solve a proplem. I have had my share of problems when dealing with IE and CSS to be sure. But I didn't resort to making all my layouts as tables just for the site in question to work on IE. Instead, I explorered other possibilities (like adding an extra div tag and say float it left or right to get the element in quesiton to display correctly on all major browsers [including IE 6]). Sometimes it just boils down to trouble shooting some other easier solutions until one works.

[Liquid Fire]

While it is agreeable that IE is lacking in the CSS support department, even IE 6 has enough 'rudementary' support for 'basic' CSS tasks when it comes to layout purposes. I think it really depends on how you attack the design problem at hand. Like in many other disciplines, there are usually more than one way to solve a proplem. I have had my share of problems when dealing with IE and CSS to be sure. But I didn't resort to making all my layouts as tables just for the site in question to work on IE. Instead, I explorered other possibilities (like adding an extra div tag and say float it left or right to get the element in quesiton to display correctly on all major browsers [including IE 6]). Sometimes it just boils down to trouble shooting some other easier solutions until one works.

 

And that is the point.  If my entire website design is not working in IE, i am got going to switch my entire website to a complete table based designed but if i have one div that i need rounded corners on, i am noting going to spend many hours toubleshooting IE issues when i can just add a table with 3 rows and 9 tds total.  For me, spending those hours has pretty much zero benefit over using table and that mark up code is probably going to be about the same as having a bunch of divs.  Troubleshooting 2, 3, or more solutions is not easier than going to a known solution that works and is quick and easier which minimum(if any) cons.

 

My main point it that while tables are not designed for everything(and really should only be used when 100% needed), with cross browser css issues(mainly IE issues), there are cause where css is just a whole lot of extra work with not benefits besides being able to say "This is is 100% css, no tables" and that is not really a benefit.

 

What is the benefit of using css for say rounded corner content where a very simple table would work just fine?

[.josh]

Semantic markup might. CSS has no effect on SEO.

 

• Smaller file sizes makes for less markup, thus making it easier for search engine spiders to crawl through.
  
• On a related note, less mark-up makes it easier for search engine spiders to decipher between code and content.
  

So just the first two points is enough to make a case of how CSS does have an impact on SEO.

 

I seriously can't believe you are actually arguing those points.  Crawlers ranking siteB lower than siteA because of a few more lines of code?  Does google sit there and time how long it takes the crawler to go forth and come back with info, first one back is the winner?  Next thing you're gonna tell me is that I'll have better SEO the closer my server is to one of google's. 

 

And seriously, you're arguing that a crawler bot has an "easier" time ignoring a <div> tag than a <table> tag?  Do you know anything about regex at all?  I mean, I see you helping in the regex forum, so it boggles my mind why you would argue this. 

 

I'm trying really hard not to smack you in the face with a 10 pound fish.  These are the sort of arguments I expect to hear from con artists trying to sell snake oil to non-programmers.  Don't make me paper cut you.

 

 

[nrg_alpha]

 

I seriously can't believe you are actually arguing those points.  Crawlers ranking siteB lower than siteA because of a few more lines of code?  Does google sit there and time how long it takes the crawler to go forth and come back with info, first one back is the winner?  Next thing you're gonna tell me is that I'll have better SEO the closer my server is to one of google's. 

 

And seriously, you're arguing that a crawler bot has an "easier" time ignoring a <div> tag than a <table> tag?  Do you know anything about regex at all?  I mean, I see you helping in the regex forum, so it boggles my mind why you would argue this. 

 

I'm trying really hard not to smack you in the face with a 10 pound fish.  These are the sort of arguments I expect to hear from con artists trying to sell snake oil to non-programmers.  Don't make me paper cut you.

 

Wow.. the unwarrented hostility. I think a little more civility is in order here.

 

For starters, why the regex talk? Did I mention anything about regex? If you are suggesting that this is the ultimate in algorithms of search engines, I think it's quite more complex than that.

 

The point of argument is making it 'easier' for the spider.. Just how much more efficient is it? Who knows (amongst us I mean). I tend to lean towards believing less code making things easier, yes. Sorry this upsets you. The common sense logic is that the more stuff it has to crawl / sort through.. the more 'work' on its end. Simple as that. Now if we are to compare a small simple clean table-based site vs something equivalent in CSS, I suspect the differences would be small. Very small... Just how deep the rabbit hole goes on much larger / messier sites, well, this is where it might have more of an impact.

 

I think the link you povided is (with all due respect) utter garbage. The author(s) clearly start making claims that distort everything in their favor. It would serisouly require a large amount of my time and quite the post to start going point by point to counter that site's stupidity, so I won't even bother. I'll refrain from going any further. It was a good laugh though.

 

In either case, to avoid a developing flame war, you can stick to (and support) your tables.. no harm, no foul. I'll stick to my CSS. But don't get all bent out of shape over someone else's opinion just because it doesn't match yours. We all post out thoughts [and / or links] (hopefully without the insults of face slapping and other such adolescent immaturities) and discuss things in a manner that is more civil. We don't have to agree with each other. But such talk is not necessary.

 

You're supposed to be one of the 'better ones'.

 

[Daniel0]

Semantic markup might. CSS has no effect on SEO.

 

I'm not so sure about that. In this article, point 6 out of 13 reasons why CSS beats out tables:

 

[...]

 

No, you're misunderstanding me. CSS is irrelevant in regards to SEO. CSS simply specifies how things should look. You typically split a webpage up in three layers: content (HTML), presentation (CSS), behavior (Javascript). Search engines only care about the bottom-most layer, the content layer. It is said that each consecutive layer adds a higher user experience (as long as you do not overdo it obviously), but the page must be usable being viewed with only the bottom layer, both for accessibility reasons, but also for SEO reasons.

 

I said that semantics have an effect on SEO, and that is essentially what you are talking about as well. Try to look up the word: "the meaning, or an interpretation of the meaning, of a word, sign, sentence, etc." Using a table for non-tabular data is not semantic because a table implies tabular data. <em> implies emphasized text, <strong> implies strongly emphasized text, <i> implies nothing as it is a presentational element and should thus not be used. Using e.g. the <strong> and <em> tags a screenreader or search engine can see that the content these tags encompass has a higher importance than the surrounding text. Likewise, <h1> through <h6> defines the structure of the page via semantics (note to PHP Freaks authors: which is why you must follow my publishing guidelines and not use the tags above h4 as they are already used).

 

You can remove the stylesheets from a webpage and a search engine wouldn't care because it's not taking that into consideration when indexing it; it has no effect on SEO.

 

CSS doesn't beat tables, semantic markup beats them. CSS only matters if you want your webpage to look nice.

[nrg_alpha]

No, you're misunderstanding me. CSS is irrelevant in regards to SEO. CSS simply specifies how things should look. You typically split a webpage up in three layers: content (HTML), presentation (CSS), behavior (Javascript). Search engines only care about the bottom-most layer, the content layer. It is said that each consecutive layer adds a higher user experience (as long as you do not overdo it obviously), but the page must be usable being viewed with only the bottom layer, both for accessibility reasons, but also for SEO reasons.

 

I said that semantics have an effect on SEO, and that is essentially what you are talking about as well. Try to look up the word: "the meaning, or an interpretation of the meaning, of a word, sign, sentence, etc." Using a table for non-tabular data is not semantic because a table implies tabular data. <em> implies emphasized text, <strong> implies strongly emphasized text, <i> implies nothing as it is a presentational element and should thus not be used. Using e.g. the <strong> and <em> tags a screenreader or search engine can see that the content these tags encompass has a higher importance than the surrounding text. Likewise, <h1> through <h6> defines the structure of the page via semantics (note to PHP Freaks authors: which is why you must follow my publishing guidelines and not use the tags above h4 as they are already used).

 

You can remove the stylesheets from a webpage and a search engine wouldn't care because it's not taking that into consideration when indexing it; it has no effect on SEO.

 

 

You're right. I did misunderstand you. I am seeing CSS strictly from a standpoint of a semantic markup (as this is what the spirit of the debate is about, as we know tables is commonly [and sadly] used for presentation intermingled with content). So when I read your statement about "CSS has no effect on SEO.", I am instantly seeing markup aspect while neglecting the fact that CSS is more than that. You are using CSS in it's general sense (the separation and thus the presentation of content). So yes, now that I re-read it, I apologize. I did misunderstand you..

 

CSS doesn't beat tables, semantic markup beats them. CSS only matters if you want your webpage to look nice.

Agreed. But that is what is implied when using CSS as a form of markup (from separate stylesheets). Even with stylesheets ignored (as you pointed out, is the case from a spider's context), the remaining (x)html code is slightly (or greatly) cleaner and reduced (depending on the site's structure and how well [or poorly] structured tables or div are used, as too much of either is not recommended [and IMO, tables are not recommended at all...again, my opinion here.. obvisouly, others will differ]).