网站移动适配之Meta标注、移动跳转

创建移动站点后,可以通过一个js来判断访问者的UA信息,实现自动跳转功能 ,然而,搜索引擎却会将他们视为不同的站点,从而影响SEO。为了解决这个问题,我们就必须遵循搜索引擎的移动适配原则,对2个站点进行移动适配。

下面主要分享下META标注移动跳转的部署方法:

一、完整代码示例

首页举例,实现移动适配META标注、移动站跳转的做法如下:

①、在PC站点部署代码:

head部分:

footer部分:

②、在移动站点部署代码: 

head部分:

footer部分:

以上则为首页的移动适配+跳转的完整代码,但一个网站有N多页面,所以我们必须做成动态代码,实现每个网页的移动适配及跳转!

二、动态部署代码

要做动态部署代码,就得考虑建站程序所用语言,目前***流行的建站语言主要是php和asp。php以wordpress为主,其次有emlog、typecho等,asp则主要是ZBlog。

核心思想很简单:既然是每个页面都要做移动适配,那么先动态获得当前页面地址,然后进行规则替换即可!

①、Wordpress专用

我们先将如下代码加到header.php

然后继续添加如下代码,就能完成所有页面的PC站点的移动跳转和移动适配:

至于移动站的适配,依葫芦画瓢,把进行替换的那句中的http://和http://m. 换一个位置即可!这还要多简单??

②、PHP通用

I、PC站点:

在PC站点的head部分添加php函数(WP可直接加入function.php模板中),用于获取当前页面的移动地址:

然后继续添加如下代码,则可在PC站所有页面的head中动态输出【移动适配\跳转】所需要的代码:

II、移动站点

相应的在移动站点中部署如下函数,用于获取移动站点所有页面对应的PC页地址:

在移动站中继续添加输出代码:

③、ASP版本

下面仅提供获取地址代码,自己参考折腾吧!

I、获取PC站当前页对应的移动站地址:

II、获取移动站当前页面对应的PC站地址:

有了以上代码,相信你能写出移动适配的输出代码的,不是么?

④、JS通用版本(适配暂时不可用):

这个极其简单,直接获取当前页面地址,然后替换成对应的移动或PC地址即可:

PC页面head部分:

移动页面head部分:

简单是简单,但这个方法的移动适配是不可行的(跳转可行),因为搜索引擎暂时还无法识别js输出内容。不过,谁也无法拍板说搜索引擎以后不会识别。

三、注意事项

①、代码针对的是非WWW的顶级域名,如果是带www的,需要修改代码;

②、代码中用到的UA判断uaredirect.js,移动站和PC站是不一样的!;

③、PHP版本中用到的函数带,推荐加入到主题模板的function函数模版当中;

④、本文分享的移动适配仅涉及Meta标注的方法,至于另一种sitemap对应关系提交方法请移步查看

本文转载于:http://zhangge.net/4369.html 内容略有精简。


发表评论

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

使用新浪微博登陆