“语义正确”是什么意思？

Question

我在 CSS 的讲座中经常听到这个术语。什么是语义化正确？

- johnny

---

@johnny：在发布问题之前，你是否尝试过搜索答案？这并不是一个坏问题，但人们已经对它写了很多。 - Mike Dinescu

是的，但是老实说，并且没有冒犯的意思，我不认为这些问题会有什么害处，也不明白为什么有些人被问到这些问题时会感到冒犯。如果我拥有一个网站，我也不会介意，因为这只会创造更多可以被索引的页面，我认为这有助于网站。但是，我查了一下，没有找到一个简单的答案。再次声明并无冒犯之意。我只是从未理解过这些抱怨。 - johnny

约翰尼说得对，只要问题是stackoverflow上原创的，那么它就是一个合法的问题。http://meta.stackexchange.com/questions/2686/how-should-you-respond-to-give-me-a-fish-rtfm-questions - TJ L

Answer 1

正确标注

它意味着你称呼某物时应当使用正确的名称。一个经典的例子就是如果某物是一个table，那么它应该包含行和列的数据。若用其来布局，则语义上是不正确的——你说“这是一个表格”，但实际上它并不是。

另一个例子：列表（<ul>或<ol>）通常用于将类似项（<li>）分组。你可能会使用div进行分组，每个项目使用<span>，并将每个span样式化为独立行并带有标点符号，这看起来可能是你想要的。但“这是一个列表”传达了更多信息。

符合HTML的理念

HTML代表“超文本标记语言”，其目的是标记或标注你的内容。你标注得越准确，越好。在HTML5中引入了新的元素，以便更准确地标注常见的网页部分，例如页眉和页脚。

使其更加有用

所有这些语义标注都有助于机器解析你的内容，从而有助于用户。例如：

• 了解你的元素是什么让浏览器使用合理的默认设置来确定其应该如何显示和行为。这意味着你需要做更少的自定义工作，并且在不同的浏览器中更有可能获得一致的结果。
• 浏览器可以正确地应用你的CSS（层叠样式表），描述每种内容类型应该如何显示。你可以提供替代样式，或者用户可以使用自己的样式；只要你已经语义化地标注了你的元素，像“我想把标题设为巨大字体”之类的规则就可以使用。

如果将逻辑部分分成每个有一个legend的fieldset，那么盲人使用的屏幕阅读器可以帮助他们更容易地填写表单。盲人用户可以听到legend文本并决定“哦，我可以跳过这个部分”，就像视力正常的用户通过阅读来决定一样。

当移动电话看到type="tel"（用于电话号码）的表单输入时，它们可以切换到数字键盘。

- Nathan Long

Answer 2

语义基本上意味着"意义的研究"。

通常，当人们谈论代码是否具有语义正确性时，他们指的是准确描述某些东西的代码。

在(x)HTML中，有一些标签可以为它们所包含的内容赋予意义。例如：

一个H1标签将其包含的数据描述为一级标题。一个H2标签将其包含的数据描述为二级标题。这背后的暗示是每个H1下面的H2在某种程度上相关（即标题和子标题）。

当你以语义方式编码时，你基本上是给你所描述的数据赋予了意义。

考虑以下两个语义化VS非语义化的样例：

<h1>Heading</h1>
<h2>Subheading</h2>

VS一个没有语义的等效物:

<p><strong>Heading</strong></p>
<p><em>Subheading</em></p>

有时你可能会听到辩论中的人说：“你只是在纠缠于词义问题”，这通常是指用不同的词语表达与对方相同的意思。

- Jamie Dixon

---

我不知道“语义”这个词的实际含义，非常启发人。 - Timo Huovinen

Answer 3

"语义正确的元素使用意味着您将其用于它们应该被用于的目的。这意味着您使用表格来呈现数据而不是布局，意味着您使用列表来列举事物，strong和em来强调文本等等。"

来源： http://www.codingforums.com/archive/index.php/t-53165.html

- cakeforcerberus

Answer 4

HTML元素具有含义。 "语义正确"意味着您的元素 表示 它们应该表示的内容。

例如，您的定义列表在代码中由<dl>列表表示，您的缩写是<abbr>等。

- Kenan Banks

Answer 5

这意味着HTML元素在正确的上下文中使用（不像表格被用于设计目的），CSS类以人类可理解的方式命名，文档本身具有结构，可以被非浏览器客户端处理，例如屏幕阅读器、自动解析器尝试从文档中提取信息及其结构等。

例如，您使用列表来构建菜单。这样，残障人士的屏幕阅读器将知道这些列表项是同一菜单级别的部分，因此它将按顺序读取它们供人选择。

- user151323

Answer 6

我从来没有在纯CSS的语境下听说过这个词，但是在谈论CSS和HTML时，它意味着使用正确的标签（例如，避免使用表格标签来处理非表格数据），为标识所包含的数据提供正确的class和id值（并在适当的情况下使用{{link1：微格式}}），等等。

这一切都是为了确保您的数据可以被人类理解（一切都正确地显示）和计算机（一切都被正确地识别和标记）。

- Thomas Owens

---

它在纯CSS上下文中也存在。考虑不同的图像替换技巧（例如FIR），这些技巧在span内部将替代文本设置为display: none。这在语义上是错误的，会导致屏幕阅读器软件在看到CSS时跳过文本，即使它应该被阅读（毕竟，替代文本正是为了盲用户受益而存在）。 - Konrad Rudolph