为什么 Google 和 Twitter 使用表格布局？ [复制]答案

【问题标题】：Why do Google and Twitter use table layout? [duplicate]为什么 Google 和 Twitter 使用表格布局？ [复制]
【发布时间】：2009-08-05 22:14:24
【问题描述】：

可能重复：
Does it make sense to use the <table> tag on a “modern” website?

无论我走到哪里我都看到不要使用表格布局，这是邪恶的，甚至 Google 都这么说，那么为什么访问量最大的网站之一 Google 和 Twitter 使用它作为他们的主页呢？

我不认为这是任何错误，或任何其他愚蠢的问题。

我能想到的唯一原因是，他们希望页面看起来相似，即使客户端不支持 CSS，例如 Lynx。

如果互联网上最大的网站都使用它，为什么每个人都说它如此糟糕。

在我看来，在某些情况下，就像上面提到的那样，在任何地方都有相同的外观比使用表格更重要。

edit：同样的问题也适用于像 <center> 这样的 html 元素，或者使用属性 align 和其他“用于替代 CSS 功能的 html 属性和元素”来格式化文本

【问题讨论】：

这是个好问题。我还注意到主要企业甚至不兼容 XHTML，微软，甚至 google。最好的前进方式是什么？
骗子骗子……见stackoverflow.com/questions/796504/…。
它不完全是一个骗子，因为这个真的很具体
许多大型网站的标记确实令人震惊。以亚马逊为例。
亚马逊到底有多糟糕，因为它是一种浮动布局，并且可以在旧的、糟糕的浏览器上运行？我一直在看它，它变得越来越好，但许多零售商仍然从旧浏览器中获得大量点击。

标签： html css layout xhtml html-table

【解决方案1】：

页面加载时间是这些家伙的王道，带宽使用量非常大。

我不得不说他们使用表格来提高原始数据的速度，因为他们每天都在提供如此多的带宽。

另外，请注意他们在页面标题中使用内联样式来减少 HTTP 请求的数量，从而帮助加快页面加载时间。

【讨论】：

呵呵，我完全没有想到这个，但似乎有道理
我还必须同意另一个答案，即表格对于显示表格数据非常有用。此外，它们确实为此类简约页面布局提供了一种获得跨浏览器一致性的绝佳方式。
表格布局倾向于使用更多的带宽，而不是更少。
但是他们的表格非常小，可以最大限度地减少来自标签的额外标记。它们用于布局表单，其中样式表实际上可能会添加更多字节，以获得一组样式正确的 div 或块元素，这些元素在浏览器中呈现一致。不过，谷歌上的自动完成表对我来说是个谜。看起来这将是一个简单列表的绝佳候选者。
Twitter 至少使用了一个普通的“又是 1997 年”布局表来处理它的两列布局。 Google 的表格还可以使用 CSS 做很多更简单、更小的事情。他们只是讨厌标记。

【解决方案2】：

表格布局比它应得的更糟糕。它易于开发人员使用，几乎在所有 Web 浏览器中都保持一致，并且让您可以轻松添加行/列。

唯一的缺点是它违背了您的文档应该只包含内容并且您的设计应该单独包含（在 CSS 文件中）的口头禅。

【讨论】：

表格布局并不简单。他们是懒惰的。有天壤之别。尝试维护某人的“简单”基于表格的布局，你会想要扯掉你的头发。 CSS 的魔力不在于更短的前期开发时间，而是在未来的可维护性和可扩展性。
除了使可读性较差的标记、更多标记和不太可用的网站之外，这只是一个糟糕的做法在不合适的地方使用表格。另外，当你掌握了基于 CSS 的布局时，它比旧的基于表格的布局更快（除非你使用所见即所得的编辑器，因为代码质量低，你不应该这样做）。跨度>
表格非常适合布局。 CSS 还没有准备好处理许多典型的布局场景。任何尝试使用 CSS 进行基本布局以外的任何事情的人都可能是“CSS 宇航员”（请参阅这个很棒的答案 stackoverflow.com/a/527826/254441）

【解决方案3】：

Google 不必关心在搜索引擎中的排名... ;)

【讨论】：

【解决方案4】：

是的，同意。有时，只是有时表格就可以了。不是每个人都在编写针对每个可能的浏览器的网站，需要支持文本到语音等。一般来说，尝试学习和提高你的技能并使用 CSS 定位等，但如果有人使用表格来定位，也不会发生什么坏事网页上的东西。

也许这个问题应该是社区维基？

【讨论】：

我强烈反对这种说法。表格只有在您将表格数据放入其中时才可以使用；所有其他内容都应该以语义方式标记——这使得页面在不支持 CSS 时可以很好地回退。（我同意社区 wiki 位：)）
标记应该是语义的，并且与表示无关......但有时，表格是合适的，即使对于非表格数据也是如此。经济学胜过意识形态，尽管它会使事情变得更简单，但对于每一种情况都没有一种真正的方法。我避免使用像瘟疫这样的桌子，它们是 PITA，但如果你使用桌子，实际上不会有小猫死去，而且有时效果会更好。
你不会相信我对这个答案的反对意见。哎呀。 7 个赞成票和 8 个反对票，不少于。人们对这种事情感到非常奇怪。
@Neal - 你因为务实而得到了我的 +1。过去我很快就会对其他人做“错误”的事情做出判断，现在我更愿意为我的同龄人提供怀疑的好处，并意识到也许他们有充分的理由这样做，在不同的现实世界发展的当务之急——事情并不总是像学术摘要那样枯燥无味。 google 和 twitter 的实用主义者可能考虑得很周到，并且这样做是因为它现在最适合他们 - 而不是因为他们缺乏 css 技能或只是懒惰。

【解决方案5】：

这很糟糕，很痛苦，但渲染几乎可以保证在不同浏览器之间保持一致。

【讨论】：

什么是邪恶的？（请更具体！）
@n00ki3 - 恕我直言，与 CSS 布局相比，主要是标记的丑陋。
@n00ki3：表格用于表格数据；将它们用于布局是没有语义的、低效的、不可维护的，并且几乎肯定会混淆屏幕阅读器等。

【解决方案6】：

表格布局适用于大多数浏览器。谷歌和其他人希望覆盖所有用户，而不是部分或仅现代用户。拥有不同的布局或布局技术很难维护并且交付内容的成本很高。表格布局并不棘手。它直截了当。您不必寻找 css hack、浏览器不兼容或其他问题。

表格布局不好。因为你混合了布局和内容。

【讨论】：

【解决方案7】：

Twitter 在网络模式下的手机上运行良好。一些网络浏览器真的很可怕，所以我认为 Twitter 做了它必须做的事情。

考虑到这么多网站在手机上运行得多么糟糕，我更关心移动兼容性而不是 CSS 福音派的担忧。

【讨论】：

手机兼容等只要稍加注意就可以轻松实现。这就是为什么我们有@media。

【解决方案8】：

三个主要原因：

由于搜索引擎的原因，表格主要是不好的（还有一些问题是它们会稍微弄乱 DOM，但这还不算太糟糕）。人们不会在搜索引擎上搜索 Google，人们通常也不会在 Twitter 上搜索帖子。
表格几乎可以在所有浏览器上一致呈现，包括智能手机（尤其是 Twitter 的一个大问题）。
表消耗的带宽更少。这两个网站都有大量的数据负载，需要尽可能快的速度。

【讨论】：

你的第三点是错误的。与基于 CSS 的布局相比，表格实际上需要更长的时间来呈现。也许您的意思是“表格消耗的带宽更少”？
是的。谢谢指正。

【解决方案9】：

浏览器支持 - 这些人需要让他们的网站在所有网络浏览器（新的、旧的和晦涩的）上完美呈现。无论谁在使用他们的网站以及他们使用什么操作系统/浏览器，这些网站都需要正常工作。

每个网络浏览器都支持它自己的 CSS 实现，这会导致与各种浏览器中的 JavaScript DOM 支持类似的问题。

页面加载时间 - 他们的页面也针对页面加载时间进行了优化。如果用户加载页面的时间太长，他们就会去其他地方。仍然有很多用户没有宽带，甚至很多移动设备的连接速度都不是很快，具体取决于您所在的位置。

【讨论】：