HTML 大杂烩 // Comee

!DOCTYPE html

<!DOCTYPE> 声明必须是 HTML 文档的第一行，位于 <html> 标签之前，作用是告诉浏览器使用 Standards Mode 来解析整个文档。

不区分大小写，常见的写法有：

<!DOCTYPE html>
<!Doctype html>
<!doctype html>

text/html 文档常用模式（详情参见Activating Browser Modes with Doctype）：

Quirks Mode （怪异模式）
Standards Mode （标准模式）
Almost Standards Mode （几乎标准模式）

检查浏览器使用的解析模式：

var mode = document.compatMode;

if (mode === 'CSS1Compat') {
	document.write('This document is rendered in <em>Standards mode</em>.');
} else if (mode === 'BackCompat') {
	document.write('This document is rendered in <em>Quirks mode</em>.');
} else {
	document.write('This document is weird.  document.compatMode = ' + mode);
}

为什么 <!DOCTYPE html> 声明兼容 IE6 ？
在 HTML Design Principles、Jeremy Keith谈HTML5设计原则中有说到 HTML5 设计原则，其实早期版本的浏览器并不需要文档声明，在进行元素和属性解析时，只是根据浏览器可以识别的内容来进行解析，不可以识别的内容就使用内置的默认方式来解析，那时候的 !DOCTYPE 主要是给 Validator 用的。但是 The Macintosh version of Internet Explorer 5.0 开启了新的模式，通过检测 !DOCTYPE 来决定是采用 W3C 建议的 Standards Mode 还是采用之前的非标准化的 Quirks Mode 。Internet Explorer 6.0 作为后来版本，自然也支持根据 !DOCTYPE 来开启对应的解析方式。详细内容可参见：!DOCTYPE。

prefix=”og:http://ogp.me/ns#“

<html prefix="og: http://ogp.me/ns#">
og 是一种新的 HTTP 头部标记，即 Open Graph Protocol：

The Open Graph Protocol enables any web page to become a rich object in a social graph.

即这种协议可以让网页成为一个富媒体对象。

用了 meta property=og 标签，就是你同意了网页内容可以被其他社会化网站引用等，目前这种协议被 SNS 网站如 Fackbook 、 renren 采用。

SNS 已经成为网络上的一大热门应用，优质的内容通过分享在好友间迅速传播。为了提高站外内容的传播效率， 2010 年 F8 会议上 Facebook 公布了一套开放内容协议 (Open Graph Protocol) ，任何网页只要遵守该协议，SNS 就能从页面上提取最有效的信息并呈现给用户。

Open Graph Protocol 的官网为 http://ogp.me/ ，里面有详细的使用说明。

html lang=”zh-Hans-CN” 还是 html lang=”zh-CN”

在 HTML 5.1 Nightly W3C Editor’s Draft 03 October 2015 中指出，目前最新的语言标签标记法的国际标准是 IETF 的 BCP 47(Best Current Practice)，也就是 RFC 5646，取代了之前的RFC 4646、3066 和1766。

RFC 5646和之前版本的区别：

所有子标签都在 IANA registry 查询。
所有子标签有固定的位置和长度。
描述更具灵活性。

RFC 5646规定语言标签按以下形式排列：
language-extlang-script-region-variant-extension-privateuse

所有语言标签都是大小写无关的，但是依照惯例 language 标签小写，region 标签大写，script 标签首字大写。

所有标签都可以在 IANA registry 查询，获取更多信息可以阅读 Choosing a language tag、Language tags in HTML and XML。

如果仔细看语言tag（bcp47）的BNF语法定义，bcp47 中语言 tag 的 BNF 语法定义在的第三、四页：

1
2
3

Language-Tag  = langtag             ; normal language tags
              / privateuse          ; private use tag
              / grandfathered       ; grandfathered tags

规范的语言 tag 必须是符合 3 种情况其中的一种。第二种的私有定义我们就不讨论了，而第三种为了兼容和过渡，比如zh-xiang，为什么说zh-xiang特例，后面会说到。

我们只关注第一种情况：看看 langtag 的定义：

langtag       = language
                ["-" script]
                ["-" region]
                *("-" variant)
                *("-" extension)
                ["-" privateuse]

language      = 2*3ALPHA            ; shortest ISO 639 code
                ["-" extlang]       ; sometimes followed by
                                    ; extended language subtags
              / 4ALPHA              ; or reserved for future use
              / 5*8ALPHA            ; or registered language subtag

extlang       = 3ALPHA              ; selected ISO 639 codes
                *2("-" 3ALPHA)      ; permanently reserved

script        = 4ALPHA              ; ISO 15924 code

region        = 2ALPHA              ; ISO 3166-1 code
              / 3DIGIT              ; UN M.49 code

variant       = 5*8alphanum         ; registered variants
              / (DIGIT 3alphanum)

extension     = singleton 1*("-" (2*8alphanum))

                                    ; Single alphanumerics
                                    ; "x" reserved for private use
singleton     = DIGIT               ; 0 - 9
              / %x41-57             ; A - W
              / %x59-5A             ; Y - Z
              / %x61-77             ; a - w
              / %x79-7A             ; y - z

privateuse    = "x" 1*("-" (1*8alphanum))

grandfathered = irregular           ; non-redundant tags registered
              / regular             ; during the RFC 3066 era

irregular     = "en-GB-oed"         ; irregular tags do not match
              / "i-ami"             ; the 'langtag' production and
              / "i-bnn"             ; would not otherwise be
              / "i-default"         ; considered 'well-formed'
              / "i-enochian"        ; These tags are all valid,
              / "i-hak"             ; but most are deprecated
              / "i-klingon"         ; in favor of more modern
              / "i-lux"             ; subtags or subtag
              / "i-mingo"           ; combination

langtag 定义中很明确：language 是必须的，后面 script ， region ， variant 都为可选，且必须使用 - 分隔， varient 和 extension 可以出现 0 次或无数次，而 script 等只能出现 0 或 1 次。

这个最重要的 language 的定义有三种情况：使用最短 ISO 639 代码 2 个或 3 个字符（注意这个最短！！）加可选的 extlang （3 个字符长度的 ISO 639-3 代码）。 language 必须优先考虑 ISO 639-1 中的代码，如果没有则选择 639-2 中三位的，如果有 extlang ，那 extlang 必须使用 ISO 639-3 中的代码和扩展预留。

另外两种 language 的定义，一个是必须 4 个字符长度保留，另一个是 5 到 8 个字符的 subtag 。 subtag 其实就是一个符合 language 的定义，因为 extlang 的扩展可以出现 0 到 2 次，所以 subtag 的字符长度可能是 5-8 之间。

这里稍微岔开一下说说 ISO639 的问题， ISO639 规范下有 6 个部分， 639-1 是 2 字符编码， 639-2 是 3 字符编码，相对 ISO 639-1 来说另一种表示方法，他们都是属于 ISO 639 的一部分，不存在新旧替换的问题。用途不一，就比如说 ISO 639-2 存在两种编码， B 类用于书籍著作等， T 类则用于技术。接下来就是 639-3 ，其实是 ISO 639-2 的超集。剩下的 4、5、6 都是实现指导和族的分类编码等，干其他用的，和 bcf47 没太大关系。

zh 和 zho 在 639-3 中分类属于宏语言（macrolanguage，其实就像香蕉、苹果都叫水果一样，水果就属于macro）而 yue ， cmn 则是独立语言（individual）。在非 bcf47 的用途上说，zh-cmn-Hans 这种用法没错。但在 bcp47 中，这种用法则不符合 shortest ISO 639 code 这一要求。所以 language 定义的要优先考虑 ISO 639-1 的编码，如果不存在则使用 ISO 639-2 。需要 extlang ，则从 ISO 639-3 中 individual 选取，因为 macrolanguage 的编码在 639-1 和 639-2 中已经有了。因此 zh, zh-yue, ar, ar-arb 都是符合规范的 language 定义的。

所以说 zh-xiang 并不符合 language 的语义定义，它定义于 grandfathered 中为了兼容和过度。

接着 language 后都是可选的，但必须保证先后次序！ script 是描述使用脚本，按我意思理解就是使用哪种文字表述方式，这个值必须使用 ISO 15924 的编码， 4 个字符长度。获取 ios 系统的语言环境就可以见到这种 language+script 方式。比如简体中文就是 zh-Hans ，繁体中文就是 zh-Hant 。

我们如果是在 ios 中获取 locale 信息，返回的就是 language+script+region ， region 的定义使用 ISO 3166-1 的 2 个大写字符编码或者 UN M.49 三位数字编码。比如 US、TW、CN 。当然我们如果不用 script 那就是我们最最常见的了：zh-TW、zh-CN、en-US、en-GB 。基本大部分操作系统和浏览器依然沿用这种 language+region 的方式。其实形式是非常符合规范的，没有听说要替换！剩下就是可以出现 0 次或 n 次的和变体和扩展，这个除非你针对非常专业语言分类才用得上。对于技术上说，网页和操作系统，基本也就是 language+script+region 就足够了！

接下来回答这个纠结的问题，究竟用 zh ，还是 zh-CN 。我的意见是语言声明写不写用处不大，你要关心的是你采用的什么字符集而已，如果是 utf8 编码，你页面就是写泰语、日语、韩语和汉语，照样都能显示！除非你用的特殊字体，访问者电脑上没这些字体。

如果你是想做网站的自动多国语言支持，浏览器请求头中 Accept-Language 中告诉你用户正在使用哪种语言，你就可以根据请求中的语言标记来安排服务器返回什么语言的内容给他。

linxu、windows、mac的应用程序实现的自动多国语言支持也是这样，去访问系统或提供给你的 locale 信息，这个信息都是符合 bcp47 的。开发程序时，就不要文字内容写带代码中，而是提供语言包，程序根据获取到的当前的 locale 信息去判断应该使用那个语言包。只不过有些系统提供的是 language+region ，如：linux，android 等。有些是用 language+script+region 如苹果的系统。

综上所述，HTML 页面中使用 lang="zh-CN" 就 OK 了。其实查看一些大型网站，你就会发现，简体中文基本使用的都是 lang="zh-CN" ，繁体中文（香港）一般使用 lang="zh-HK" 。

itemscope 与 itemtype

<head itemscope itemtype="http://schema.org/WebSite"> 这个是 HTML 微数据的应用，在 W3C 规范 HTML Microdata 中有介绍。HTML Microdata 是对搜索引擎友好的，是 SEO(Search Engine Optimization) 的一部分。

简单介绍下：
itemscope
定义一组名值对，称为项。

itemprop=”属性名”
添加一个数据项属性。这个属性名可以是个单词或是个 URL ，与元素包含的文本值相关：

对于大部分元素，属性名值就是元素标签里面的文本值（不是所有标签）。
对于有URL属性的元素，该值就是 URL （如 <img src="">, <a href="">, <object data=""> 等）。
对于 <time> 元素，该值就是 datetime="" 属性。
对于 <meta itemprop="" content=""> ，该值就是 content="" 属性。

itemref=””
允许微数据项通过指向特定 ID （含有需要属性的元素）包含非后代属性。

itemtype=””
微数据定义的类型。其值为 URL ，扮演词汇表名称的作用。

itemid=””
允许词汇表给微数据项定义一个全局标识符，例如书的 ISBN 数值，在同样元素上使用 itemid 作为数据项的 itemscope 和 itemtype 属性。

微数据词汇表有三： schema.org 词汇表， Google 丰富摘要词汇表(www.data-vocabulary.org)， WHATWG/microformats.org 词汇表。

Google 丰富摘要词汇支持微格式和 RDFa ，这是除了微数据之外其他两个增加内容语义的方法。除了这种差异外，基本上与 schema.org 是相匹配的，除非他们在 itemtype 中使用 www.data-vocabulary.org 代替 schema.org 。尽管 google 仍然支持这类词汇，但是最新的 schema.org 提供了更多的词汇，这些词汇还被 Bing 和 Yahoo 支持，因此在选择微数据上 schema.org 可以让你笑得更久。不过您可能仍然希望嵌入”富文档摘要”，因为它们代码更简单，书写的时候要比 schema.org 来得更好。

`X-UA-Compatible`

X-UA-Compatible 是在 IE8 才开始支持的，<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7, IE=9" /> 表示 IE7 使用 IE7 的 Document Mode.aspx)，IE9 使用 IE9 Mode(if a valid <!DOCTYPE> declaration is present, otherwise Quirks Mode.)，IE8 则模拟 IE7的文档模式，使用 IE7 Mode(if a valid <!DOCTYPE> declaration is present, otherwise Quirks Mode.)。
详细介绍请参照：http://stackoverflow.com/questions/6771258/whats-the-difference-if-meta-http-equiv-x-ua-compatible-content-ie-edge-e

下面为部分提取的内容：
The X-UA-Compatible meta tag allows web authors to choose what version of Internet Explorer the page should be rendered as. IE11 has made changes to these modes; see the IE11 note below. Microsoft Edge, the browser that will be released after IE11, will only honor the X-UA-Compatible meta tag in certain circumstances. See the Microsoft Edge note below.

According to Microsoft, when using the X-UA-Compatible tag, it should be as high as possible in your document head:

If you are using the X-UA-Compatible META tag you want to place it as close to the top of the page’s HEAD as possible. Internet Explorer begins interpreting markup using the latest version. When Internet Explorer encounters the X-UA-Compatible META tag it starts over using the designated version’s engine. This is a performance hit because the browser must stop and restart analyzing the content.

Here are your options:

“IE=edge”
“IE=11”
“IE=EmulateIE11”
“IE=10”
“IE=EmulateIE10”
“IE=9”
“IE=EmulateIE9
“IE=8”
“IE=EmulateIE8”
“IE=7”
“IE=EmulateIE7”
“IE=5”

To attempt to understand what each means, here are definitions provided by Microsoft:

Internet Explorer supports a number of document compatibility modes that enable different features and can affect the way content is displayed:

Edge mode tells Internet Explorer to display content in the highest mode available. With Internet Explorer 9, this is equivalent to IE9 mode. If a future release of Internet Explorer supported a higher compatibility mode, pages set to edge mode would appear in the highest mode supported by that version. Those same pages would still appear in IE9 mode when viewed with Internet Explorer 9. Internet Explorer supports a number of document compatibility modes that enable different features and can affect the way content is displayed:

IE11 mode provides the highest support available for established and emerging industry standards, including the HTML5, CSS3 and others.
IE10 mode provides the highest support available for established and emerging industry standards, including the HTML5, CSS3 and others.

IE9 mode provides the highest support available for established and emerging industry standards, including the HTML5 (Working Draft), W3C Cascading Style Sheets Level 3 Specification (Working Draft), Scalable Vector Graphics (SVG) 1.0 Specification, and others. [Editor Note: IE 9 does not support CSS3 animations].

IE8 mode supports many established standards, including the W3C Cascading Style Sheets Level 2.1 Specification and the W3C Selectors API; it also provides limited support for the W3C Cascading Style Sheets Level 3 Specification (Working Draft) and other emerging standards.

IE7 mode renders content as if it were displayed in standards mode by Internet Explorer 7, whether or not the page contains a directive.

Emulate IE9 mode tells Internet Explorer to use the directive to determine how to render content. Standards mode directives are displayed in IE9 mode and quirks mode directives are displayed in IE5 mode. Unlike IE9 mode, Emulate IE9 mode respects the directive.

Emulate IE8 mode tells Internet Explorer to use the directive to determine how to render content. Standards mode directives are displayed in IE8 mode and quirks mode directives are displayed in IE5 mode. Unlike IE8 mode, Emulate IE8 mode respects the directive.

Emulate IE7 mode tells Internet Explorer to use the directive to determine how to render content. Standards mode directives are displayed in Internet Explorer 7 standards mode and quirks mode directives are displayed in IE5 mode. Unlike IE7 mode, Emulate IE7 mode respects the directive. For many web sites, this is the preferred compatibility mode.

IE5 mode renders content as if it were displayed in quirks mode by Internet Explorer 7, which is very similar to the way content was displayed in Microsoft Internet Explorer 5.

IE 10 NOTE: As of Internet Explorer 10, quirks mode behaves differently than it did in earlier versions of the browser. In Windows Internet Explorer 9 and earlier versions, quirks mode restricted the webpage to the features supported by Microsoft Internet Explorer 5.5. In Internet Explorer 10, quirks mode conforms to the differences specified in the HTML5 specification.

Personally, I always choose the http-equiv=”X-UA-Compatible” content=”IE=edge” meta tag, as older versions have plenty of bugs, and I do not want IE to decide to go into “Compatibility mode” and show my site as IE7 vs IE8 or 9. I always prefer the latest version of IE.

IE 11
From Microsoft:

Starting with IE11, edge mode is the preferred document mode; it represents the highest support for modern standards available to the browser.

Use the HTML5 document type declaration to enable edge mode:

<!doctype html>

Edge mode was introduced in Internet Explorer 8 and has been available in each subsequent release. Note that the features supported by edge mode are limited to those supported by the specific version of the browser rendering the content.

Starting with IE11, document modes are deprecated and should no longer be used, except on a temporary basis. Make sure to update sites that rely on legacy features and document modes to reflect modern standards.

If you must target a specific document mode so that your site functions while you rework it to support modern standards and features, be aware that you’re using a transitional feature, one that may not be available in future versions.

If you currently use the x-ua-compatible header to target a legacy document mode, it’s possible your site won’t reflect the best experience available with IE11.

Microsoft Edge (Replacement for Internet Explorer that comes bundled with Windows 10)

Information on X-UA-Compatible meta tag for the “Edge” version of IE. From Microsoft:

Introducing the “living” Edge document mode

As we announced in August 2013, we are deprecating document modes as of IE11. With our latest platform updates, the need for legacy document modes is primarily limited to Enterprise legacy web apps. With new architectural changes, these legacy document modes will be isolated from changes in the “living” Edge mode, which will help to guarantee a much higher level of compatibility for customers who depend on those modes and help us move even faster on improvements in Edge. The next major version of IE will still honor document modes served by intranet sites, sites on the Compatibility View list, and when used with Enterprise Mode only.

Public Internet sites will be rendered with the new Edge mode platform (ignoring X-UA-Compatible). It is our goal that Edge is the “living” document mode from here out and no further document modes will be introduced going forward.

With the changes in Microsoft Edge to no longer support document modes in most cases, Microsoft has a tool to scan your site to check and see if it has code that is not compatible with Edge.

Chrome=1 Info for IE

There is also chrome=1 that you can use or use together with one of the above options, EX: <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"> chrome=1 is for Google’s Chrome Frame which is defined as:

Google Chrome Frame is an open source browser plug-in. Users who have the plug-in installed have access to Google Chrome’s open web technologies and speedy JavaScript engine when they open pages in the browser.

Google Chrome Frame seamlessly enhances your browsing experience in Internet Explorer. It displays Google Chrome Frame enabled sites using Google Chrome’s rendering technology, giving you access to the latest HTML5 features as well as Google Chrome’s performance and security features without in any way interrupting your usual browser usage.

When Google Chrome Frame is installed, the web just gets better without you having to think about it.

But for that plug-in to work you must use chrome=1 in the X-UA-Compatible meta tag.

More info on Chrome Frame can be found here.

Note: Google Chrome Frame only works for IE6 through IE9, and was retired on February 25, 2014. More info can be found here.

Validation:

HTML5:
The page will validate using the W3 Validator only when using <meta http-equiv="X-UA-Compatible" content="IE=Edge">. For other values it will throw the error: A meta element with an http-equiv attribute whose value is X-UA-Compatible must have a content attribute with the value IE=edge. In other words, if you have IE=edge,chrome=1 it will not validate. I ignore this error completely as modern browsers simply ignore this line of code.

If you must have completely valid code then consider doing this on the server level by setting HTTP header. As a note, Microsoft says, If both of these instructions are sent (meta and HTTP), the developer’s preference (meta element) takes precedence over the web server setting (HTTP header).

XHTML

There isn’t an issue with validation when using <meta http-equiv="X-UA-Compatible" content="IE=Edge" /> as long as the tag is properly closed, IE: /> vs >

For more information on X-UA-Compatible see Microsoft’s Website Defining Document Compatibility.aspx).

For more information on what IE supports see the website caniuse.com

`viewport`

什么是Viewport

手机浏览器是把页面放在一个虚拟的“窗口”（viewport）中，通常这个虚拟的“窗口”（viewport）比屏幕宽，这样就不用把每个网页挤到很小的窗口中（这样会破坏没有针对手机浏览器优化的网页的布局），用户可以通过平移和缩放来看网页的不同部分。移动版的 Safari 浏览器最新引进了 viewport 这个 meta tag ，让网页开发者来控制 viewport 的大小和缩放，其他手机浏览器也基本支持。

Viewport 基础

一个常用的针对移动网页优化过的页面的 viewport meta 标签大致如下：

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

width：控制 viewport 的大小，可以指定的一个值，如果 600，或者特殊的值，如 device-width 为设备的宽度（单位为缩放为 100% 时的 CSS 的像素）。
height：和 width 相对应，指定高度。
initial-scale：初始缩放比例，也即是当页面第一次 load 的时候缩放比例。
maximum-scale：允许用户缩放到的最大比例。
minimum-scale：允许用户缩放到的最小比例。
user-scalable：用户是否可以手动缩放

Viewport 参考资料

Mozilla 开发者博客上有 viewport 使用教程：在移动浏览器中使用viewport元标签控制布局。
Apple 开发者站上面有 viewport 详细的描述：Configuring the Viewport。
quirksmode.org 有详细的 viewport 在各个手机浏览器不同之处介绍：A tale of two viewports — part one、A tale of two viewports — part two。

link rel=”index” 和 link rel=”home”

<link rel="index" href="http://www.apple.com/sitemap/" /> 和 <link rel="home" href="http://www.apple.com/" />
定义和用法

rel 属性规定当前文档与被链接文档/资源之间的关系。

只有当使用 href 属性时，才能使用 rel 属性。

HTML 4.01 与 HTML 5 之间的差异

已删除的值：appendix, chapter, contents, copyright, glossary, index, section, start, subsection

新值：archives, author, bookmark, external, first, index, last, license, nofollow, noreferrer, pingback, search, sidebar, tag, up

语法
<link rel="value">

属性值

值	描述
alternate	链接到该文档的替代版本（例如打印页、翻译或镜像）
author	链接到该文档的作者。
help	链接到帮助文档。
icon	表示该文档的图标。
licence	链接到该文档的版权信息。
next	集合中的下一个文档。
pingback	指向 pingback 服务器的 URL。
prefetch	规定应该对目标文档进行缓存。
prev	集合中的前一个文档。
search	链接到针对文档的搜索工具。
sidebar	链接到应该显示在浏览器侧栏的文档。
stylesheet	指向要导入的样式表的 URL。
tag	描述当前文档的标签（关键词）。

可见在 HTML5 中 <link rel="index"> 已经被删除，但是 <link rel="home"> 这个值也没有出现在 HTML5 中，仔细搜索一番，原来是和微格式有关。

link rel=”canonical”

rel="canonical" 属性让搜索引擎知道当前网站中的重复或相似网页中，哪一个页面才是站长想让其抓取与收录的

canonical 属性值通常在，rel属性中出现
引用网址
canonical 从功能上来讲，可理解为301永久重定向的辅助功能【这种理解是错的，请参见 What the Rel=Canonical Tag Isn’t】
canonical 可以与相对链接或绝对链接一起使用，但是建议使用绝对链接
Google 对 canonical 的定义是：规范网页是一组内容高度相似的网页的首选版本

在 What is rel=canonical and Why Should I Use It? 一文中指出不能滥用该属性：

you should never point all your pages to your home page as the canonical page

Good places to use the rel="canonical" link include:

Sites with dynamic URLs — You can use it to define which URL format you prefer
Ecommerce sites, especiall on product lists — When your customers change the sorting criteria, that new URL doesn’t need to be indexed
Syndicated content — publishers using the content you wrote should include the rel=canonical link on their pages pointing to your original document

Syndicated content:

A feed, also known as RSS feed, XML feed, or syndicated content, is website content that can be automatically delivered to your browser.
提要（也称为“RSS提要”、“XML提要”或“聚合内容”）是可自动发送给浏览器的网站

rel="canonical" 的另外一种应用案例：

假设一家网站同时提供了白皮书的 HTML 页面与可下载的 PDF 版本，URL 分别为：
http://www.example.com/white-paper.html
http://www.example.com/white-paper.pdf

这时，站长可以在 PDF 文件被请求时通过 rel="canonical" HTTP 头通告 Google 该 PDF 下载版的 canonical URL 就是相应的 HTML 文档;例如：

1
2
3

GET /white-paper.pdf HTTP/1.1
Host: www.example.com
(...HTTP 请求头的其余部分...)

使用 rel="canonical" ：

HTTP/1.1 200 OK
Content-Type: application/pdf
Link: <http://www.example.com/white-paper.html>; rel="canonical"
Content-Length: 785710
(... HTTP 响应头的其余部分...)

Comee

HTML 大杂烩