随着移动互联网时代的到来,相信很多站长都在想办法把自己的网站做成手机与电脑通用的网站,如何让网站自动识别手机端与PC端是各位站长一直困惑的问题。
很多人都想实现这样一个功能:在电脑上输入域名访问的是PC端的网站,而在手机或者平板电脑等移动设备上输入域名是访问的一个手机网站,而且PC端网站和手机移动端的网站是不一样的,当然手机移动端的网站是简化的,和微信的微网站一样的,很简洁的。
比如:我的网站已经建好了,现在又建了一个手机网站,怎么才能访问同一个域名下让网站自动识别设备,比方说用电脑上进入官网,用移动设备自动进入手机站点,这样就实现了,手机网站和PC网站使用同一个域名,不同的设备访问的时候,看到的是各自的网站。
1、在网站head标签里加跳转语句
要实现网站根据访问设备自动识别展示手机站或PC站这个功能,需要以下几个步骤:
(1)、你得有一个PC端,在电脑上访问的官方网站,比如:www.yx10011.com。
(2)、你需要重新制作一个移动端的手机网站。
(3)、在PC端的网站上加上一段代码,每个页面都需要加上,放在PC端网站head标签里面,代码如下:
//平台、设备和操作系统
var system = {
win: false,
mac: false,
xll: false
};
//检测平台
var p = navigator.platform;
system.win = p.indexOf(“Win”) == 0;
system.mac = p.indexOf(“Mac”) == 0;
system.x11 = (p == “X11″) || (p.indexOf(“Linux”) == 0);
//跳转语句
if (!(system.win || system.mac || system.xll)) {//转向电脑界面
window.location.href = “http://m.yx10011.com”;
}
(4)、进入域名解析系统,做一个别名cname解析,比如:你手机网站制作公司给的地址123.域名.com解析到m.yx10011.com域名解析系统。
2、根据移动终端和浏览器版本信息判定的语法
还有一些站长或SEO可能会考虑到移动终端的版本和浏览器版本信息,对此,马海祥也为大家整理了一段比较有效的代码,如下所示:
3、自动识别手机页面、iPad页面和wap页面
可以根据不同的终端类型适当的改变正则表达式,这段代码添加到需要识别的网页,会根据客户端的类型自动跳转到手机页、平板页或其他移动设备页面,非常的灵活!
4、使用PHP语言来识别
对于一些精通PHP语言的博友来说,也可以通过PHP语法来实现,比如以下的写法:
//设定Mobile的定义
$mobileAgent = array("iphone", "ipod", "ipad", "android", "mobile", "blackberry", "webos", "incognito", "webmate", "bada", "nokia", "lg", "ucweb", "skyfire");
//读取用户的浏览器资料
$browser = $_SERVER['HTTP_USER_AGENT'];
$isMobile = false;
//检查开始
foreach($mobileAgent as $search){
if(stristr($browser,$search)!=false){
$isMobile = true;
//echo $search;
//程式码(转址)
header("Location: http://www.yx10011.com/mobile/index.php");
//停止运行程序
exit;
}
}
?>
5、做个自动识别的效果
经过多次测试,我们也可以做个自动识别的效果,方法很简单,在你需要自动跳转的页面加入以下代码:
6、自动识别移动端适配跳转网址的代码
手机版的网站需要简单,以文字为主,才能很好的兼容,可以在网站的首页设置一个程序来判断用户是手机端还是电脑,如果是手机端,直接中转到手机端,如果是电脑端,直接中转到电脑端。
对此,大家可以在网站的首页插入入下代码:
在一佰互联看来,PC版网页自动识别手机客户端并跳转,用js进行判断是否手机客户端进行跳转最好,特别是静态网页,把这个过程通过js的方式放在用户客户端执行,可以大大减少服务器端额外处理的压力,但是有时需要通过在服务器端进行判断的情况除外。