meta标签详解

（//在学习JSP的编码机制中，发现自己一直忽视这个经常用，却不了解的标签。发现它的妙用真的很多，于是开始开始整理它的使用方法）

文章分两部分，首先说明<meta>的结构，即怎么用。再说明<meta>的用处。

<meta>的结构：

主要是两类结构，第一种<meta http-equiv="" content="">，第二种<meta name="" content="">。

一、<meta http-equiv="" content="">结构：

http-equiv的英文翻译为“超文本传输协议标题信息”，content为内容，是key-value的形式。name类型的meta标签也是一样。因此http-equiv和name的值有几种，meta标签就有几种的用法。

不同的是，http-equiv的meta标签作用主要是回应给浏览器一些有用的信息，以帮助正确和精确地显示网页内容。

（//蓝色表示该值为事例，可变）

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

说明：设定页面使用的字符集，用以说明主页制作所使用的文字已经语言，浏览器会根据此来调用相应的字符集显示page内容。

2、<Meta http-equiv=“Refresh” Content=”5; Url=http://www.downme.com“>

说明：让网页多长时间（秒）刷新自己，或在多长时间后让网页自动链接到其它网页。

3、<Meta http-equiv=”Expires“ Content=”Wed, 26 Feb 1997 08:21:57 GMT“>

说明：指定网页在缓存中的过期时间，一旦网页过期，必须到服务器上重新调阅。注意，必须使用GMT的时间格式，或直接设为0，数字表示多少时间后过期。

4、<Meta http-equiv=”Set-Cookie“ Content=”cookievalue=xxx; expires=Wednesday,21-Oct-98 16:14:21 GMT; path=/“>

说明：浏览器访问某个页面时会将它存在缓存中，下次再次访问时就可从缓存中读取，以提高速度。当你希望访问者每次都刷新你广告的图标，或每次都刷新你的计数器，就要禁用缓存了。通常HTML文件没有必要禁用缓存，对于ASP等页面，就可以使用禁用缓存，因为每次看到的页面都是在服务器动态生成的，缓存就失去意 义。如果网页过期，那么存盘的cookie将被删除。必须使用GMT的时间格式。

5、<Meta http-equiv=”Widow-target“ Content=”_top“>

说明：强制页面在当前窗口以独立页面显示。这个属性是用来防止别人在框架里调用你的页面。Content选项：_blank、_top、_self、_parent。

6、<Meta http-equiv=”Page-Enter“ Content=”blendTrans(Duration=0.5)“>

      <meta http-equiv=”Page-Exit“   Content=”blendTrans(Duration=0.5)“>

说明：这个是页面被载入和调出时的一些特效。blendTrans是动态滤镜的一种，产生渐隐效果。另一种动态滤镜RevealTrans也可以用于页面进入与退出效果:

（注意：这是IE私有的效果，其他浏览器不支持！）

<Meta http-equiv=”Page-Enter“ Content="revealTrans(duration=x, transition=y)">

<Meta http-equiv=”Page-Exit " Content="revealTrans(duration=x,transition=y)">

Duration表示滤镜特效的持续时间(单位：秒)

Transition滤镜类型。表示使用哪种特效，取值为0-23。

0 矩形缩小

1 矩形扩大

2 圆形缩小

3 圆形扩大

4 下到上刷新

5 上到下刷新

6 左到右刷新

7 右到左刷新

8 竖百叶窗

9 横百叶窗

10 错位横百叶窗

11 错位竖百叶窗

12 点扩散

13 左右到中间刷新

14 中间到左右刷新

15 中间到上下

16 上下到中间

17 右下到左上

18 右上到左下

19 左上到右下

20 左下到右上

21 横条

22 竖条

23 以上22种随机选择一种

(//这个真的是蛮华丽的，其实尤其是HTML5以后，浏览器可以识别更多的信息，在本地完成更多华丽的效果。)

7、<meta http-equiv="Pics-label" Contect="(PICS－1.1'http://www.rsac.org/ratingsv01.html'I gen comment 'RSACi North America Sever' by'inet@microsoft.com' for 'http://www.microsoft.com' on '1997.06.30T14:21－0500' r(n0 s0 v0 l0))">

说明：在IE的Internet选项中有一项内容设置，可以防止浏览一些受限制的网站，而网站的限制级别就是通过该参数来设置的。

还有一些真心用不到的功能，就不一一叙述了。

二、<meta name="" content="">结构：

格式与http-equiv一样，key-value的格式，区别在于name是描述网页的，对应于Content（网页内容），以便于搜索引擎机器人查找、分类（目前几乎所有的搜索引擎都使用网上机器人自动查找meta值来给网页分类）。即主要作用是搜索优化。

1、<meta name="Keywords" Content="关键词1,关键词2，关键词3,关键词4,……">

说明：为搜索引擎提供的关键字列表。这里有个技巧,你可以重复某一个单词,这样可以提高自己网站的排行位置,如：

<meta name="Keywords"  CONTENT="china,china,china,china'>

2、<Meta name=Description Content=你网页的简述>

说明：Description用来告诉搜索引擎你的网站主要内容。

3、<Meta name=Robots Content=All|None|Index|Noindex|Follow|Nofollow>

说明：Robots用来告诉搜索机器人哪些页面需要索引，哪些页面不需要索引。Content的参数有all、none、index、noindex、follow、nofollow。默认是all。

这是因为许多搜索引擎都通过放出robot/spider搜索来登录网站，这些robot/spider就要用到meta元素的一些特性来决定怎样登录。

all：文件将被检索，且页面上的链接可以被查询；

none：文件将不被检索，且页面上的链接不可以被查询；(和 noindex, no follow 起相同作用)

index：文件将被检索；（让robot/spider登录）

follow：页面上的链接可以被查询；

noindex：文件将不被检索，但页面上的链接可以被查询；(不让robot/spider登录)

nofollow：文件将不被检索，页面上的链接可以被查询。(不让robot/spider顺着此页的连接往下探找)

4、<Meta name="Author" Content="张三，abc@163.com">

说明：标注网页的作者或制作组

5、<Meta name="Copyright" Content="本版权归藏余地所有。All Rights Reserved">

说明：标注版权。

以上是META标签的一些基本用法，其中最重要的就是：Keywords和Description的设定。为什么呢？道理很简单，这两个语句可以让搜索引擎能准确的发现你，吸引更多的人访问你的站点!根据现在流行搜索引擎(Google，Lycos，AltaVista等)的工作原理，搜索引擎先派机器人自动在WWW上搜索，当发现新的网站时，便于检索页面中的Keywords和Description，并将其加入到自己的数据库，然后再根据关键词的密度将网站排序。