html - 特定于布局的语义 html 元素有多重要？

Question

有一些标签与 div 元素没有任何不同，但“需要”来创建语义 HTML 文档。我的问题是，这有多重要？

我同意使用列表来显示产品列表或菜单等内容的重要性。 strong 标签让某些东西看起来更重要，或者使用 mark 标签来突出显示(找到的)关键词。我只是不知道 div 替代元素有哪些优势，比如

• 部分
• 放在一边
• 页脚
• 标题
• 文章
• 等...

当您不正确执行这些“布局”语义时，后果是什么？我读到它对电子阅读器和盲人有积极影响。但是当我使用程序作为 Dolphin Supernova测试我创建的网站是否适用于盲人我没有看到具有“正确”语义标记的页面与我用默认 div 替换所有布局元素的版本之间的任何区别 元素。那么为什么这些布局元素很重要。正确使用它们有什么优点。如果您没有正确使用它们，您会影响谁/什么。

Answer 1

您需要考虑将语义(含义)与表示(设计)分开。您可以仅使用 <span> 创建一个可怕的、困惑的 HTML 汤元素，但你可以让它看起来非常漂亮。 表示 会很好，但源代码的语义 会很糟糕。

现在，源代码语义对谁重要？对于与源代码交互但不与演示文稿交互的任何人。这可以是搜索引擎，它会尝试找到页面中最相关的内容，以便其他人在搜索您时可以找到您。这可以是屏幕阅读器，它试图让那些不关心您网站的视觉呈现但需要以其他方式访问内容的人可以访问内容。尝试阅读只有盲文显示器的 HTML 汤页，您很快就会学到一些新的脏话。

它也可能只是您，试图随着时间的推移有效地维护和扩展您自己的代码。

并不总是一种特定的好处或惩罚，但除非您开始生成语义 HTML，否则您将无法获得任何好处。网络的 future 是在许多不同类型的设备上的页面。如果您曾经希望能够在您的智能 watch 上看到您网站上的相关信息，那么该智能 watch 需要一种好方法来隐藏所有无关的内容，例如导航和标题，并快速放大实际内容。为了做到这一点，需要有一种标准化的方式来识别主要内容和辅助内容，而那些 HTML5 标签就是这样。

如果您知道某事的意思，您可以用许多不同的适当方式来表达它。如果您只是硬编码一个外观，它只能以该外观呈现。

今天唯一的优势可能是源代码的可读性更高，明天的优势将是您以前甚至无法想象的内容的新用例。如果你不认真对待语义，你永远不会到达那里。

也许作为一个更具体的例子:Opera 浏览器有(有？)一个实验性功能，它在地址栏下方显示一个额外的栏，其中包含用于导航您所在页面的按钮；使用它，您可以快速跳转到首页、下一页、索引页等。为此，浏览器显然需要知道“首页”或“下一页”是什么。没有标准，这是不可能弄清楚的。参见 here进一步解释。