创建符合标准的网页结构的正确方法答案

【问题标题】：Proper Way to Create Standards-Compliant Webpage Structure创建符合标准的网页结构的正确方法
【发布时间】：2011-01-28 20:05:18
【问题描述】：

在过去的几年里，我一直在处理涉及为我完成所有网页设计工作的包的项目。我承认我无法专注于实际的网页设计。

我想知道现在网站布局的标准是什么。现在布局表被看不起了吗？还是所有布局都使用 div 标签完成并通过 CSS 控制？框架甚至不再使用了吗？

请注意，当我说布局表时，我不是在谈论图表表格。

【问题讨论】：

我建议查看这个问题的 cmets 以获得关于这个主题的一些提示：stackoverflow.com/questions/2164179/…

标签： css html web frames

【解决方案1】：

现在布局表被看不起了吗？还是所有布局都使用 div 标签完成并通过 CSS 控制？框架甚至不再使用了吗？

这两种技术确实被看不起，并且适合在一天中的任何时候煽动对 SO 的名副其实的火焰战争。 :) 另外，即使是单独使用 div 标签在很大程度上也被视为已弃用，而是支持语义上更合理的元素，例如用于菜单和列表的ul/li，用于定义列表的dt/dd， h1、h2 用于标题等。这些都不是一成不变的，但它们大多是良好的实践，可以产生良好、干净的代码。

对于阅读，A List Apart 绝对是该问题上最好的文章资源之一。

关于一些基础知识（包括从表格转换）的精彩文章是来自同一站点的Practical CSS。

【讨论】：

【解决方案2】：

是的，表格不应该用于布局目的，并且多年来一直不赞成这样做。这些天也很少使用框架，你应该避免它们。您应该努力在您的网站中分离 content (HTML)、presentation (CSS) 和 behavior (JavaScript)。您可以使用 W3C 的在线验证器（HTML Validator、CSS Validator）来检查您的文档是否符合标准——当然，熟悉规范本身将有助于了解如何使用它们。

【讨论】：

Pekka 的火焰战争设想：表格是一种强大的布局工具，当您没有耐心进行大量测试和 CSS 浮动 hack 时使用它们。即使是带有 display:table-cell 的 DIV 仍然在“使用表格”。