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

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • www.gerardvignes.com

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

    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.



    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

    Seattle, WA

  • Ben C

    #2
    Re: HTML Tables vs. CSS Layers - when function and form coincide

    On 2007-01-30, www.gerardvignes.com <gerardvignes@g mail.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.
    >

    >
    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 "intrinsica lly" 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.

    Comment

    • Andy Dingley

      #3
      Re: HTML Tables vs. CSS Layers - when function and form coincide



      On 30 Jan, 08:25, "www.gerardvign es.com" <gerardvig...@g mail.com>
      wrote:
      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.

      Comment

      • www.gerardvignes.com

        #4
        Re: HTML Tables vs. CSS Layers - when function and form coincide

        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

        Seattle, WA

        Comment

        • www.gerardvignes.com

          #5
          Re: HTML Tables vs. CSS Layers - when function and form coincide

          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

          Seattle, WA

          Comment

          • Beauregard T. Shagnasty

            #6
            Re: HTML Tables vs. CSS Layers - when function and form coincide

            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+te mplate>

            ...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

            Comment

            • www.gerardvignes.com

              #7
              Re: HTML Tables vs. CSS Layers - when function and form coincide

              On Feb 3, 5:28 pm, "Beauregard T. Shagnasty"
              <a.nony.m...@ex ample.invalidwr ote:
              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+te mplate>
              >
              ..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

              Seattle, WA


              Comment

              • www.gerardvignes.com

                #8
                Re: HTML Tables vs. CSS Layers - when function and form coincide

                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.microso ft.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

                Seattle, WA

                Comment

                Working...