在HTML中,表格不应该用于布局,这似乎是普遍的观点。

Why?

我从来没有(老实说,很少)看到过支持这一点的有力论据。通常的答案是:

It's good to separate content from layoutBut this is a fallacious argument; Cliche Thinking. I guess it's true that using the table element for layout has little to do with tabular data. So what? Does my boss care? Do my users care?Perhaps me or my fellow developers who have to maintain a web page care... Is a table less maintainable? I think using a table is easier than using divs and CSS.By the way... why is using a div or a span good separation of content from layout and a table not? Getting a good layout with only divs often requires a lot of nested divs. Readability of the codeI think it's the other way around. Most people understand HTML, few understand CSS. It's better for SEO not to use tablesWhy? Can anybody show some evidence that it is? Or a statement from Google that tables are discouraged from an SEO perspective? Tables are slower.An extra tbody element has to be inserted. This is peanuts for modern web browsers. Show me some benchmarks where the use of a table significantly slows down a page. A layout overhaul is easier without tables, see css Zen Garden.Most web sites that need an upgrade need new content (HTML) as well. Scenarios where a new version of a web site only needs a new CSS file are not very likely. Zen Garden is a nice web site, but a bit theoretical. Not to mention its misuse of CSS.

我对使用divs + CSS而不是表的良好参数非常感兴趣。


当前回答

我相信这是一个与普遍问题有关的问题。HTML诞生时,没有人能预见到它的广泛应用。另一项在自身成功的重压下几乎崩溃的技术。当HTML页面用vi在绿色文本终端上编写时,向页面访问者显示数据所需要的只是一个TABLE,而且大多数数据都是以表格形式显示的。

我们都知道事物是如何进化的。相对来说,table最近已经过时了,但是有很多理由更喜欢基于div和CSS的布局(可访问性不是最后一个)。当然我不能写一个CSS来拯救我的生命:-),我认为图形设计专家应该总是在手边。

也就是说……即使在现代网站中,也有许多数据应该在表格中显示。

其他回答

我曾经了解到,一个表是立即加载的,换句话说,当连接很慢的时候,表所在的空间保持空白,直到整个表被加载,另一方面,一个div加载从上到下的速度与数据到达的速度一样快,不管它是否已经完成。

看起来你只是习惯了桌子,仅此而已。 将布局放在表格中会限制你的布局。用CSS你可以移动位,看看http://csszengarden.com/ 不,布局通常不需要很多嵌套的div。

没有表格的布局和适当的语义HTML更干净,因此更容易阅读。 为什么不理解CSS的人要尝试阅读它呢?如果有人认为自己是web开发人员,那么对CSS的良好掌握是必须的。

SEO的好处来自于将最重要的内容放在页面上方的能力 拥有更好的内容与标记比率。

http://www.hotdesign.com/seybold/

内容和布局之间的分离也使它更容易为您的网站生成打印机友好的布局或不同的皮肤(样式),而不必创建不同的html文件。有些浏览器(如Firefox)甚至支持从视图菜单中选择样式表。

而且我确实认为保持无表格布局更容易。你不需要担心行span, colspan等等。您只需创建一些容器div并将内容放置在需要的位置。也就是说,我认为它也更有可读性(<div id="sidebar"> vs <tr><td>…</td><td>…<td>sidebar</td></tr>)。

这只是一个你必须学会的小“技巧”(一旦你掌握了这个技巧,我认为它会更容易,更有意义)。

我没有对DIVs有利的论据。

我会说:如果事实属实,那就接受吧。

值得注意的是,要找到一种好的DIV+CSS方法来在两列或三列中呈现内容,并且在所有浏览器上都是一致的,并且看起来仍然是我想要的方式,即使不是不可能,也是很困难的。

在我的大多数布局中,这让平衡感向表格倾斜了一点,尽管我对使用它们感到内疚(不知道为什么,人们只是说它不好,所以我试着听他们的),最后,务实的观点是,对我来说,使用表格更容易、更快。我不是按小时计酬的,所以桌子对我来说比较便宜。

显而易见的答案:参见CSS Zen Garden。如果你告诉我你可以很容易地用基于表格的布局做同样的事情(记住- HTML没有改变),那么无论如何都要使用表格来布局。

另外两个重要的事情是可访问性和搜索引擎优化。

两者都关心信息以何种顺序呈现。如果基于表格的布局将导航放在页面上第二个嵌套表格的第2行的第3个单元格中,则无法轻松地将导航显示在页面顶部。

所以你的答案是可维护性,可访问性和SEO。

不要偷懒。即使事情有点难学,也要用正确的方式去做。