元数据(Metadata)
元数据(Metadata),简单来说就是描述数据的数据。例如,一个 HTML
文件是一种数据,但 HTML
文件也能在 <head>
元素中包含描述该文档的元数据,比如该文档的作者和概要。MDN
HTML <meta>
标签(元素)
HTML <meta>
元素表示那些不能由其它 HTML
元相关元素(<base>
、<link>
、<script>
、<style>
或 <title>
)之一表示的任何元数据信息。元数据不会显示在客户端,但是会被浏览器解析。
HTML <meta>
标签的作用
- 搜索引擎优化(SEO)
- 定义页面使用语言
- 自动刷新并指向新页面
- 实现网页转化时的动态效果
- 控制页面缓存
- 网页定级评价
- 控制网页显示的窗口等
HTML <meta>
标签在 HTML4.01 与 HTML5 之间的差异
在 HTML5 中,有一个新的属性 charset
,它使字符集的定义更加简洁:
- HTML4.01:
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
- HTML5:
<meta charset="UTF-8">
HTML <meta>
标签属性
属性 | 值 | 描述 |
---|---|---|
charset | character_set | 定义文档的字符集(如:UTF-8、ISO-8859-1) |
content | text | 定义与 name 或 http-equiv 属性相关的元信息 |
name | application-name、author、description、generator、keywords ... | 定义一个 HTML 文档的描述、关键词、作者 |
http-equiv | content-security-policy、content-type、default-style、x-ua-compatible、refresh ... | 把 content 属性关联到 HTTP 头部 |
scheme | format/URI | HTML5不支持。定义用于翻译 content 属性值的格式 |
说明:
content
属性是与name
、http-equiv
属性一起使用的,name
和http-equiv
定义属性名,content
定义属性值。
HTML <meta>
name 属性
HTML 规范定义了以下标准元数据名称:
application-name
: 网页中所运行的应该程序的名称author
:文档作者的名称description
:一段简短而精确的、对页面内容的描述。一些浏览器,比如 Firefox 和 Opera,将其用作书签的默认描述。generator
:生成此页面的软件的标识符(identifier)。keywords
:与页面内容相关的关键词,使用逗号分隔。referrer
:控制由当前文档发出的请求的 HTTP Referer 请求头。
CSS 颜色调整规范定义了以下元数据名称:
color-scheme
:指定与当前文档兼容的一种或多种配色方案。
CSS 设备适配规范定义了以下元数据名称:
viewport
:为视口的初始大小提供指示。目前仅用于移动设备。
其他元数据名称:
creator
:当前文档的创建者。googlebot
:robots
的替代名称,只被 Googlebot(Google 的网页爬虫/索引搜寻器)使用。publisher
:当前文档的发布者/出版者。robots
:爬虫、协作搜寻器,或者“机器人”,对此页面的处理行为,或者说,应当遵守的规则。
HTML <meta>
http-equiv 属性
http-equiv
属性定义了一个编译器指令。这个属性叫做 http-equiv 是因为所有允许的值都是特定 HTTP 头部的名称,如下:
content-security-policy
: 它允许页面作者定义当前页的内容策略。内容策略主要指定允许的服务器源和脚本端点,这有助于防止跨站点脚本攻击。content-type
:规定文档的字符编码。如果使用这个属性,其值必须是"text/html; charset=utf-8
"。default-style
:设置默认CSS样式表的名称。x-ua-compatible
:如果指定,则content
属性必须具有值 "IE=edge
"。用户代理必须忽略此指示。refresh
:定义重新载入页面的时间间隔(秒)或是重定向到指定链接的时间间隔。
其他元数据名称:
没在 MDN 看到有说明,不知道是否还有效...
expires
:可以用于设定网页的到期时间。一旦网页过期,必须到服务器上重新传输。Pragma
:是用于设定禁止浏览器从本地机的缓存中调阅页面内容,设定后一旦离开网页就无法从Cache中再调出。set-cookie
: 设置cookie
。如果网页过期,那么存盘的cookie将被删除。Window-target
:显示窗口的设定。强制页面在当前窗口以独立页面显示,用来防止别人在框架里调用自己的页面。Pics-label
: 网页等级评定。Page_Enter
:设定进入页面时的特殊效果Page_Exit
:设定离开页面时的特殊效果
示例:
<!-- 强制浏览器的渲染方式,默认使用chrome来渲染,然后再按照IE该浏览器的最新版本来渲染 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />