Meta标签与搜索引擎优化

广告也精彩

MM当谈及到<meta>标签对搜索引擎排名的影响,许多人都存在误解。在已往,许多已经失去作用的标签仍然被频繁使用。所以哪些标签对搜索引擎优化(SEO)有作用,哪些没有呢?

Meta标签与搜索引擎优化

Meta标签与搜索引擎优化

什么是Meta标签

Meta标签给搜索引擎提供了许多关于网页的信息。这些信息都是隐含信息,意味着对于网页自身的会见者是不行见的。

你可以在网页的<head>元素中发现<meta>标签。在已往,有人曾经问我它是否可以放在网页的<body>,最好不要这样做。如果<meta>标签被放在<body>位置,某些浏览器可能无法识别它们,也就相当于你建设了无效的标签。

通常情况下,<meta>标签会包罗一个name属性,用来设置元数据。元数据的值放在content属性里面。你可以在<meta>标签中使用种种名称/值对,让我们来看看其中的一些。
你可以会遇到一些Meta标签

让我们运行一下在一个网页中发现的几个差异的<meta>标签。

MetaDescription

Metadescription标签可能是最有用的标签之一。顾名思义,它会给搜索引擎提供关于这个网页的简短的描述。代码如下:
<metaname=”description”content=”Everythingyouneedtoknowaboutmetatagsforsearchengineoptimization”/>

这个标签曾经在搜索排名中占有很大的权重,但随着算法的不停的更新升级,它的职位也逐渐降低。它虽然不会提高网站排名,但是,因为它会被用在搜索引擎的结果页,所以依然有用。
这也就意味着它仍然可以提高你的网页点击率。究竟,当用户搜索的要害词与之相匹配时,会以粗体显示突出显示。这就是为什么一个好的页面说明(利用要害字的)可以显示更多与用户相关的信息,进而提高了点击率。推荐的description长度为160个字符。

但是如果你没有使用description标签或者description标签为空时,会发生什么呢?搜索引擎仍会在搜索结果页显示出自己创键的一小段文字。大多数的结果都不是用户需要的,也就意味着你将失去用户点击网页的时机。

MetaRobots

我们在之前的教程中已经接触过Metarobots标签。如果你没有时机回去阅读它,这里有一段简短的介绍:

Metarobots标签治理着搜索引擎是否可以进入网页,你可以用它来允许或不允许搜索引擎来获取你的网页、进入你网页中的子链接或对你的网页存档。例如:

<metaname=”robots”content=”noindex,nofollow”/>

这个meta标签告诉搜索引擎不要获取网页,而且阻止其进入链接。如果你不小心使用了两个矛盾的术语(例如noindex和index),谷歌会选择最具限制性的选项。
为什么这个标签会对搜索引擎优化(SEO)起作用呢?首先,它可以防止对拷贝内容的冗余抓取,例如页面的打印版页面。它也可能会对那些内容不完整的页面或者而存在私密信息的网页起作用。

Title

专业的讲,title标签不是meta标签,但他们都放在相同位置。我之所以把title标签放在这里是因为它对搜索引擎优化很重要。

在所有的HTML文档中,title标签都是不行缺少的。它界说了整个文档的标题,如下所示:

<title>Titleofthepage</title>

简朴而实用。标题通常会显示在两个差异的地方;浏览器的头部标签和搜索结果页。这就意味着title标签在点击率(CTR)和排名上有很重要的影响。

一个好的标题应该包罗要害字,而且最好放在标题的开头部门。请记着,那些匹配到用户搜索的要害字会以粗体显示。

另一件你应该牢记在心的事情就是标题的长度。谷歌会限制标题为70个字符,所以偶尔你可能需要书写一个合适的标题。

DanShure发表过一篇很不错的关于标题的文章,叫areyourtitlesirresistiblyclickworthyandviral?,包罗了许多有意思的知识点。

其它一些Meta标签

解说了一些常用的meta标签,下面让我们来看一些不经常使用的。

1、MetaContentType(charset)

metacontenttype标签被用来声明网页的字符编码,为了防止浏览器发生编码问题最好加上这个属性。但是它不会影响搜索排名或点击率(CTR)。

你可能很熟悉下面长长的Content-type代码:

<metahttp-equiv='Content-Type'content='Type=text/html;charset=utf-8'>

现在我们也可以使用更简短的、向后兼容的声明模式:

<metacharset="utf-8"/>

这个标签应该放在任何包罗文本元素的标签之前,包罗我们已经解说的title标签。

2、MetaKeywords

这个标签在已往很重要,但是现在却没什么价值了。现在没有一个主流的搜索引擎使用metakeywords来判断网页的内容了。

在metakeywords标签里面,你可以存储几个关于网页内容的要害字。然而,它却不会提高你的排名。如果你想要实现它(尽管我不知道你为什么这样做)你可以用如下代码:

<metaname=”keywords”content=”metatags,searchengineoptimization”/>

3、MetaLanguage

这个标签之前是用来声明网页的语言的。可以见告屏幕阅读器和其它文本处置惩罚器他们正在处置惩罚的语言以便更好的事情。这就是为什么metalanguage的content声明为什么可以为fr。

<metahttp-equiv="content-language"content="fr"/>

但这看起来是多余的,W3C推荐使用标签的属性来声明语言:

<htmllang="en">

如果这个元素所包罗内容的语言和你在<html>元素设置的默认语言纷歧样时,这个属性也能应用到其他元素上:

<plang="es">Megusta..

Notranslate

有时,Google在结果页面会提供一个翻译链接,但有时候你不希望泛起这个链接,你可以添加这样一个meta标签:

<metaname=”google”content=”notranslate”/>

Refresh

使用这个meta标签你可以控制浏览器在一段时间之后自动刷新。举例说明,下面的代码体现每隔30秒网页自动更新:

<metahttp-equiv=”refresh”content=”30”>

你也可以在刷新之后跳转到另外一个页面,看看下面这个例子:

<metahttp-equiv=”refresh”content=”30;URL=’http://website.com’”>

W3C是不推荐使用这个标签的,因为它会令用户发生迷惑。另外,它对搜索排名没有任何影响。
总结

简朴的说,有三个meta标签,你应该关注一下:description、robots、title(经常被视为是,但专业来讲不是).

description标签

description标签被用来显示更多有关网页内容的信息,搜索引擎也会在搜索引擎结果页面(SERP)使用它。robots标签用来阻止搜索引擎获取拷贝页面、私密页面和未完成的页面。最后,最重要的title标签,控制它在70个字符以下,并在其中使用要害词。

keywords标签

keywords标签的时代已经已往,最好不在使用它。其他一些比力重要的标签(有关搜索引擎优化):language、content、refresh、nontranslate。

相关的meta设置XHTML

<metacharset="UTF-8">

<metahttp-equiv="refresh"content="5;url="/>

<linkrel="copyright"href="?copyright.html"/>

<metahttp-equiv="X-UA-Compatible"content="IE=edge"/>

<metaname="viewport"content="width=device-width,initial-scale=1"/>

<metaname="description"content="150words"/>

<metaname="keywords"content="yourtags"/>

<!--

all:文件将被检索,且页面上的链接可以被查询;

none:文件将不被检索,且页面上的链接不行以被查询;

index:文件将被检索;

follow:页面上的链接可以被查询;

noindex:文件将不被检索;

nofollow:页面上的链接不行以被查询。

-->

<metaname="robots"content="index,follow"/>

<metaname="author"content="authorname"/>

<metaname="google"content="index,follow"/>

<metaname="googlebot"content="index,follow"/>

<metaname="verify"content="index,follow"/>

<!--启用WebApp全屏模式-->

<metaname="apple-mobile-web-app-capable"content="yes"/>

<!--隐藏状态栏/设置状态栏颜色:只有在开启WebApp全屏模式时才生效。content的值为default|black|black-translucent。-->

<metaname="apple-mobile-web-app-status-bar-style"content="black-translucent"/>

<!--添加到主屏后的标题-->

<metaname="apple-mobile-web-app-title"content="标题">

<!--忽略数字自动识别为电话号码-->
<metacontent="telephone=no"name="format-detection"/>

<!--忽略识别邮箱-->

<metacontent="email=no"name="format-detection"/>

<metaname="apple-itunes-app"content="app-id=myAppStoreID,affiliate-data=myAffiliateData,app-argument=myURL"/>

<!--添加智能App广告条SmartAppBanner:

告诉浏览器这个网站对应的app,并在页面上显示下载banner:

https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/PromotingAppswithAppBanners/PromotingAppswithAppBanners.html-->

<!--针对手持设备优化,主要是针对一些老的不识别viewport的浏览器,好比黑莓-->

<metaname="HandheldFriendly"content="true">

<!--微软的老式浏览器-->

<metaname="MobileOptimized"content="320">

<!--uc强制竖屏-->

<metaname="screen-orientation"content="portrait">

<!--QQ强制竖屏-->

<metaname="x5-orientation"content="portrait">

<!--UC强制全屏-->

<metaname="full-screen"content="yes">

<!--QQ强制全屏-->

<metaname="x5-fullscreen"content="true">

<!--UC应用模式-->

<metaname="browsermode"content="application">

<!--QQ应用模式-->

<metaname="x5-page-mode"content="app">

<!--windowsphone点击无高光-->

<metaname="msapplication-tap-highlight"content="no">

注:相关网站建设技巧阅读请移步到建站教程频道。

f9seo

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: