`

META标签

    博客分类:
  • html
 
阅读更多

在网页的HTML源代码中一个重要的代码“<META>”(即通常所说的META标签)。META标签用来描述一个HTML网页文档的属性,例如作者、日期和时间、网页描述、关键词、页面刷新等。

常用的HTTP-EQUIV属性

  1、<meta http-equiv=“Content-Type” content=“text/html”;charset=gb_2312-80“>和 <meta http equiv=”Content-Language“ content=”zh-CN“>用以说明主页制作所使用的文字以及语言;又如英文是ISO-8859-1字符集,还有BIG5、utf-8、shift-Jis、Euc、Koi8-2等字符集;

  2、<meta http-equiv=”Refresh“ content=”n;url=http://yourlink“>定时让网页在指定的时间n内,跳转到你的页面;

  3、<meta http-equiv=”Expires“ content=”Mon,12 May 2001 00:20:00 GMT“>可以用于设定网页的到期时间,一旦过期则必须到服务器上重新调用。需要注意的是必须使用GMT时间格式;

  4、<meta http-equiv=”Pragma“ content=”no-cache“>是用于设定禁止浏览器从本地机的缓存中调阅页面内容,设定后一旦离开网页就无法从Cache中再调出;

  5、<meta http-equiv=”set-cookie“ content=”Mon,12 May 2001 00:20:00 GMT“>cookie设定,如果网页过期,存盘的cookie将被删除。需要注意的也是必须使用GMT时间格式;

  6、<meta http-equiv=”Pics-label“ content=”“>网页等级评定,在IE的internet选项中有一项内容设置,可以防止浏览一些受限制的网站,而网站的限制级别就是通过meta属性来设置的;

  7、<meta http-equiv=”windows-Target“ content=”_top“>强制页面在当前窗口中以独立页面显示,可以防止自己的网页被别人当作一个frame页调用;

  8、<meta http-equiv=”Page-Enter“ content=”revealTrans(duration=10,transtion= 50)“>和<meta http-equiv=”Page-Exit“ content=”revealTrans(duration=20,transtion=6)“>设定进入和离开页面时的特殊效果,这个功能即FrontPage中的“格式/网页过渡”,不过所加的页面不能够是一个frame页面。

  HTTP-EQUIV用于向浏览器提供一些说明信息,从而可以根据这些说明做出反应。HTTP-EQUIV其实并不仅仅只有说明网页的字符编码这一个作用,常用的HTTP-EQUIV类型还包括:网页到期时间、默认的脚本语言、默认的风格页语言、网页自动刷新时间等。

2 META标签中网页描述(description)

  HTML代码实例中有关"description"的代码为:

  <meta name="description" content="网络营销教学网站提供《网络营销基础与实践》教学支持:网络营销课件,网络营销论文,网络营销实验教学,电子商务论文,网络营销与电子商务书籍等">

  "description"中的content="网页描述",是对一个网页概况的介绍,这些信息可能会出现在搜索结果中,因此需要根据网页的实际情况来设计,尽量避免与网页内容不相关的“描述”,另外,最好对每个网页有自己相应的描述(至少是同一个栏目的网页有相应的描述),而不是整个网站都采用同样的描述内容,因为一个网站有多个网页,每个网页的内容肯定是不同的,如果采用同样的description,显然会有一些网页内容没有直接关系,这样不仅不利于搜索引擎对网页的排名,也不利于用户根据搜索结果中的信息来判断是否点击进入网站获取进一步的信息。

  META标签中网页描述(description)的设计要点:

  1网页描述为自然语言而不是罗列关键词(与keywords设计正好相反);

  2尽可能准确地描述网页的核心内容,通常为网页内容的摘要信息,也就是希望搜索引擎在检索结果中展示的摘要信息;

  3网页描述中含有有效关键词;

  4网页描述内容与网页标题内容有高度相关性;

  5网页描述内容与网页主体内容有高度相关性;

  6网页描述的文字不必太多,一般不超过搜索引擎检索结果摘要信息的最多字数(通常在100中文字之内,不同搜索引擎略有差异)。

3 META标签中的关键词(Keywords)

  与META标签中的"description"类似,"Keywords"也是用来描述一个网页的属性,只不过要列出的内容是“关键词”,而不是网页的介绍。这就意味着,要根据网页的主题和内容选择合适的关键词。在选择关键词时,除了要考虑与网页核心内容相关之外,还应该是用户易于通过搜索引擎检索的,过于生僻的词汇不太适合做META标签中的关键词。关于META标签中关键词的设计,要注意不要堆砌过多的关键词,罗列大量关键词对于搜索引擎检索没有太大的意义,对于一些热门的领域(也就是说同类网站数量较多),甚至可能起到副作用。

  META标签中关键词(keywords)的设计要点: ·

  1选择与网页内容最相关的核心关键词即可,而且关键词数量无需太多,更没有必要堆砌大量的关键词;

  2keyword中的关键词应该同样出现在description内容中;

  3不同的关键词之间用逗号(英文标点符号)隔开。

 

 

 

 

1、在zblog模板网站的首页default.html 添加description和keywords标签

  按照这个顺序依次操作:打开后台首页——文件管理——打开SHEMS文件——打开你的当前模板样式的文件(此处一般有2个选择,之一是default,如果你是用系统默认模板就点击default,否则就点击另一个)——打开TEMPLATE文件——编辑default.html(默认首页),操作路径为:THEMES/axna/TEMPLATE/default.html ,其中的axna是我的博客模板样式,因人而异,操作完这些之后在<head></head>里面添加如下代码:

  <meta name="keywords" content="xx,xx,xx" />

  <meta name="description" content="yyyyyyy" />

  Keywords里面的xx等就是你当前页面的关键词,这个非常重要,要准确定位,而且确定了就不要再随意修改。可设置多个关键词但不要过多,适当即可,也不要重置堆砌关键词,这是对搜索引擎不友好的。关键词之前最好用逗号隔开。 而description里面的yy等字样就是指对当前页面的描述,在首页里就是要指明这个网站是什么样的网站,有什么用或者是做什么的,等等。这一部分是会出现在搜索结果的页面当中的,因此还是举足轻重的。

  添加了代码后就点击提交,然后文件重建即可,返回你的首页,查看源文件就能看到首页已经成功添加了这两个标签。

  2、在网站的内页模板single.html 中添加meta标签

  同理,此处的操作路径为:./THEMES/axna/TEMPLATE/single.html 依次打开至single.html页面。这里,先介绍一下网上有一部分人的一些做法,可能是有点小问题的。

  在single.html中添加如下标签:

  <meta name="keywords" content="<#article/tagtoname#>" />

  <meta name="description" content="<#article/intro#>" />

  其中,#article/tagtoname# 是调用文章页面的关键词,我们在进行新建文章时,有一栏要填tags,关键词就是从你所填写的tags调用过来的, #article/intro# 是调用文章简介,在新建文章的后台页面里,可以点击下面的自动生成摘要,当然了,摘要也可以自己填写,简介就是从你写的摘要里面完完全全调用过来的。

  可是运用这样的代码方法在一些博客中是行不通的,在部分博客中文章的简介就自动调到页面的最顶部。可见这种方面要慎用。当然了,还有其它更加简便的方法,比如我们可以在Z-Blog安装一个名为NOBIRDAticleSEO的插件,之后就多出<#nobird/article/seo#>标签,并自动添加到文章页模板中作为页面的Description,同时还自动添加了keywords和author信息。

  3、同样,也可以在catalog.html、tags.html、search..html中添加meta标签

  代码如下<meta name=descriptioncontent =<#ZC_BLOG_TITLE#><#ZC_MSG044#><#BlogTitle#>” />

  这部分大家是可以自行进行增删修改的,不一定要那些调用代码,也可以输入自己想要加的文字。

分享到:
评论

相关推荐

    Nuxt页面自定义meta标签和asyncData异步请求

    一、页面自定义meta标签 可以为每个页面单独设置不同的meta标签 以便于SEO 全局的meta标签在nuxt.config.js文件里配置 而单独的meta标签在组件的内部标签内进行配置即可 值得注意的是:hid属性是页面的唯一标识 若想...

    WebApp里的Meta标签大全

    ### WebApp中的Meta标签详解 #### 一、引言 在Web开发中,尤其是在构建适应移动设备的Web应用(WebApp)时,正确使用HTML中的`&lt;meta&gt;`标签至关重要。它不仅可以帮助开发者控制页面的布局与展示效果,还能优化SEO、...

    网页优化meta标签使用方法及规则中文WORD版

    资源名称:网页优化meta标签使用方法及规则 中文WORD版   本文档主要讲述的是网页优化meta标签使用方法及规则;meta是html语言head中的一个辅助标签,meta标签由http-equlv属性和name属性组成,属性不同...

    Meta标签详解

    ### Meta标签详解 #### 一、Meta标签简介与作用 Meta标签是HTML语言中的一个辅助性标签,位于HTML文档头部的`&lt;HEAD&gt;`区域,并在`&lt;TITLE&gt;`标签之前。虽然用户在浏览网页时无法直接看到这些信息,但对于网页的SEO...

    meta标签的作用及整理.html

    meta标签的作用及整理

    搜索引擎和 HTML Meta 标签(Meta Tags)

    搜索引擎和 HTML Meta 标签(Meta Tags)

    HTML中meta标签及Keywords

    关键字 meta(标签)及 Keywords(关键词),曾经在网页中很重要的,但现在已经被很多搜索引擎完全忽略。但是,如果加上这个标签也对网页的综合表现没有坏处,不过,如果使用不恰当的话,对网页非但没有好处,还有...

    meta标签中的

    #### 一、Meta标签概述 在HTML文档中,`&lt;meta&gt;`标签被广泛应用于头部(`&lt;head&gt;`部分),主要用于定义页面的元数据(metadata)。这些元数据通常不直接对用户可见,但对浏览器以及其他网络服务(如搜索引擎)具有重要...

    [Dreamweaver教程]Meta标签详解.doc

    《深入解析Dreamweaver教程中的Meta标签应用》 在当今互联网时代,个人网站与企业站点如同星罗棋布,遍布全球每一个角落。然而,在如此庞大的网络空间中,如何使自己的网站脱颖而出,成为众人关注的焦点?除了传统...

    META标签详解、解决JSP页面显示乱码问题

    ### META标签详解与应用 #### 一、META标签概述 META标签是HTML语言中的一个辅助性标签,位于文档的`&lt;head&gt;`部分。虽然它不直接影响网页内容的展示,但对网页的SEO优化、浏览器兼容性和用户体验等方面具有重要作用...

    META标签使用详解

    ### META标签使用详解 #### 一、概述 META标签是一种重要的HTML元素,用于提供关于HTML文档的元数据信息。这些信息对于浏览器来说至关重要,能够帮助浏览器更好地解析网页内容,并为用户提供更佳的浏览体验。根据...

    meta标签详解meta标签详解

    meta 标签详解 meta 标签是 HTML 语言 HEAD 区的一个辅助性标签,它位于 HTML 文档头部的 &lt;HEAD&gt; 标记和 &lt;TITLE&gt; 标记之间,提供用户不可见的信息。meta 标签通常用来为搜索引擎 robots 定义页面主题,或者是定义...

    html meta标签使用方法

    #### 一、Meta标签简介 HTML中的`&lt;meta&gt;`标签是一种重要的元数据标记,它通常位于文档的`&lt;head&gt;`部分。Meta标签用于定义关于HTML文档的元信息,这些信息不会显示在页面上,但对浏览器和其他应用程序(如搜索引擎)...

    网页HTML代码中Meta标签详解.pdf

    Meta标签通常用来为搜索引擎robots定义页面主题,或者是定义用户浏览器上的cookie;它可以用于鉴别作者,设定页面格式,标注内容提要和关键字;还可以设置页面使其可以根据你定义的时间间隔刷新自己,以及设置RASC...

    实例讲解HTML5的meta标签的一些应用

    HTML5的meta标签是网页元数据的重要组成部分,用于提供关于HTML文档的各种信息,如字符编码、页面描述、关键词、作者、最后修订日期等。在HTML5中,meta标签的使用方式相比HTML4.01有所变化,使得其更加简洁且功能...

    html语言meta标签解析及SEO优化

    Meta 标签通常用来为搜索引擎 robots 定义页面主题,或者是定义用户浏览器上的 cookie;它可以用于鉴别作者,设置页面格式,标注内容提要和关键字;还可以设置页面使其可以根据你定义的时间间隔刷新自己,以及设置 ...

    WEB前端程序猿必看的meta标签汇总共4页.pdf.zi

    在Web开发领域,尤其是前端编程,Meta标签扮演着至关重要的角色。它们是HTML文档头部(head)中的元素,用于提供页面元数据,如页面描述、关键词、字符编码、刷新率等,对搜索引擎优化(SEO)、用户体验及网页在社交...

    Web-前端html+css从入门到精通 122. meta标签扩展学习.zip

    在CSS方面,虽然meta标签不直接涉及CSS,但理解meta标签的使用可以帮助前端开发者更好地控制网页的呈现效果。例如,通过meta标签设定的字符编码可以防止CSS中的特殊字符显示异常。 本课程将深入讲解meta标签的各种...

    网页头部标签meta详解

    Meta标签的使用可以帮助搜索引擎更好地理解网页的内容和结构,从而提高网页的搜索排名和用户体验。同时,Meta标签也可以帮助浏览器正确地显示网页内容,提高网页的加载速度和可读性。 Meta标签是一个非常重要的HTML...

Global site tag (gtag.js) - Google Analytics