我是靠谱客的博主 幸福金毛,最近开发中收集的这篇文章主要介绍HTML文档meta标签的详解,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

概要:

<meta>标签是html文档中<head>内部的辅助性元标签。其主要功能提供有关页面的元信息(meta-information),比如针对搜索引擎的更新频度的描述和关键词。
meta标签通常用来为搜索引擎robots定义页面主题,或者是定义用户浏览器上的cookie;它可以用于鉴别作者,设定页面格式,标注内容提要和关键字;还可以设置页面使其可以根据你定义的时间间隔自动刷新,以及设置RASC内容等级,等等。
元信息(元数据)总是以名/值对的形式存在。

meta标签中主要有两个属性: http-equivname。以及一个必须使用的属性 content,用于对上述两种属性的值作进一步的定义。这两个属性分别用于描述一 部分http的头部信息页面的基本属性。

http-equiv:
与http的头部信息相关联,它回应给浏览器一些有用的信息,以帮助正确和精确地显示网页内容。
其主要属性值为:
  • content-type(设置当前文档的类型,字符集):文档类型可以是text/html、text/css、text/javascript等,字符集可以是utf-8、gb2312、iso-8859-1等。
  • expires(设定文档的过期时间即文档的有效期;当文档过期后,需要得到web服务器的验证有效性后,页面才会响应客户请求)
  • refresh(设定页面的刷新时间)
  • set-cookie(设定页面的cookie值)
  • Pragma(cache模式) :禁止浏览器从本地计算机的缓存中访问页面内容。
这些属性值与http头部信息的对应关系可以参考http头部信息详解http://www.cnblogs.com/ziwuge/archive/2011/09/27/2193385.html

示例:
设置文档类型和字符集
    <meta http-equiv = "Content-Type" content = "text/html; charset = utf-8"/>
    <meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"/>
设置页面的有效期
    <meta http-equiv = "Expires" content = "Wed. 06 Jan 2016"/>
    当时间到了设定的有效期时,页面需要得到服务器再次验证后才能响应页面请求。
设置页面刷新时间
    <meta http-equiv = "Refresh" content = "30;URL=http://www.w3shcool.com"/>
    30的单位是秒,表示30秒刷新一次页面;url表示刷新加载的页面的地址,如果无URL则刷新当前窗口页面。
设置缓存的模式
    <meta http-equiv = "Pragma" content = "no-cache"/>
    no-cache表示浏览器不缓存当前页面的内容到本机,不可脱机访问该页面。

name: 
描述网页的基本信息的,对应于Content网页内容,以便于搜索引擎机器人查找、分类

其主要属性值为:
  • author:标注网页的作者
  • description:description用来告诉搜索引擎你的网站主要内容
  • keywords:列举网页内容的关键词,便于搜索引擎查找、分类
  • generator:编辑网页所用的编辑器
  • revised:修订时间
示例: 
    <meta name = "Author" content = "Jery,jery@xxx.com"/>
    指明页面的作者和联系的邮箱。

    <meta name = "Description" content = "This page is about the cross screen research."/>
    该属性可用于告诉搜索引擎你的页面的主要内容。

     <meta name = "Keywords" content = "cross-screen,multi-device,node.js,web application"/>
    该属性的值,可为搜索引擎提供关键词列表,便于其对该页面归类。 META的通常用处是指定搜索引擎用来提高搜索质量的关键词。

以上就是对meta标签的主要功能及主要属性的总结,总之,在meta标签中主要的作用是可以利用description和keywords优化页面的SEO。

meta标签在html文档中不是必须有,但用好了可以带来很好的效果。

Tips:
以上是META标签的一些基本用法,其中最重要的就是:Keywords和Description的设定。为什么呢?道理很简单,这两个语句可以让搜索引擎能准确的发现你,吸引更多的人访问你的站点!根据现在流行搜索引擎的工作原理,搜索引擎先派机器人自动在WWW上搜索,当发现新的网站时,便于检索页面中的Keywords和Description,并将其加入到自己的数据库,然后再根据关键词的密度将网站排序。由此看来,我们必须记住添加Keywords和Description的META标签,并尽可能写好关键字和简介。否则后果就会是:
●如果你的页面中根本没有Keywords和Description的META标签,那么机器人是无法将你的站点加入数据库,网友也就不可能搜索到你的站点。
●如果你的关键字选的不好,关键字的密度不高,被排列在几十甚至几百万个站点的后面被点击的可能性也是非常小的。

写好Keywords(关键字)要注意以下几点:
●不要用常见词汇。例如www、homepage、net、web等。
●不要用形容词,副词。例如最好的,最大的等。
●不要用笼统的词汇,要尽量精确。例如“爱立信手机”改用“T28SC”会更好。
搜索与你的网站内容相仿的网站,查看排名前十位的网站的META关键字,将它们用在你的网站上,效果可想而知了。

★小窍门
为了提高搜索点击率,这里还有一些“捷径”可以帮得到你:
●为了增加关键词的密度,将关键字隐藏在页面里(将文字颜色定义成与背景颜色一样)。
●在图像的ALT注释语句中加入关键字。如:<IMG SRC=”xxx.gif” Alt=”keywords”>
●利用HTML的注释语句,在页面代码里加入大量关键字。用法: <!– 这里插入关键字 –>


参考资料:
1.HTML <meta>标签
2.HTTP标题信息和页面描述信息

最后

以上就是幸福金毛为你收集整理的HTML文档meta标签的详解的全部内容,希望文章能够帮你解决HTML文档meta标签的详解所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(49)

评论列表共有 0 条评论

立即
投稿
返回
顶部