时间戳

首页 > 技术文章 > HTML元数据<meta>标签

HTML元数据<meta>标签

webStudy2016 2016-12-19 09:17 原文

什么是元数据？为何需要元数据？

要理解这个问题，首先要知道“元”是什么。元(meta)，一般被我们翻译成“关于……的……”。

元数据(meta data)——“data about data” 关于数据的数据，一般是结构化数据（如存储在数据库里的数据，规定了字段的长度、类型等）。
元数据是指从信息资源中抽取出来的用于说明其特征、内容的结构化的数据(如题名,版本、出版数据、相关说明,包括检索点等)，用于组织、描述、检索、保存、管理信息和知识资源。

meta - 文档相关的元数据

Meta标签是用来描述HTML文档的信息。HTML语言中HEAD区的一个辅助性标签，它位于HTML文档头部的<head>标记 和<title>标记之间，它提供用户不可见的信息。

META标签有两个重要的属性：HTTP标题信息(HTTP-EQUIV)和页面描述信息(name)。此外，还有charset属性。

 

1、name属性是描述网页的，该属性不区分大小写。Meta标签的name属性语法格式：＜meta name="参数" content="具体参数值"＞

        meta - 文档相关的元数据。可用属性如下：name, http-equiv, content, charset
　　·　　<meta name="keywords/Description/Generator/Author/application-name/viewport/Copyright/robot"  content="">
　　　　 <meta http-equiv="content-language/content-type/default-style/refresh/Set-Cookie/Prama/Cache-Control/Expires/windows-Target/...." content="">
　　　　 <meta charset="UTF-8">


    <!--name, content 组合的示例如下（不全）-->

    <!--定义搜索引擎的关键字，一般可以写15个关键字-->
    <meta name="keywords" content="html5, flash, silverlight" />

    <!--定义文档的概要描述信息-->
    <meta name="description" content="介绍 html5 中的 meta 标签" />

    <!--定义文档的作者-->
    <meta name="author" content="webabcd" />

    <!--定义文档的生成（编辑）工具-->
    <meta name="generator" content="EditPlus" />

    <!--定义元数据的语言信息lang属性，用于语音合成器区分content属性所使用的语言，从而可以读出来。其中dir属性定义行文方向-->
    <meta name="author" content="webabcd" lang="US-en"  dir="ltr" />

    <!--如果把此 html5 文档看成一个应用程序，则此处定义应用程序名-。一般一个网页仅需声明一次该属性，以免混淆。如果网页不是实现一个web应用程序，而是仅呈现网页内容，就无需定义该元数据。-->
    <meta name="application-name" content="meta 标签的介绍" />
    <!--标注版权-->
    <meta name="copyright" content="本网站版权归mumakiss所有" />
    <!--通知搜索引擎多少天访问一次-->
    <meta name="revisit-after" content="7 days" />
　　<!--Robots用来告诉搜索机器人哪些页面需要索引，哪些页面不需要索引。
　　　　　　　　all：文件将被检索，且页面上的链接可以被查询；
　　　　　　　　none：文件将不被检索，且页面上的链接不可以被查询；
　　　　　　　　index：文件将被检索； 
　　　　　　　　follow：页面上的链接可以被查询；
　　　　　　　　noindex：文件将不被检索；
　　　　　　　　nofollow：页面上的链接不可以被查询。 -->　
　　<meta name="robots" content="All|None|Index|Noindex|Follow|Nofollow" />

其他：
　　<meta name="build" content="日期">
　　<meta name="reply-to" content="email">
　  <meta name="distribution" content="blobal">
　　<meta name="Rating" content="General"> 
　　<meta name="google" content="index,follow" />
　　<meta name="googlebot" content="index,follow" />
　　<meta name="baiduspider" content="index,follow" />
    <meta name="verify" content="index,follow" />  ？？？
2、实用元数据（属性http-equiv）

<!--http-equiv, content 组合的示例如下（不全）-->
HTML5定义了5个实用的元数据：content-language/content-type/default-style/refresh/Set-Cookie

    <!--定义文档内容的语言-->
    <meta http-equiv="content-language" content="zh-CN" /> 

    <!--定义文档内容的类型和使用的字符集-->
    <meta http-equiv="content-type" content="text/html;charset=gb2312" /> 

    <!--定义文档所使用的默认样式表的 title，从而在有多个样式表的时候，只使用指定 title 的样式表。-->
    <meta http-equiv="default-style" content="style/style.css" /> 

    <!--定义网页定时跳转，例每 100 秒刷新一次-->
　　 <!--用户可以用此功能制作一个封面，在若干时间后，自动带读者来到目录页。如果要使浏览器在完成后立即刷新页面，就可以将延迟时间定义为0秒。如果url没有定义，那么浏览器就会刷新本页。-->
    <meta http-equiv="refresh" content="100；url=http://yourlink" />

    <!--设置 cookie存活时间，需要注意的是必须使用GMT时间格式：“周，日 月 年 时间 GMT”-->
    <meta http-equiv="set-cookie" content="author=webabcd;" /> 
　　 <!--设置网页禁用浏览器缓存.强制调用网上最新版本的网页。以下分别为http1.0和http1.1版本-->
   <meta http-equiv="Pragma" content="no-cache" /> 
　 <meta http-equiv="Cache-Control" content="no-cache" />
　　<!--设置网页到期。该功能与禁用缓存相似。必须使用GMT时间格式。将时间设置为0会使浏览器每次都请求最新的网页。-->
    <meta http-equiv="expires" content="Tue,20 Aug 1996 14:25:27 GMT" />
　　<!--设置网页框架目标，设置将网页加载到哪个框架中。_top,_blank,_parent,_self.-->
    <meta http-equiv="window-Targetwindow-Target" content="_top" />   //表示强制页面在当前窗口以独立页面显示，可以防止自己的网页被别人当作一个框架页调用。
    <!--这是进来W3C的规范，指明页面中脚本的类型-->
    <meta http-equiv="Content-Script-Type" content="text/javascript" /> 
    <!--是针对ie8新加的一个设置，对于ie8之外的浏览器是不识别的，这个区别与content="IE=7"在无论页面是否包含<!DOCTYPE>指令，都像是使用了 Windows Internet Explorer 7的标准模式。而content="IE=EmulateIE7"模式遵循<!DOCTYPE>指令。对于多数网站来说，它是首选的兼容性模式。-->
    <meta http-equiv="X-UA-Compatible" content="IE=7" /> 
　 　<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
　　<!--设置网页转场效果。注意：所加载的页面不能够是框架页面，且仅适用于IE浏览器-->
    <meta http-equiv="Page-Enter" content="revealTrans(duration=20,transtion=50)" />
    <meta http-equiv="Page-Exit" content="revealTrans(duration=20,transtion=50)" />
　　　　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种随机选择一种 
　  <!--设置网页分级。使用分级审查，可以通过由“互联网内容选择平台”委员会独立定义的业界标准分级方法屏蔽掉不合适的内容，最一开始创建这个功能的原因是老师和家长想为孩子们屏蔽掉不健康的网站。-->
<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))"> 
   

3、<!--定义文档的编码类型-->
    <meta charset="utf-8">

推荐阅读