DIVs vs. TABLEs a rebuttal please

 

There are lots of people out there asking "why shouldn't we use tables for structuring our HTML" and while a lot of answers come in, I rarely see anyone being converted to the world of semantics. That said, I've yet to see any convincing rebuttals to support the rationale for why we should (or might) use tables.

Anyone care to offer a rationale for when tables are valid structural markup?

Nov 7, 2008

Considering that this question didn't go away like I thought it would, I suppose I'd better clarify my question and explain its existence.

Through frustration having read the "tables are easier" argument once too many times following the "DIVs vs. TABLEs" question I wanted to expose the question a little more and not let the table lovers get let off the hook so easily.

Each to their own others might say, but I'm forever being given some application to put on our sites that's been created by some 'tables are easier' developer that dumps a chunk of crappy HTML into my pages, and to be honest, I'm just not seeing enough of the table lovers listening to the arguments.

Anyone use Mambo back in the day? Anyone had to take a bash at putting a design on the top of Microsoft's Sharepoint? Having to fight your way through all that nested table crap was hell, and considering that it was written by some bloody good coders annoys the heck out of me. Reasonable semantic markup has been around for long enough that there should be no reason for developers to still be championing "tables are easier". Tables are not easier - they are lazy!

My question deserved the negative rep for the negative manner in which it was presented, but I'm still waiting for people to accept that the only reason they use tables is because THEY DON'T KNOW HTML. Because if they did, then they'd understand, as jjrv says, that tables are for tabular data.

Tables are valid when you have a table of data. I've seen interactive grid widgets where they go out of their way to use a bunch of divs to avoid the dreaded table tag. When it's tabular data, make it a table.

A more controversial view of mine is that when you have problems dealing with vertical layout issues in CSS, you can just use a table and often resolve it immediately. Not as pretty as it ought to be perhaps, mixing content with presentation, but it gets the job done and avoids CSS hacks to get around IE.

RE: Why tables?

Because some people are (still, after all these years) afraid of change. They've heard that using semantic HTML is a good thing (and don't usually fully grasp the concept). So they try to put together a layout using CSS having never done it before. They run into a few (well documented, and usually easy to solve) issues, throw their hands up, and go running back to tables.

They then decide that CSS is 'too time consuming' ("I'm not willing to spend the time to learn it") or 'not practical' ("I don't get it. It's too hard") and that tables are the only true way. Through stubbornness and ignorance, they believe their own bullsh!t and convince their clients and peers.

And their world remains happy and unchanged, fading further into the past and deeper into obsolescence*

And that's "why tables". The end.

(*except that they are well suited for coding HTML emails)

Tables are for developers who can't be bothered to fiddle for hours with CSS to get two adjacent columnesque divs to expand to 100% height and width regardless of content, and then get the hack to work in all browsers without adding extra div wrappers and then finally in absolute frustration they resort to the 5 second fix: 

<table width="100%">
<tr><td valign="top">Left nav</td><td valign="top">Main content</td></tr>
</table>

The hard truth is that most users (excluding those using screenreaders) really don't care how the page is marked up, as long as it loads quickly.

Developers have budget and time constraints and "good" CSS and markup takes time.

The fact that there are a multitude of resources on the web explaining in great laborious detail how you can line up two divs to replace that simple table, says quite plainly to me that this design is inherently as flawed as tables. How many tutorials are needed to explain how to add a table with two columns to a page?

HTML5 should bring us all some sanity with the new header, footer, section, nav and aside tags. Example taken from Nettuts+: 

<div id="content">
    <div id="mainContent">
        <section>
            <!-- Blog post -->
        </section>
        <section id="comments">
            <!-- Comments -->
        </section>
        <form>
            <!-- Comment form -->
        </form>
    </div>
    <aside>
        <!-- Sidebar -->
    </aside>
</div>

and then this for the CSS: 

#content {
    display: table;
}

    #mainContent {
        display: table-cell;
        width: 620px;
        padding-right: 22px;
    }

    aside {
        display: table-cell;
        width: 300px;
    }

Those of you with a keen eye will love the sense of irony, when you notice that the CSS has the properties: display: table; and display: table-cell; .

Tables are back baby! Snuck in through the HTML5 back door ;-)

链接地址: http://www.djcxy.com/p/15468.html

上一篇: 包装在HTML表格中

下一篇: DIVs与TABLE表示反驳