• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • dedecms
  • ecshop
  • z-blog
  • UcHome
  • UCenter
  • drupal
  • WordPress
  • 帝国cms
  • phpcms
  • 动易cms
  • phpwind
  • discuz
  • 科汛cms
  • 风讯cms
  • 建站教程
  • 运营技巧
您的位置:首页 > CMS教程 >运营技巧 > 移动适配之代码适配配置详细教程

移动适配之代码适配配置详细教程

作者:查字典编辑 字体:[增加 减小] 来源:互联网 时间:2022-05-05

查字典编辑向大家介绍了移动适配之代码适配配置详细教程,自学教程,网站运营教程等相关知识,希望对您有所帮助

移动适配之代码适配配置详细教程1

一、代码适配方法简介

该方法使用相同的网址(不考虑用户所使用的设备),但会根据服务器对用户所用浏览器的了解(ua),针对不同设备类型生成不同版本的HTML。

二、为什么要做代码适配

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

三、代码适配配置方法

主要分为三部分:Vary HTTP标头、Meta applicable-device标签和sitemapXML辅助推送。

1、添加Vary HTTP表头配置

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

2、Meta applicable-device 标签

Vary header 加上之后,为了让百度更好地识别我们的页面是 PC 还是 Mobile,就需要使用百度自定义的这个 Meta applicable-device 标签了。注意以下来自百度的消息:Meta applicable-device 标签,并非是站点必须标注的,现在很多站点没有标记这个标签情况也很好。但这个标签可以帮助百度校验自己的判断,并及时进行修正。做这个事情又不麻烦,所 以我们建议代码适配站点为了保证效果,还是加这个标签。

这部分是在网站的模板里添加的。自适应的网站肯定已经有了判断用户设备是 PC 还是 Mobile 的逻辑。利用这个逻辑,在整站的 部分添加一行代码即可:

1)如果用户是PC设备(注意需要包括Baiduspider PC UA),则添加

2)如果用户是移动设备(包括 Baiduspider Mobile UA),则添加

需要先在测试机上验收。可以用 Google 浏览器来模拟 Baiduspider 来检查是否添加正确, 如图下图所示:

移动适配之代码适配配置详细教程2

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

3、sitemapXML文件辅助推送

在做了Meta applicable-device配置之后,最好要改造一下sitemapXML文件,站长后台实时推送,可以加快让搜索引擎对你的pc站和移动站进行识别。

示例如下图:

移动适配之代码适配配置详细教程3

四、效果跟踪

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

总结:代码适配相比跳转适配复杂程度要更高,这取决于网站的复杂程度和您需要创建的代码库数量。代码适配所需的开发时间可能更长,且要求服务器 端编程;在性能上更高。可以简化为只包含为相应设备优化的内容,以实现最佳性能;维护需求上如果人工维护,将需要大量的资源。许多网站使用内容管理系统来 避免这一问题,并自动在所有模板上发布内容。设备上要求单独的文件和服务器端代码可以提供依设备而定的体验;同时支持扩展至新平台(例如智能电视)。

迷路的小爬虫”个人微信公众账号:seopachong 欢迎关注!如遇到涉及本篇文章相关疑问,我会第一时间帮您解决。本篇文章由“迷路的小爬虫”整理原创,由A5首发,转载请注明笔者版权信息,谢谢合作!

分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • 移动适配之代码适配配置详细教程

相关文章

  • 2022-05-05影响微信公众号排名的因素和排名解决方案
  • 2022-05-05最近网站的百度索引量和收录明显下降是怎么回事?
  • 2022-05-05有流量没利润怎么办?网站盈利模式有哪?
  • 2022-05-05网站定期更新内容的理由
  • 2022-05-05在Bandwagon搬瓦工VPS上安装使用WDCP控制面板的教程
  • 2022-05-05超低价+支持支付宝:美国BudgetVM的VPS主机购买及使用教程
  • 2022-05-05交叉链接在网站优化中的重要性
  • 2022-05-05新手如何学习建立网站?新手建网站方法介绍
  • 2022-05-05移动适配之代码适配配置详细教程
  • 2022-05-052015年微信最赚钱项目大揭秘

文章分类

  • dedecms
  • ecshop
  • z-blog
  • UcHome
  • UCenter
  • drupal
  • WordPress
  • 帝国cms
  • phpcms
  • 动易cms
  • phpwind
  • discuz
  • 科汛cms
  • 风讯cms
  • 建站教程
  • 运营技巧

最近更新的内容

    • 微信公众号粉丝如何从1到5000
    • 关于百度推广您了解多少
    • SEO的未来在哪里?SEO职业规划
    • 进度条加载在网站中重要吗?看实例分析
    • Eleven2服务器主机购买流程及简单评测
    • 网站改版的SEO注意事项
    • 只有移动开发者才能拯救传统ISV、SI企业?
    • 关键词黄金比例如何分配才合适
    • 阿里云服务器中使用万网云域名解析的设置教程
    • 百度移动搜索优化:移动站点的收录、排名等说明

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有