html仿百度页面代码_百度移动适配的案例解析及操作细节

移动适配，从当下来看可以这样说：“做好了移动适配工作，wap站点85%甚至以上的工作，都已经完成了”。是的，即使你的wap站点是一个新站（PC站是有一定基础的），那么做好移动式配工作，在短暂的1-2周的搜索引擎处理后，就能获得至少PC端一半的流量。而今天无论在电商、房产、教育等等很多领域。搜索引擎流量来源的占比已经达到了wap端80%，PC端20%。所以，移动适配的工作在今天，不做是绝对不行了。
下面是我针对我们公司的wap站点进行的移动适配工作全过程，拿出来与大家分享。移动适配的访问跳转是301 还是 302？
第一步就是做好跳转工作，因为在你没做移动适配之前，搜索引擎的wap端是有很多你PC的页面的。这样的页面不仅不能获得一定的排名还严重影响了用户的体验。所以我们要将使用移动设备访问我们PC页面的用户通过服务器识别出来并使这类用户跳转到对应的wap站对应的页面上。
我在2017年加入这家公司时，发现了环球网校PC到wap站点的跳转采用的是js， wap端流量是小几千的日UV，而PC已经是大几万了。两者差距很大，基本上就是移动适配的跳转工作做了，但并没有做好！
所以这里不建议使用js跳转，跳转方式一定是301或者302状态码的跳转形态。否则搜索引擎无法识别。而在301和302之间，我个人建议使用301跳转。之前的一次案例使用302搜索引擎的反应速度并没有301快是我证实的，但询问官方人员后，并未证实我这个观点，这里只是建议。
还有一点需要额外的提醒大家，PC页面和WAP端页面的对应关系一定要做好。PC端说的是1，跳转到wap端，也必须是1。当然除了主体内容外，其他的元素可以不同。例如我们的列表页主要的列表有就可以，文章页中主要的文章存在即可。其他的可以略有不同。帮助搜索引擎识别页面的类型
搜索引擎从本质上，是不清楚我们的页面是PC页，还是wap端页面的，那么我们需要针对不同的端添加如下两行代码：
PC端：<meta name="applicable-device" content="pc">
移动端：<meta name="applicable-device" content="mobile">如下截图，是环球网校的新闻页代码添加示例：

这里需要注意的事项只有一个，就是这两行代码要分别添加在PC端和wap端的head标签内即可。在PC页声明对应的wap站页面
搜索引擎在抓取我们页面的同时，我们需要在PC的页面中指明对应的wap端页面地址，这样同样是为了帮助搜索引擎更好的找到该PC页对应的wap端页面，代码如下：
<meta name="mobile-agent" content="format=html5; url=http://m.hqwx.com/news/2018-3/15199816265369.html">
如上，content属性对应的值，是声明我们对应的wap端页面为html5的页面，URL地址为：http://m.hqwx.com/news/2018-3/15199816265369.html即可。如下图是环球网校的添加代码示例：

提交搜索引擎站长工具 – 移动适配
利用搜索引擎站长工具的移动适配工具，提交我们的适配规则，这也是最后一步，更是最重要的一步。百度、360、搜狗以及google的方式大同小异，这里以百度为例。
百度站长平台（现更名搜索资源平台）地址：http://ziyuan.baidu.com，打开之后在导航栏“网站支持”找到“移动适配”，如下图：

进入之后，点击“添加适配关系”这时我们会看到两种提交方式一种是规则适配，另一种是URL适配。
这两种我们都有用到，我们下面分别进行说明：百度移动端适配提交之规则适配
所谓规则，是指我们的PC端与wap端的URL是有规律可循的，例如环球网校的新闻页，PC端和移动端的分别如下：

• PC：http://www.hqwx.com/web_news/html/2018-3/15199816265369.html
• 移动端：http://m.hqwx.com/news/2018-3/15199816265369.html

可以看到，/2018-3/15199816265369.html是一样的，其他的有区别，且也只有这段是变化的，其他的也都是不变的。那么我们的规则可以写成如下：

• PC：http://www.hqwx.com/web_news/html/(d+)-(d+)/(d+).html
• 移动端：http://m.hqwx.com/news/(d+)-(d+)/(d+).html

这样就可以了，如上代码中的 (d+)代表数字的意思，如果想了解其他可参考百度给出的官方说明文档，连接如下：https://ziyuan.baidu.com/college/courseinfo?id=267&page=5#h2_article_title22
规则适配，也分为单条规则和多条规则的提交。这里我们举了一个例子，多条的只是需要把这些规则放到txt文件中，然后写多个提交。没什么区别，这里就不多说了。百度移动端适配提交之URL适配
URL适配，是指那些没有规则的页面，实际中，我们每一个站点可能都或多或少的存在这样的问题。百度也给出了我们解决办法。
需要我们提交pc-wap端url对，可以是文件上传，也可以在工具中直接填写。这里建议少的话就直接在工具中填写，要是多的话就提交txt文件即可。截图如下：

选择文件提交需要注意如下条件：

• 文件类型为txt，文件大小<=10M。URL对不超过50000对。
• 文件要求每行一对URL，URL对文件为两列，第一列为PC URL，第二列为移动URL，两列之间以空格隔开。
• 一次最多上传10个文件，可以提交多次。

选择URL对提交，直接填写即可，注意看截图中的文字提示要求。
如上步骤我们的移动适配工作就全部完成了。等待搜索引擎提示适配成功就等着流量上涨吧，如下是环球网校在做完移动适配后的流量趋势图：

8月底做完之后，短暂2个月，环比增长约300%，当然之后还是增长的，由于数据问题，我删除了具体数值以及没有选择更长的时间维度。我想这样应该够说明问题了。