所有的浏览器都支持<meta>
标签,它提供有关页面的元信息,比如作者、日期和时间、网页描述、关键词、页面刷新等,该标签位于文档的头部,不包含任何内容,它的属性定义了与文档相关联的名称/值对。
meta标签的内容设计对于搜索引擎优化来说非常重要,合理利用meta标签的Keywords和Description属性,可以使网站更加贴近用户体验。
必须属性
content 属性提供了名称/值对中的值。该值可以是任何有效的字符串。
该属性始终要和 name 属性或 http-equiv 属性一起使用。
属性 | 值 | 描述 |
---|---|---|
content | some_text | 定义与 http-equiv 或 name 属性相关的元信息 |
meta标签共有两个可选属性系列,分别是http-equiv属性和name属性。
http-equiv属性
http-equiv属性为名称/值对提供了名称。并指示服务器在发送实际的文档之前先在要传送给浏览器的 MIME 文档头部包含名称/值对。
常用到的类型包含:网页到期时间、默认的脚本语言、默认的风格页语言、网页自动刷新时间等
当服务器向浏览器发送文档时,会先发送许多名称/值对。虽然有些服务器会发送许多这种名称/值对,但是所有服务器都至少要发送一个:content-type:text/html。这将告诉浏览器准备接受一个 HTML 文档。
属性 | 值 | 描述 |
---|---|---|
http-equiv | content-type expires refresh set-cookie | 把content属性关联到 HTTP 头部 |
使用带有 http-equiv 属性的 标签时,服务器将把名称/值对添加到发送给浏览器的内容头部。例如,添加:
<meta http-equiv="charset" content="utf-8">
<meta http-equiv="expires" content="3 October 2017">
<meta http-equiv="Pragma"content="no-cache">
发送到浏览器头部的信息就会包含:
content-type: text/html
charset:utf-8
expires:3 October 2017
Pragma:no-cache
name属性
name属性主要用于描述网页,常用的选项有keywords(关键字) ,description(网站内容描述),author(作者),robots(机器人向导)等等。还可以指定其他任意值
属性 | 值 | 描述 |
---|---|---|
name | keywords description author robots revised generator Copyright | 把content属性关联到一个名称 |
<meta name="keywords" content=""/>
<meta name="author" content="levinhax"/>
<meta name="description" content="less than 150 words" />
<meta name="robots" content="index,follow" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes" />
文章同步: levinhax’s Github Blog