Why use CSS?

[matauri]

Think that might have to be a personal choice there eightfifteen, just going off all my sites (with the exception of a couple of hits from mobile phones)...

Visitor CSS compatability on 5 of my sites:
1. 100%
2. 100%
3. 99.99%
4. 99.98%
5. 98%

So between 5 sites, I have only not catered to 2.03% of visitors.

I was surprised at your high rate. #3 of my sites targets a lot of senior citizens (genealogy), and lower end users (teens & volunteer groups/rural)...so if I was to see any huge variance in regards to archaic browser support, I would expect to see it there, but I still dont.

But it still pretty much case specific. Though, I think even in your case, I would still use CSS, just format the page in such a way as to not turn away the % that arent compatable. I've never known too many rural people that get put out by not rendering pretty pages, "just the facts m'am" has usually been their motto. As long as they can read the information they want, the rest is left up to them.

[eightfifteen]

OK everybody, you have made your points well. I guess my next question would be, if the browsers are reading the tables sites just fine, then why take the time and effort to learn CSS? Right now the old way is still being read by all the browsers, and I don't see Microsoft releasing a browser that will render 75% of the internet unreadable.

At this point, is producing the latest stanard in code reason enough for the expense and time to reinvent the wheel?

[splinter]

But table-designs are NOT read well by all browsers - screen-readers. Tables dictate the way these screen-readers read the text. This can severly confuse the people using these programs.

If you use CSS though, it reads through the page exactly the same way you have typed it out, from top-to-bottom. Even if you have bits displayed to the right, left, off the screen.

Using tables for tabulated data is fine if you use all the appropriate code. I have highlighted the main tags that really should be used in my tutorial in this forum. (Look for my face :P).

[eightfifteen]

Splinter - I'm not sure what a screen reader is. Hope this isn't a stupid question.

[splinter]

Screen-readers are used by people with sight disabilities. They read the text out through the speakers. This allows the user to gain the information they need.

Screen-readers can only read text though. No images (alt tags are essential!), flash, java etc. etc.

I'm sure that in the future this will change.

[matauri]

The biggest reason to use CSS is that most of the attributes for formatting tables are deprecated or deprecating. And one of the reasons I have read that the W3C are doing this, is to discourage the use of tables for formatting...leading to their eventual demise if you want to develop to standards.

I have spent hours today trying to validate someone elses layout which they used tables for. They had designed it with a HTML Transitional doctype, and it took me hours just to go through & restructure the code to accomodate all the deprecated items they had used. Once I had it validated for the HTML Strict, it was only some minor changes to bring it to XHTML 1, then 2. And this was because of the use of CSS.

If you get accustomed to developing with CSS, then the hurdle to move to more up-to-date coding isnt that hard, because there is now very little in your HTML document to validate. Once you have crossed that river, the jump to elimating the tables if favour of containers is pretty small again, because all of your formatting you are already putting in your CSS.

Try the 3 step approach:
1. Validate to HTML Strict using your CSS
2. Change your doctype & extend it to validating in XHTML
3. Take your tables out & replace them with <div>'s

Tables are still useful for many uses, but it's good practice to not rely on them for layout.

[synergytheory]

Flexability, quick updates of entire site layouts/formats, complying to WC3 standards [in hope that one day all browser's will comply to them], faster loading, on an SEO level you cut down on a bunch of code.

If your mind is still not made up, visit the following site. BUT! keep in mind...every design on this site, uses zero tables and every layout/design uses the EXACT same html [well xhtml] code, the only thing that changes is the style sheet.

http://www.csszengarden.com

[scallihan]

OK everybody, you have made your points well. I guess my next question would be, if the browsers are reading the tables sites just fine, then why take the time and effort to learn CSS? Right now the old way is still being read by all the browsers, and I don't see Microsoft releasing a browser that will render 75% of the internet unreadable.

At this point, is producing the latest stanard in code reason enough for the expense and time to reinvent the wheel?

Actually, tables and CSS work very well together. If you're still laying out pages using tables and NOT taking full advantage of CSS, you're missing out on an awful lot. CSS allows you to avoid the worst problems with using tables for layout -- such as having to insert FONT elements in every table cell where you want to change font colors, sizes, or faces, or having to use multiple nested tables to alter cellpadding or cellspacing. The W3C's Accessibility Guidelines, by the way, make allowance for the use of tables for layout (my *emphasis* added):

"Do not use tables for layout *unless* the table makes sense when linearized....Once user agents support style sheet positioning, tables should not be used for layout." See:

http://www.w3.org/TR/WCAG10/#gl-table-markup
http://www.w3.org/TR/WCAG10-HTML-TECHS/#tables-layout

Note that the example they provide of "older screen readers" that "read across the page, reading sentences on the same row from different columns as one sentence," which they state as a reason for not using tables for columnar layout, applies just as equally to using CSS positioning for columnar layout, since the screen reader is reading text off the screen, not from the code.