网站meta调整(网页设计meta)

　　本文档集合整理了站长学院中已有的教育文章，同时对曾经过时的内容中止了修订，各位站点管理员可以经过阅读本文档，全面了解在移动大潮中从百度移动搜索获得更多流量的基础性学问。本文档的内容包括：《几种站点移动化技术选型对比》《建对百度友好的移动站点》《跳转适配生效指南》《代码适配如何做对百度友好》《自顺应对百度友好关键》。本文档同时会随着学院内容的增加而扩展，请大家随时关注。另外道谢文档物料的提供者：百度搜索高级技术经理振雷、52pk产品担任人孙二坤、高三网担任人三木、猫途鹰SEO担任人张洺乾、皮皮鲁网SEO担任人蒋飞。

　　选择适宜你的移动化之路

　　如何规划您的PC站和移动站，并表达两者之间内容的对应关系

　　目前较流量的PC站与移动站配置方式有三种，百度站在搜索引擎角度将这三种分别称为跳转适配、代码适配和自顺应，以下为这三种配置方式的名词解释及异同对比。

　　1，跳转适配：该方法会应用单独的网址向每种设备提供不同的代码。这种配置会尝试检测用户所运用的设备或ua，然后运用 HTTP 重定向和 Vary HTTP 标头重定向到相应的页面。

　　2，代码适配：该方法运用相同的网址（不思索用户所运用的设备），但会根据效劳器对用户所用阅读器的了解（ua），针对不同设备类型生成不同版本的 HTML。

　　3，自顺应：经过同一网址提供相同 HTML 代码的网站设计方法。该方法不思索用户所运用的设备（pc、平板电脑、移动设备），但可以根据屏幕尺寸以不同方式呈现（即顺应）显现屏。

　　PC、移动网址能否分歧PC、移动网页代码能否分歧

　　跳转适配否否

　　代码适配是否

　　自顺应是是

　　三种配置方式的分析

　　百度仅站在搜索引擎角度对跳转适配、代码适配、自顺应这三种配置方式做了一些对比和分析，希望能够辅佐站点选择更适宜自己、性价比最优的方式来中止移动化。

　　跳转适配代码适配自顺应

　　复杂程度简单到中等。开发独立网站的速度可以非常快。

　　小型企业可选用多种自动方案，以近乎实时的速度生成移动网站。

　　中到高，取决于网站的复杂程度和您需求创建的代码库数量。

　　代码适配所需的开发时间可能较长，且恳求效劳器端编程

　　中。需求运用能随屏幕尺寸而变的流体网格从头开端创建。

　　假设网站需求较简单，有许多开源模板可供选择。

　　如要构建包含额外编程的复杂的自顺应网站，所需的时间会比较长。

　　性能中。图片和其他网站内容可轻松针对小屏幕优化，但网站重定向经常会招致延迟问题。高。可以简化为只包含为相应设备优化的内容，以完成最佳性能。高。无任何重定向，但需求有周全的计划才干完成最优的效果。数据量收缩是最常见的错误。

　　维护需求中到高。更新主网站后，还必需单独在移动网站上中止更新。假设人工维护，将需求大量的资源。许多网站运用内容管理系统来避免这一问题，并自动在一切模板上发布内容。低。创建后，更新内容会流向一切设备，维护工作量极低。

　　设备可特地针对移动用户优化网站。单独的文件和效劳器端代码（会在向用户传送网页前在您的效劳器上运转）可以提供依设备而定的体验。一切设备上的用户体验坚持分歧（一些设备专属的选项可经过效劳器端程序添加）。

　　能否支持扩展至新平台不支持。这是智能手机专用的独立移动网站。新平台无法轻松集成到现有架构中。支持。可轻松针对细致的设备（例如智能电视）创建模板，并经过同一个网址投放。支持。运用指定的断点和流体网格，可轻松扩展到新平台和新设备。

　　树立对百度友好的移动站点

　　一、域名&效劳器&前端言语

　　1.域名

　　最初的时分，我以为移动站（俗称手机站，简称M站或者wap站）的域名和PC站一样，随意挑一个就可以了。后来才发现，“理想是美好的，理想是残酷的”：百度搜索引擎原来有自己的偏好！如下所示：

　　举荐： m.baidu.com sports.sina.cn a.m.hao123.net www.m168.info

　　不举荐：www.baidu.com/m

　　可以看出来，百度搜索引擎喜欢独立的、短小的二级域名（简约的三级域名也可）。但却不喜欢用子目录做的M站，理由也很简单，假设说PC站用 www.baidu.com，M站用www.baidu.com/m/ ，那搜索引擎对 /m/ 这个目录会感到疑惑：到底是PC站的一个子目录，还是PC站相对应的M站呢？真是剪不时，理还乱啊。

　　以上举例的域名，我们来做个PC站与M站对应的关系：

　　PC站 M站

　　www.baidu.com m.baidu.com

　　sports.sina.com sports.sina.cn

　　a.hao123.net a.m.hao123.net

　　www.m168.cc www.m168.info

　　可能大家会发现，最后一个例子中，PC站和M站都是运用的www作为前缀，其实我是不怎样赞同的，运用 m 或者 wap 才较为适合。由于说不定什么时分老板想把www.m168.cc 作为他用，而 www.m168.info 作为PC站了。

　　OK，我们往常知道M站用二级域名或者三级域名了，那么有同窗又提到了一个问题，在百度搜索引擎的战略里，PC站和M站的主域是不是必需用一个呢？答案是“否”，但又必需相关，如下：

　　可行——PC站：www.hao123.com 移动站：m.hao123.net

　　不举荐——PC站：www.hao123.com 移动站：m.123.com

　　可以看到，百度搜索引擎（以下内容简称百度）认同 用 hao123 做为主干，运用不同后缀的域名分别用作PC站和M站的域名，但不举荐运用没有关系的域名。

　　2.效劳器

　　不管做什么站，首先网站有个非常重要的前提：效劳器的稳定性。百度官方透露：目前百度对可访问性有问题的网站打压是非常凶猛的。假设被检测到网站404、502等各种影响用户阅读网站的状况发作，是会影响到网站自身在移动百度搜索结果里的排名。同时，移动百度搜索对网页加载速度上的恳求也很苛刻：“网页加载超越3秒以上不思索排名”。当然，普通情况下会扫除统计工具代码的加载时间，但广告加载会计算在3秒之内！大家还是先回家测试一下手机站的加载速度吧。温馨提示：应用站长平台工具“页面优化建议”可以粗略的查出影响页面加载的要素有哪些。

　　3.前端开发言语

　　移动互联网展开至今，前端开发言语经过历次的更迭，目前主流仍在运用的用xml、xhtml、html5。

　　历年来，移动web主要技术标准有：

　　WML——古典的移动web标准，运用WML

　　i-mode——小日本的标准，运用iHTML，我们可以忽略

　　OMA指导的xHTML mobile profile，运用xHTML

　　W3C指导的xHTML Basic，运用xHTML

　　以及所谓的Full Web，也就是普通的HTML——从iPhone开端盛行起来

　　近年来比较盛行HTML5，是html标准的最新版（在2014年10月正式发布），目前世界上主流阅读器最新版均以支持，同时，也是各站长平台、阅读器厂商举荐的移动站点的前端言语标准。附送一张进化图，用以各位看官了解：

　　二、applicable-device标注

　　1.意义

　　用来向百度蜘蛛说明此url页面适宜在PC端还是M端展现。说白了，就是辅佐百度提交校验识别结果的正确性，减少百度蜘蛛把PC站当成M站，或者把M站当成PC站中止抓取。

　　2.代码位置

　　代码放在中间，规则和对应关系见下：

　　假设是PC站，代码：

　　假设是M站，代码：

　　假设是自顺应或代码适配，代码：

　　三、站点结构

　　1.树状or扁平？

　　其实大家没有必要再纠结所谓的树状还是扁平，只需能让Baiduspider把整个网站跑一遍就可以，但今天要提示大家留意两点：

　　a 不要一切内容放在同一个目录下（包括根目录），这种不契合上面所说的“树状结构”，同时无法让蜘蛛明白这些文章的分类。错误例子：https://www.xxx.com/article-7750-1.html

　　b 不要过度细分目录（就是一级目录下面有二级目录，然后还有三级、四级。。。等目录），按需生成目录，不要无下限的生成多级目录：

　　https://www.xxx.com/news/ 举荐

　　https://www.xxx.com/news/yyxw/ 若内容过少，不举荐

　　2.面包屑导航

　　关于移动网页来说，面包屑导航也非常重要，在此不再多言。

　　3.anchor质量

　　超链接分两种，一种是纯文本链接（只需url，没有说明描画），在移动网页上百度并不举荐运用；另一种就是锚文本链接，代码如下：

　　标题描画

　　上述标题描画即为anchor，这个anchor必需准确地描画相对应的链接内容，虚假的anchor内容还会遭到百度的惩罚。

　　四、url结构和外链

　　1.url结构

　　固然百度曾经支持动态化url链接，但静态化url链接依然是优先举荐运用（纯静态化，或者伪静态化）。在运用静态化url链接时，url的结构也是需求留意的中央：

　　尽量简单短小，少用特殊符号；

　　尽量不用中文url，由于在移动端没有太大意义，目前平台的改版工具和移动适版工具支持得也不够，别给自己找省事了；

　　结构层次尽量不要太多，越少越好，但不要把一切的内容页放在同一个目录里面

　　2.外链

　　有句内行话是这么说的：“内容为王，外链为皇”。往常，外链的作用依然很强大，不管是导量方面也好，SEO优化方面也罢。各个站长依然为了“外链”而头疼，特别是被不明身份者恶意刷外链的站长们，更是吃不下睡不着。关于外链生效的问题方面，PC端、移动端外链均有效（PC链向移动站点同样有效），但需求留意几点：

　　整体而言，削弱信任度；

　　高质量的外链，不时有效；

　　低质量的外链，具有负面影响，而作弊外链，则会遭到惩罚。

　　针对恶意外链事情屡次发作，站长平台发布了“外链分析”的工具，让各位站长可以明白的知晓到底有哪些站放了我们网站的外链。各位可以在站长平台查看：

　　五、移动类型提交

　　百度站在平台的设置里，把网站分为了五类：PC站；有对应PC站的移动站；独立移动站；自顺应的站点；代码适配的站点。根据站点理论情况中止设置，有利于百度蜘蛛在抓取页面，以及搜索结果的排名（PC站和M站的搜索结果展现机制不一样）。设置方法如下：

　　跳转适配生效阅历分享

　　当用户用百度搜索某个关键词时，百度会优先展现用户体验最佳的页面，就算你做了移动站，可由于百度并没有发现你原PC页面对应的移动页面，也会失去上述优先机遇。那么，如何让百度快速发现PC--移动页面的对应关系？我们常做的有自主适配、meta标注、站长工具提交适配关系，但由于自主适配和meta标注只需在百度蜘蛛抓取原PC页面的时分才干发现对应的移动页面，那么发现全部移动页面会需求很长的时间，而在百度站长工具中提交移动适配关系将大大缩短了这个时间。

　　下图中这个移动站上线半年，之前不时做了自主适配和meta标注，在8月10日的时分提交了移动适配，经过下面曲线图就可以看出6天之后适配效果就抵达比较理想状态（红线和蓝线间距越小适配效果越好）。

　　6天时间就校验成功并生效，可能会让一些校验不成功或不时校验中的同窗愤愤不平，但在吐槽的时分，是不是也应该在自己身上找下缘由呢？下面我们主要阐述下移动适配中的几个要点。

　　一、内容分歧是移动适配成功的关键

　　1、PC页面和对应的移动页面主体内容必需完好对等

　　尽量坚持原PC页面信息量不变，但为了移动页面美观和访问速度，可以删减不太重要的模块和细分导航，但页面主体内容必需坚持不变，比如文章正文或目录页面的链接数和链接指向要完好分歧。

　　2、PC和移动的适配关系必需是一对一，不能多对一

　　若某些PC页面没有对应的移动页，那这些PC页可以不提交适配关系，但不能将多个PC页面同时指向一个移动页面，比如某文章页面在PC上有分页，到了移动站上分页取消，原PC文章一切分页都指向了同一个移动页面，这也会招致校验识别。PS：允许呈现一个PC页面对应两个移动页的情况：一个是给高端机看的，一个是给低端机看的。

　　3、需求适配的页面不能内容过少、为空或者无法访问

　　百度需求将PC页面内容和移动页面内容中止对比参照，若内容过少或空，以及需求登录才干查看的页面，百度都无法识别相似度。

　　二、建议移动站和PC同主域或同主干，不建议运用目录

　　1、移动站和PC主域相同，或主干相同

　　例若PC站是www.123.com，移动站剧烈建议选用m.123.com，移动站URL尽量简约短小，建议运用m.123.com而非yidongzhan.123.com。www.123.net由于主干相同也可以。

　　2、不建议运用二级目录作为移动站

　　例若PC站是www.123.com，移动站选用www.123.com/m/，这样，百度、GOOGLE等搜索引擎都是不喜欢的。但假设真的这样做了，百度站长工具也可以提交适配规则，细致方法可查看站长学院中《目录级移动适配如何运用工具提交适配关系》这篇文章。

　　三、更多留意事项

　　1、允许Baiduspider访问，不要robots封禁

　　固然听起来有些无厘头，但这种情况是真实存在的，要留意你的移动站点对百度是不是开放的。

　　2、UA判别后尽量运用301或302中止跳转

　　往常比较常见的是PC站点只适配一个移动站点，那么运用301就可以，假设需求同时适配高端域名和低端域名，举荐运用302

　　3、尽量为页面添加applicable-device标签

　　applicable-device标签用于辅佐百度校验识别页面类型的准确度，固然不是硬性恳求，但对站点来说没有任何弊端

　　假设是PC页，在中标注

　　假设是移动页，在中标注

　　4、移动适配工具、META标签、自主适配——三种方式逻辑关系坚持分歧

　　很多朋友都是这三种方式全用的，百度也支持这样，但这里有一个问题是：逻辑关系要坚持不致，不能在自主适配时PC页对应的是移动页是A，而提交时却变成了B。这样最终百度自主选择的适配移动页面可能和你预期的不一样。

　　四、经过百度站长工具提交适配关系的留意事项

　　前面两个要点要确保都没问题了，那接下来就是向百度提交适配关系了。

　　1、剧烈举荐运用规则适配

　　运用规则适配的好处主要有百度校验快，生效时间短，最主要的是后期不需求站长去维护，而URL适配需求不时地更新近期增加的页面。建议只需当PC对应的移动页面URL没有规则可言时再思索URL适配。

　　2、在规则适配中举荐运用提交多条规则

　　除非你的站点简单，页面类型单一可以选用单条规则，运用多条规则的好处是可以针对不同类型的URL页面写出对应规则，比如目录页、目录分页、文章页、专题页、产品页等等，这样能照顾到每一种页面类型，一旦某个规则填写错误负面影响可以缩到最小，整体进步校验速度和缩短生效时间。

　　3、规则适配中正则粒度越细越好

　　提交多条规则就触及到正则式的问题，正则匹配符号(\d+)表述数字，([a-zA-Z]+) 表示字母，([a-zA-Z0-9]+)表示字母混合，(\w+)表示字母数字下划线混合，上述四种匹配符号中，前两者属于粒度最细的、举荐运用，第三种第四种粒度较粗，在正则式中若用大粒度匹配符将会增加校验时间。

　　案例：若有两个PC页面www.123.com/a/abc-1.html和www.123.com/a/def-1.html，有些站长会直接用 www.123.com/a/(\w+).html 对应 m.123.com/a/${1}.html 一个正则表达。但建议写成两个正则：

　　www.123.com/a/abc-(\d+).html对应 m.123.com/a/abc-${1}.html

　　www.123.com/a/def-(\d+).html对应 m.123.com/a/def-${1}.html

　　五、最后强调

　　不管运用哪种方式，适配成功后都要持续坚持PC页和移动页的适配关系，由于百度会继续检查适配关系能否正常能否生效，假设发现适配关系不正确，之前生效的数据也会转为失效，影响移动流量。

　　1，PC结构发作变化，检查移动站点能否快速跟着变了

　　2，PC页面主体内容发作变化，检查移动页面能否分歧

　　3，假设运用平台工具提交的适配关系，定期检查数据状态，假设之前显现“适配成功”的数据改成了“校验失败”要赶紧查看PC页与移动页的对应关系。

　　自顺应对百度友好关键

　　一、什么样的网站适宜做自顺应

　　自顺应网页设计(Responsive Web Design)是指可以自动识别终端设备屏幕的大小从而做出相应调整的网页设计方法。这种网页设计方法圆满处置了如何在不同大小的网络设备上呈现同样的网页效果。大家公认自顺应至少有4个好处:提升用户体验；PC端和移动端SEO坚持分歧；避免重复内容和出错内容；链接统一。

　　而自顺应比较明显的缺陷是，开发本钱比较高，特别是要构建包含额外编程的复杂的自顺应网站，所需的时间会比较长。假设网站需求较简单，有许多开源模板可供选择。

　　关于曾经比较成熟PC网站来说，假设要完成全站的自顺应，有可能需求推掉原来一切的代码中止重构，时间和技术本钱都比较大，而且假设一个网站有多个portal（入口），会大大增加架构设计的复杂度，所以往常有很多网站只在移动端完成了响应式规划设计。

　　二、自顺应网页代码上需求做出哪些调整

　　1、 阻止移动阅读器自动调整页面大小

　　iOS和Android阅读器都基于webkit中心，这两种阅读器以及其他的很多阅读器都支持viewport meta元素掩盖默许的画布缩放设置，只需在HTML的标签中插入一个标签，标签中可以设置细致的宽度(如像素值)或者缩放比例2.0(设备理论尺寸的两倍)，下面是将一个页面放大到设备理论尺寸两倍显现的meta标签示例:

　　2、将网页修正为百分比规划

　　当某个阅读窗口处于媒体查询固定的范围之外，网页就需求水平滚动才干完好阅读，而经过百分比规划可以页面元素根据窗口大小在一个又一个媒体查询之间灵活修正样式，细致来讲，就是css代码不会指定细致像素宽度：width:xxx px;而是会指定一个百分比宽度：width:xx%;或者直接就是width:auto;这里大家可以根据一个简易的公式将固定像素宽度转换成对应的百分比宽度：目的元素宽度 ÷ 上下文元素宽度 = 百分比宽度

　　例如：

　　#wrapper {

　　margin-right: auto;

　　margin-left: auto;

　　width: 960px;

　　}

　　#header {

　　margin-right: 10px;

　　margin-left:10px;

　　width: 940px;

　　}

　　转换为百分比的header区块的css为：

　　#header {

　　margin-right: 10px;

　　margin-left: 10px;

　　width: 97.916667% /* 940 ÷ 960 */

　　}

　　3、用em交流px

　　同样，目的元素宽度 ÷ 上下文元素宽度 = 百分比宽度这个公式也适用于将文字的像素单位转换为相对单位，值得留意的是，现代阅读器的默许文字都是16像素，因此一开端给body标签应用下列任何一条规则所产生的效果都一样:

　　font-size: 100%;

　　font-size:16px;

　　font-size: 1em;

　　例如某网站网站标题相应的样式:

　　#logo {

　　display: block;

　　padding-top: 75px;

　　color: #0d0c0c;

　　font-family: Arial;

　　font-size: 48px;

　　}

　　修正后的样式如下:

　　#logo{

　　display: block;

　　padding-top: 75px;

　　color: #0d0c0c;

　　font-family:Arial;

　　font-size:3em /* 48 ÷ 16 */

　　}

　　4、活动规划（fluid grid）的运用

　　“活动规划”指的是各个区块的位置都浮动，不是固定不变的。

　　.main {float: right;width: 70%;}

　　.leftBar {float: left;width: 25%;}

　　这么做的好处是，假设宽度太小，放不下两个元素，后面的元素会自动滚动到前面元素的下方，不会在水平方向溢出，避免了水平滚动条的呈现，大大提升了用户的阅读体验。另外，绝对定位（position:absolute）的运用，也要非常留神。

　　5、Media Query技术的运用

　　在自顺应设计的技术中，css3支持css2.1定义的媒体类型，同时添加了很多触及媒体类型的功用属性，包括max-width(最大宽度)，device-width(设备宽度，orientation(屏幕定向:横屏或竖屏)，因此可以经过Media Query加载相应的CSS文件. 例如，下面代码定义了假设页面经过屏幕呈现，并且屏幕宽度不超越480px,则加载shetland.css

　　同样可以创建多个样式表，以顺应不同设备或者不同分辨率的宽度范围，当然更有效的做法是将多个Media Query整合在一个样式表文件中:

　　[email protected]only screen and (min-devece-width: 320px) and (max-device-width: 480px) {

　　/* Styles */

　　}

　　[email protected]screen and (min-width: 600px) {

　　.hereIsMyClass {

　　width: 30%;

　　float: right;

　　}

　　上面的代码中定义的样式类只需在阅读器屏幕宽度超越600px时才会有效。

　　因此，运用min-width和max-width可以同时判别屏幕尺寸与阅读器理论宽度，假设希望经过Media Query作用于某种特定设备，但忽略在其上运转的阅读器能否由于没有最大化尺寸与设备屏幕尺寸不分歧，则可以运用max-device-width和max-device-width属性来判别设备本身屏幕尺寸。

　　Media Query不是独一的处置方案，同样可以经过Java来完成自顺应设计，特别是某些旧阅读器无法圆满支持CSS3的Media Query时，它可以作为备选方案。当然，我们仍然能借助专业的Java库来辅佐旧阅读器(IE5+,Firefox 1+,Safari 2等)支持CSS3的Media Queries.运用方法:下载css3-mediaqueries.js,然后在页面中调用它即可，例如:

　　6、 设计响应式图片

　　有很多同比缩放图片的技术，其中有不少是简单易行的，比较盛行的方法是运用CSS的max-width属性：

　　img { max-width: 100%;}

　　老版本的IE不支持max-width，所以只好写成：

　　img { width: 100%; }此外，windows平台缩放图片时，可能呈现图像失真现象。这时，可以尝试运用IE的专有命令：

　　img { -ms-interpolation-mode: bicubic; }

　　或者，Ethan Marcotte的imgSizer.js。

　　addLoadEvent(function() {

　　var imgs =

　　ocument.getElementById("content").getElementsByTagName("img");

　　imgSizer.collate(imgs);

　　});

　　假设有条件的话，最好能根据屏幕的不同大小，加载不同分辨率的图片。

　　三、 自顺应站点对百度友好的关键

　　1，applicable-device标注应该怎样写

　　有了自顺应设计的网页，还要照顾到对百度友好的设计，即通知百度“我是自顺应页面”便当百度中止识别校验。方法也很简单，只需在上面viewport标签下面再添加一个applicable-device标签就行：

　　表示页面同时适宜在移动设备和PC上中止阅读。

　　2， 在运用百度站长平台链接提交工具的sitemp中止提交时，要做mobile type标志，细致取值：

　　其他网页取值如下：

　　：移动网页

　　：移动网页

　　：代码适配

　　无该上述标签表示为PC网页

　　代码适配如何做对百度友好

　　百度的移动适配目前分为三种情况：跳转适配，代码适配和自顺应。跳转适配目前百度的站长平台里有完好的适配工具，可以在平台里提交适配规则即可。但是代码适配则需求我们在网站里做一些配置，才干让百度准确识别我们的网页适配关系。下面就细致引见下我们做代码适配的过程。

　　流量潜力

　　假设不做移动适配的话，可能我们本来有的移动网页和移动端排名因百度无法确认是移动页面，因此这部分流量都给指向了百度的转码页。可以看自己网站在站长工具里面，移动端有几流量是指向了转码页。这部分流量在做完适配后，即可指向我们的移动页面，避免了自己的流量被百度截流。

　　开发

　　代码适配的开发，百度官方也有细致的说明，可分为两部分： Vary HTTP标头 和 Meta applicable-device 标签。

　　【Vary HTTP 标头】

　　其作用在百度的文档里解释得很清楚：1、它会向百度传送一个信号，表示说这是个代码适配的站点，百度就会尽快把网站抓取一遍中止适配；2、它可以防止用户接纳到错误的网页缓存。这部分是在网站的效劳器上中止的，有可能是 Nginx,Apache, IIS 等， 需求在效劳器的配置里，设置 Varyheader 为 Vary:Accept-Encoding, User-Agent

　　比如Nginx 下， 可以在配置文件中加上：more_set_headers-s 200 "Vary: " "Accept-Encoding, User-Agent"

　　留意：翻开这个设置需求nginx同时安装有ngx_headers_more模块

　　在Apache下，可以在配置文件里写上：Headerappend Vary User-Agent

　　【Meta applicable-device 标签】

　　Vary header 加上之后，为了让百度更好地识别我们的页面是 PC 还是 Mobile，就需求运用百度自定义的这个 Meta applicable-device 标签了。留意以下来自百度的消息: Meta applicable-device 标签，并非是站点必需标注的，往常很多站点没有标志这个标签情况也很好。但这个标签可以辅佐百度校验自己的判别，并及时中止修正。做这个事情又不省事，所以我们建议代码适配站点为了保证效果，还是加这个标签。

　　因此可能有些网站之前的移动流量曾经很好了, 不会呈现被百度转码的情况. 这说明百度曾经能很好地识别你的移动页面了. 但是依然建议加上这个标签, 一来加这个标签很容易, 二来可以确保百度能更准确地识别页面类型. 假设没有加这个标签的话, 万一突然技术做改版, 一些代码的修正招致百度无法继续准确识别页面类型了呢?

　　这部分是在网站的模板里添加的。自顺应的网站肯定曾经有了判别用户设备是 PC 还是 Mobile 的逻辑。应用这个逻辑，在整站的 部分添加一行代码即可：

　　假设用户是PC设备(留意需求包括Baiduspider PC UA)，则添加

　　假设用户是移动设备(包括 Baiduspider Mobile UA)，则添加

　　注：关于BAIDUSPIDER，移动和PC其实都是Baiduspider，并没有区分，只是UA中止了区分。最新移动UA请见百度官方文档。

　　验收上线

　　开发完成后，需求先在测试机上验收。可以用 Google 阅读器来模拟 Baiduspider 来检查能否添加正确, 如图所示, 是检查 Baiduspider Mobile UA 的效果的

　　在测试机上验收完成后就可以上线了。上线后，尽量再用站长平台的抓取诊断工具测试几个页面，以免到线上后呈现与测试机不分歧的情况。比如下面是抓取 PC 页面来检查的线上结果。

　　跟踪

　　上线后就可以持续跟踪百度移动的SEO流量数据了。要追踪的主要是网站自己的统计工具统计的流量数据和百度站长平台的移动端转码页流量数据。上线后一到两周，移动端的流量应该就会有明显的增长，而百度转码页的流量则会降落。这个此消彼长的过程会持续一段时间。直到转码页的流量基本为0，都转为移动页的流量。

　　https://www.3dude.com/