为什么我们不应该在设计中使用<table>？

为什么我们不应该设计带有表格的网站有哪些明确且合乎逻辑的原因？好处在哪里，什么因素推动了该行业的发展？什么时候可以使用桌子？

1）表不应用于页面布局，因为它们是：

• 由于浏览器需要下载大部分（如果不是全部）表格才能正确呈现，因此呈现速度较慢

• 与非表格布局相比，它们需要更多的HTML，这意味着加载和渲染速度较慢，带宽使用量也有所增加

• 它们可能会成为噩梦，因为它们会很快变得复杂

• 他们可以破坏文字复制

• 它们会对屏幕阅读器产生负面影响，并可能使某些用户无法访问您的内容

• 它们不像使用适当的语义标记那样灵活

• 它们从未打算用于页面布局

• 使表格成为响应式布局非常难控制

2）将表格用于表格数据。那就是表的用途。

另请参阅：人们为什么要使用div制作表格？

表用于表格数据，而非设计。人们常常误解了使页面“无桌面”的动机。

使用表格创建布局是错误的。您应使用其他元素进行布局（div，列表，节，文章，页眉，页脚，边线等）。而且，您可以用最少的HTML / CSS达到出色的效果（使代码在语义上有意义，轻巧且易于维护）。

当然，表格数据应位于表元素内。如果需要，您可以通过添加thead，tfoot，tbody，th，caption等来改善表的语义。所有这些元素都旨在与表一起使用，相信我，它们可以使您的表更具描述性。

因此，重要的是，不要采用基于表的设计，而要使用任何合适的HTML / CSS解决方案。从HTML语义标记开始，然后使用CSS进行设计。这样可以确保任何人的安全。使用此作为经验法则。

表应该包含数据，而不包含设计元素。

仅在显示表格数据时才使用表。否则，它们通常是显示的不佳选择。

不使用表的真正原因是：

表格的默认布局为： table-layout:fixed

这告诉浏览器分析表并修复单元格以包含其中的元素，这需要一些时间。（这就是为什么表如此适合复杂数据的原因）

底线：表将在呈现表中的所有内容之后呈现，与使用DIV元素时相反。

我将表格用于固定形式的Web设计结构，我知道很多人说表格是给新手使用的，其他人说表格是给老派的，那些总是说DIVS是最好的，但事实是表格对于某些事情是更好的，而DIVS对于其他的东西。

什么是a <br>或a 更好<p></p>？一样的东西

我和我的2015年新版网页设计中的旧桌子可以用友好的移动电话100％宽度与2个侧边栏（每个200像素）混合在一起，向所有人踢。

显然，在内部表中放置越来越多的表很丑陋，这就是DIVS派上用场的地方。表可以做div不能做的事情，而div可以做表不能做的事情。

那些说默认表布局是固定的吗？我举一个例子

<table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="200">left</td>
    <td width="100%">middle</td>
    <td width="200">right</td>
  </tr>
</table>

您现在看到潜力了吗？在PC和手机上看看它。是的，我什至不需要引导程序。

现在要对div进行同样的操作，您必须编写许多CSS代码来显示align float和crap。谁写的代码更少？我！客户需要什么？一个在1年或1个月后结束页面的家伙？

现在让我们使用div改进设计

<div style="width:100%; min-width:1000px; height:200px;">top menu or nav</div>
<table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="200">left</td>
    <td width="100%">middle</td>
    <td width="200">right</td>
  </tr>
</table>
<div style="width:100%; min-width:1000px; height:200px;">top menu or nav</div>

使用div和表的5列设计布局非常漂亮。

您的答案是：两者在一起可以更好地工作，并且速度更快，并且即使在电视和小型手机上，在任何设计上都看起来不错。