Meta标签是HTML语言中HEAD区的一个辅助性标签,它位于HTML文档头部的
标记 和meta标签有如下的作用:
1.搜索引擎优化(SEO)
2.定义页面使用语言
3.自动刷新并指向新的页面
4.实现网页转换时的动态效果
5.控制页面缓冲
6.网页定级评价
7.控制网页显示的窗口
META标签有两个重要的属性:http-eqquiv属性(HTTP标题信息)和name属性(页面描述信息)。
name属性
name属性主要用于描述网页,与之对应的属性值为content,content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的。
meta标签的name属性语法格式是:
name属性主要有一下几种参数:
A、 keywords(关键字)
说明:keywords用来告诉搜索引擎你网页的关键字是什么,某些搜索引擎在遇到这些关键字时,会用这些关键字对文档进行分类
B、description(网站内容描述)
说明:description用来告诉搜索引擎你的网站主要内容
C、robots(机器人向导)
说明:robots用来告诉搜索机器人哪些页面需要索引,哪些页面不需要索引。content的参数有all,none,index,noindex,follow,nofollow。默认是all。
D、 author(作者)
说明:标注网页的作者
E、renderer(渲染)
说明:告诉浏览器你的渲染模式,指定浏览器默认内核,content的取值为webkit,ie-comp,ie-stand之一,区分大小写,分别代表用webkit内核,IE兼容内核,IE标准内核。
F、viewport(视图模式)
有六个属性:
1.width
:控制 viewport 的大小,为一个正整数,或字符串"width-device"为设备的宽度(单位为缩放为 100% 时的 CSS 的像素)
2.height
:和 width 相对应,指定视窗的高度,这个属性并不重要,很少使用
3.initial-scale
:初始缩放。即页面初始缩放程度。这是一个浮点值,是页面大小的一个乘数。例如,如果你设置初始缩放为“1.0”,那么,web页面在展现的时候就会以target density分辨率的1:1来展现。如果你设置为“2.0”,那么这个页面就会放大为2倍。
4.maximum-scale
:最大缩放。即允许的最大缩放程度。这也是一个浮点值,用以指出页面大小与屏幕大小相比的最大乘数。例如,如果你将这个值设置为“2.0”,那么这个页面与target size相比,最多能放大2倍。
5.user-scalable
:是否允许用户进行缩放,值为"no"或"yes", no 代表不允许,yes代表允许,如果你将其设置为no,那么minimum-scale 和 maximum-scale都将被忽略,因为根本不可能缩放。所有的缩放值都必须在0.01–10
的范围之内。
G、copyright(版权)
说明:标注版权
http-equiv属性
http-equiv顾名思义,相当于http的文件头作用,它可以向浏览器传回一些有用的信息,以帮助正确和精确地显示网页内容,与之对应的属性值为content,content中的内容其实就是各个参数的变量值。
meta标签的http-equiv属性语法格式是:
A、Expires(期限)
说明:可以用于设定网页的到期时间。一旦网页过期,必须到服务器上重新传输。注意:必须使用GMT的时间格式。
B、Pragma(cache模式)
说明:禁止浏览器从本地计算机的缓存中访问页面内容。注意:这样设定,访问者将无法脱机浏览。
C、Refresh(刷新)
说明:自动刷新并指向新页面。注意:其中的2是指停留2秒钟后自动刷新到URL网址。
D、Set-Cookie(cookie设定)
说明:如果网页过期,那么存盘的cookie将被删除。注意:必须使用GMT的时间格式。
E、Window-target(显示窗口的设定)
说明:强制页面在当前窗口以独立页面显示。注意:用来防止别人在框架里调用自己的页面。
F、content-Type(显示字符集的设定)
设定页面使用的字符集。meta标签的charset的信息参数如GB2312
时,代表说明网站是采用的编码是简体中文
;meta标签的charset的信息参数如ISO-8859-1
时,代表说明网站是采用的编码是英文
;meta标签的charset的信息参数如UTF-8
时,代表世界通用的语言编码
;
G、content-Language(显示语言的设定)
H、Cache-Control
Cache-Control指定请求和响应遵循的缓存机制。在请求消息或响应消息中设置Cache-Control并不会修改另一个消息处理过程中的缓存处理过程。
请求时的缓存指令包括no-cache、no-store、max-age、max-stale、min-fresh、only-if-cached
响应消息中的指令包括public、private、no-cache、no-store、no-transform、must-revalidate、proxy-revalidate、max-age。
各个消息中的指令含义如下
Public
:指示响应可被任何缓存区缓存
Private
:指示对于单个用户的整个或部分响应消息,不能被共享缓存处理。这允许服务器仅仅描述当用户的部分响应消息,此响应消息对于其他用户的请求无效
no-cache
指示请求或响应消息不能缓存
no-store
用于防止重要的信息被无意的发布。在请求消息中发送将使得请求和响应消息都不使用缓存。
max-age
指示客户机可以接收生存期不大于指定时间(以秒为单位)的响应
min-fresh
指示客户机可以接收响应时间小于当前时间加上指定时间的响应
max-stale
指示客户机可以接收超出超时期间的响应消息。如果指定max-stale消息的值,那么客户机可以接收超出超时期指定值之内的响应消息。
meta用法
H5标准声明,使用 HTML5 doctype,不区分大小写
标准的 lang 属性写法
声明文档使用的字符编码
优先使用 IE 最新版本和 Chrome
页面描述
页面关键词
网页作者
搜索引擎抓取
为移动设备添加 viewport
iOS 设备 begin
添加到主屏后的标题(iOS 6 新增)
是否启用 WebApp 全屏模式,删除苹果默认的工具栏和菜单栏
添加智能 App 广告条 Smart App Banner(iOS 6+ Safari)
设置苹果工具栏颜色
启用360浏览器的极速模式(webkit)
避免IE使用兼容模式
不让百度转码
针对手持设备优化,主要是针对一些老的不识别viewport的浏览器,比如黑莓
微软的老式浏览器
uc强制竖屏
QQ强制竖屏
UC强制全屏
QQ强制全屏
UC应用模式
QQ应用模式
windows phone 点击无高光
设置页面不缓存