By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
437,648 Members | 1,199 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 437,648 IT Pros & Developers. It's quick & easy.

HTML Tables vs. CSS Layers - when function and form coincide

P: n/a
I was checking out a website offered as an example for another job,
and I was struck by how clean and professional the site is.

http://www.colorlines.com/

I was poking around, and I noticed that they are still using HTML
Tables for content. I realize that many sites still use HTML Tables
for their content, but it is generally discouraged in favor of CSS
Layers.

This internal debate gave me a headache and caused me to ponder the
following question...

Is it appropriate to use HTML Tables to format content that is not
strictly tabular data (with captions and column headers) --- provided
the content belongs in a tableau format?

Future generations have the right to know. Do you have an opinion?

Thanks,

Gerard Vignes
http://www.GerardVignes.com
Seattle, WA

Jan 30 '07 #1
Share this Question
Share on Google+
7 Replies


P: n/a
On 2007-01-30, www.gerardvignes.com <ge**********@gmail.comwrote:
I was checking out a website offered as an example for another job,
and I was struck by how clean and professional the site is.

http://www.colorlines.com/

I was poking around, and I noticed that they are still using HTML
Tables for content. I realize that many sites still use HTML Tables
for their content, but it is generally discouraged in favor of CSS
Layers.

This internal debate gave me a headache and caused me to ponder the
following question...

Is it appropriate to use HTML Tables to format content that is not
strictly tabular data (with captions and column headers) --- provided
the content belongs in a tableau format?

Future generations have the right to know. Do you have an opinion?
If you want tabular format but the data is not "intrinsically" a table,
you should use appropriate tags for the data (li, etc.) and format as a
table using display:table, display:table-cell etc. in the stylesheets.
Probably doesn't work in IE, but for future generations IE will be no
more than a distant memory anyway.
Jan 30 '07 #2

P: n/a


On 30 Jan, 08:25, "www.gerardvignes.com" <gerardvig...@gmail.com>
wrote:
http://www.colorlines.com/
Is it appropriate to use HTML Tables to format content that is not
strictly tabular data
Of course not, but the definition of "tabular" is subtle. It's
certainly more than just "telephone directories"

If you insist on a "grid layout", then <tableis appropriate. A
"grid" here means a rectilinear arrangement of cells and columns _and_
where the height of adjacent columns depends on its neighbours. This
is the characteristic that can't be emulated by CSS otherwise, except
by JavaScript tricks that are less favoured than <table>.

The site you describe is visually quite well done, although it could
still use some fixes (on my browser the unset background colour ends
up as turquoise). It works well with pre-CSS <tablemarkup because
it's heavily dependent on images, and images are inherently pixel-
sized. The big practical problem with pre-CSS <tablemarkup
(assuming competent work) is that their sizing is pixel-based and
doesn't re-fflow well if the ratio between text size and windo size
varies.

This site doesn't need <tablemarkup. It's really three independent
columns, with vertical blocks in each column and a further pair of
columns splitting the centre column after the lead article. On the
whole I'd _rather_ do it with nested <div>s (three deep) because the
<tableisn't adding much (we don't need to vertically align the
columns) and the <tableeither still needs to be nested, or it's
requiring some awkward use of colspan for the lead article.

Jan 30 '07 #3

P: n/a
Thanks Andy!

Tableau and tabular were poor choices of word on my part. Your term
"Grid Layout" is much more meaningful.

What you are proposing, using nested divs instead---does that require
css positioning (specifying an absolute position) to get a double- or
triple-column effect?

I admit that I don't like nested tables. That probably represents the
worst abuse of tables.

Thanks Again,

Gerard Vignes
http://www.GerardVignes.com
Seattle, WA

Jan 30 '07 #4

P: n/a
I did some investigation, and it turns out that CSS Positioning is the
only practical way to get multiple columns without using Tables.

Note that Css Positioning does not work in all browsers. It is tricky
to get working right for pages that dynamically resize to accomodate
changes in user-specified font size or browser window width.

Tables work in most browsers. They can be easily crafted to
dynamically respond to changes in font size and browser window width.

I am not advocating wholesale use of tables to format web pages, but
it looks like Tables still have significant advantages when formatting
multiple columns on a single page. They are simpler to get working
properly and also support a wider range of browsers.

Note also that multiple column pages made with Css Positioning or
Tables do not automatically flow from one column to the next as with
MS Word or Pagemaker. That flow would have to be managed by the
program that created the display and/or populated it with data.

Thanks,

Gerard Vignes
http://www.GerardVignes.com
Seattle, WA

Feb 4 '07 #5

P: n/a
www.gerardvignes.com wrote:
I am not advocating wholesale use of tables to format web pages, but
it looks like Tables still have significant advantages when formatting
multiple columns on a single page. They are simpler to get working
properly and also support a wider range of browsers.
<cough>tables</cough>

<http://www.google.com/search?hl=en&q=css+3+column+template>

...and if you don't use pixels for sizing and column widths, there is no
worry about a visitor resizing the text.

--
-bts
-Motorcycles defy gravity; cars just suck
Feb 4 '07 #6

P: n/a
On Feb 3, 5:28 pm, "Beauregard T. Shagnasty"
<a.nony.m...@example.invalidwrote:
www.gerardvignes.comwrote:
I am not advocating wholesale use of tables to format web pages, but
it looks like Tables still have significant advantages when formatting
multiple columns on a single page. They are simpler to get working
properly and also support a wider range of browsers.

<cough>tables</cough>

<http://www.google.com/search?hl=en&q=css+3+column+template>

..and if you don't use pixels for sizing and column widths, there is no
worry about a visitor resizing the text.

--
-bts
-Motorcycles defy gravity; cars just suck
Thanks!

Gerard Vignes
http://www.GerardVignes.com
Seattle, WA
Feb 4 '07 #7

P: n/a
I did a quick (non-scientific) survey of popular homepages to see who
is still using tables for formatting and who isn't. This was done on
2007-02-05 at 3:30 am pst using Firefox 1.5.

TABLE
craigslist.org
google.com
ebay.com
youtube.com
myspace.com
wikipedia.org
msdn2.microsoft.com
technet.microsoft.com
msn.com
oracle.com
sun.com
linux.org
imb.com
apple.com

NON-TABLE
microsoft.com
yahoo.com
w3.org
digg.com
slashdot.org
sourceforge.net
mozilla.org
adobe.com

FYI, I stopped using tables to format my own websites back in 2003.

Thanks,

Gerard Vignes
http://www.GerardVignes.com
Seattle, WA

Feb 5 '07 #8

This discussion thread is closed

Replies have been disabled for this discussion.