文章来源于网络收集而来，版权归原创者所有，如有侵权请及时联系！

它的含义是什么？（续）

发布于 2025-01-01 12:18:08 字数 5258 浏览 0 评论 0 收藏 0

`<head>`

<html> 的第一个子元素通常是 <head> 。 <head> 包含了元数据 metadata——用于描述页面而不是内容的数据（页面的内容通常是在 <body> 标签里面）。 <head> 本来就很讨厌，HTML5 也没有能让它变得好看点。我们一项项来说明 <head> 标签里面的东西：

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>My Weblog</title>
    <link rel="stylesheet" type="text/css" href="style-original.css" />
    <link rel="alternate" type="application/atom+xml"
                          title="My Weblog feed"
                          href="/feed/" />
    <link rel="search" type="application/opensearchdescription+xml"
                          title="My Weblog search"
                          href="opensearch.xml"  />
    <link rel="shortcut icon" href="/favicon.ico" />
</head>

字符编码

当你看到“文本”这个词时，你可能想到的是“我在电脑屏幕上看到的字符和符号”。但是，计算机并不懂如何处理字符和符号，它们只会处理位和字节。你在屏幕上看到的每段文本实际都是使用一种特定的字符编码进行存储的。现在有几百种字符编码，有一些专门为某些语言进行了优化，比如俄语、汉语或者英语，另外一些则可以处理多种语言。严格说来，字符编码就是提供了一种将你在屏幕上看到的字符和计算机内部的实际存储值的一种映射关系。

不过在实际应用中，情况要比上面的复杂得多。同一个字符可能有多种编码方式，但是每一种编码方式都要在内存或者硬盘上使用一种特定的字节序列进行存储。所以，你可以把字符编码想象成一种对文本的加密方式。当有人给你一段字节序列，要求你解释它所代表的“文本”时，你需要知道这个序列的编码方式是什么，然后你就可以根据这个编码方式进行解码，最后就可以得到它所代表的字符了。

那么，浏览器怎么知道服务器传来的那串字节是什么编码格式的呢？很高兴你意识到了这个问题。如果你熟悉 HTTP 头的话，你就会看到有这么一句：

Content-Type: text/html; charset="utf-8"

简单来说，这个 HTTP 头就告诉浏览器，服务器认为它发送给你的 HTML 文档使用的是 UTF-8 进行编码的。不幸的是，在这个庞大的 World Wide Web 的世界中，几乎没有网页作者能够控制他们的服务器。想象一下 Blogger：每一篇博文都是各自独立的作者写的，但是服务器是有 Google 提供的。所以，HTML4 提供了一种在 HTML 文档中指定其编码方式的方法。于是，你就可以看到下面这么一句：

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

同样，这句话就是告诉浏览器，网页作者认为他编写的 HTML 文档使用 UTF-8 编码。

这两种技术在 HTML 5 中仍然能够正常工作。HTTP 头具有更高的优先级，如果存在的话，它会覆盖掉 <meta> 标签的内容。但是，并不是所有人都会发送 HTTP 头，因此 <meta> 标签依然有用。事实上， <meta> 在 HTML 5 中变得简单了一些：

<meta charset="utf-8" />

所有都能识别这种写法。这种简单的写法是怎么发明的呢？下面是我能找到的最好的解释：

<meta charset=""> 的属性进行合并的理由是，UA 已经实现它了。因为人们通常在 meta 中不加引号，例如：

<META HTTP-EQUIV=Content-Type CONTENT=text/html; charset=ISO-8859-1>

FAQ
Q: 我从来不用特殊字符，还用使用字符编码吗？
A: 是的！你必须为每一个 HTML 页面指定指定一个编码格式。不指定的话可能会引起安全漏洞。

总结一下：编码方式很复杂，甚至有时候你从一些编写的不那么好的软件上剪贴复制文本都有可能出现乱码。你应当始终为每一个 HTML 文档指定字符编码，否则的话可能出现什么问题。你可以利用 HTTP Content-Type 头，或者 <meta http-equiv> 声明，或者更简短的 <meta charset> 来达到这一目的，但是，请记得一定要这么做！为了你自己，也为了整个 web 的流畅和可读。

链接关系

一般的链接（ <a href> ）简单地指向另外的页面。链接关系则是用来解释，你为什么要指向另外的页面。你可以这么理解：“我要指向另外的页面，因为…”

…这是一个包含了 CSS 规则的样式表，浏览器需要根据这些规则决定怎样渲染页面；
…这是一个订阅源，以标准的订阅格式包含了这个页面的全部内容；
…这是一个本页面的翻译；
…这是本页面的 PDF 格式；
…这是本页面所在的在线书籍的另外的章节。

等等等等。HTML5 将链接关系分为两类：

使用 link 标签可以创建两类链接。外部资源链接是链接到当前文档所需要的外部资源；超链接则链接到其它文档……
外部资源链接的行为由资源类型决定。

举刚刚说的例子，只有第一个（ref=”stylesheet”）是链接到外部资源的，其余都是链接到另外文档的超链接。你可以详细了解上面的例子，也可以不管。这些对于当前页面的显示都不是必须的。

通常，链接关系由页面 <head> 中的 <link> 标签定义。有些链接关系也可以由 <a> 定义，但这种情况很少见。HTML5 也允许在 <area> 元素上使用某些链接关系，但这种情况更加少见（HTML4 不允许）。

FAQ
Q: 我能自定义链接关系吗？
A: 新的链接关系看起来是无穷无尽的。为了避免定义一些垃圾的链接关系，WHATWG 负责维护一个链接关系的注册表，用于定义被接受的类型。

`rel = stylesheet`

下面让我们看一下第一个链接关系：

<link rel="stylesheet" href="style-original.css" type="text/css" />

这差不多是我们使用的最普遍的链接关系了。 <link rel="stylesheet"> 定义一个指向独立的 CSS 规则文件的链接。有一个小的改进可以让你在 HTML5 中丢弃类型属性。因为 web 上只有一种样式表语言，也就是 CSS，因此这就是 type 属性的默认值。这对所有浏览器都是适用的（如果未来又有了新的样式表语言，这个 type 属性肯定又会是必须的了）。

<link rel="stylesheet" href="style-original.css" />

`rel = alternate`

继续下一个：

<link rel="alternate"
       type="application/atom+xml"
       title="My Weblog feed"
       href="/feed/" />

这个链接关系也很常见。 <link rel="alternate"> 定义 RSS 或者 Atom 媒体类型，这提供一种所谓的“订阅源自动发现 feed autodiscovery”的能力。一个 feed 阅读器，例如 Google Reader，就可以通过这个 feed 发现最新的文章。很多浏览器也支持这种自动发现，会在 URL 旁边放置一个特殊的图标。（不同于 rel="stylesheet" ，这里的 type 属性是必须的，千万不要忘记写！）

rel="alternate" 存在一个奇怪的混合用例，甚至在 HTML4 中也是这样。HTML5 中，这一概念被澄清了，仅用于描述已有页面。正如你刚刚见到的那样，使用 rel="alternate" ，并且要结合 type=application/atom+xml ，暗示使用 Atom 订阅源。但是你也可以使用 rel="alternate" 结合别的 type 属性，来展示另外的格式，例如 PDF。

HTML5 也试图解决关于如何链接文档的翻译的一个存在了很久的混乱情况。HTML 4 说要使用 lang 属性，并结合 rel="alternate" 来指定被链接的文档的语言。但这是不对的。 HTML 4 Errata 文档罗列了 HTML4 标准的四种错误，其中一个就是如何使用 rel="alternate" 来制定文档的翻译语言。正确的方法在 HTML 4 Errata 被提出，现在已经被加入 HTML5，那就是使用 hreflang 属性。不幸的是，这个 errata 从来没有被 HTML4 标准接受，因为 W3C HTML Working Group 中已经没有人再为 HTML 工作了。

分享到QQ

分享到微博