怎么让网站自动识别设备，自动跳转wap页面

自动识别跳转，主要有以下几种方法可以尝试：

1、在网站head标签里加跳转语句

要实现网站根据访问设备自动识别展示手机站或PC站这个功能，需要以下几个步骤：

（1）、你得有一个PC端，在电脑上访问的官方网站，比如：www.baidu.com。

（2）、你需要重新制作一个移动端的手机网站，比如：m.baidu.com。

（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.baidu.com”

}

（4）、进入域名解析系统，做一个别名cname解析，比如：你手机网站制作公司给的地址123.域名.com解析到m.baidu.com域名解析系统。

2、根据移动终端和浏览器版本信息判定的语法

还有一些站长或SEO可能会考虑到移动终端的版本和浏览器版本信息，对此，肥猫科技也为大家整理了一段比较有效的代码，如下所示：

<script type="text/javascript">

var browser={

  versions:function(){

         var u = navigator.userAgent, app = navigator.appVersion

         return {//移动终端浏览器版本信息

              trident: u.indexOf('Trident') >-1, //IE内核

              presto: u.indexOf('Presto') >-1, //opera内核

              webKit: u.indexOf('AppleWebKit') >-1, //苹果、谷歌内核

              gecko: u.indexOf('Gecko') >-1 &&u.indexOf('KHTML') == -1, //火狐内核

              mobile: !!u.match(/AppleWebKit.*Mobile.*/)||!!u.match(/AppleWebKit/), //是否为移动终端

              ios: !!u.match(/i[^]+( U)? CPU.+Mac OS X/), //ios终端

              android: u.indexOf('Android') >-1 || u.indexOf('Linux') >-1, //android终端或者uc浏览器

              iPhone: u.indexOf('iPhone') >-1 || (u.indexOf('Mac') >-1 &&u.indexOf('Macintosh') <0), //是否为iPhone或者QQHD浏览器

              iPad: u.indexOf('iPad') >-1, //是否iPad

              webApp: u.indexOf('Safari') == -1 //是否web应该程序，没有头部与底部

          }

       }(),

       language:(navigator.browserLanguage || navigator.language).toLowerCase()

}

if (browser.versions.ios||browser.versions.android||browser.versions.iPhone||browser.versions.iPad) {

self.location=http://www.baidu.com

}

</script>

3、自动识别手机页面、iPad页面和wap页面

可以根据不同的终端类型适当的改变正则表达式，这段代码添加到需要识别的网页，会根据客户端的类型自动跳转到手机页、平板页或其他移动设备页面，非常的灵活！

<script type="text/javascript">

if(/AppleWebKit.*mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){

  if(window.location.href.indexOf("?mobile")<0){

      try{

          if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){

              window.location.href="http://www.baidu.com/m"

          }else if(/iPad/i.test(navigator.userAgent)){

              window.location.href="http://www.baidu.com/pad"

          }else{

              window.location.href="http://www.baidu.com/wap"

          }

      }catch(e){}

  }

}

</script>

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.baidu.com/m/index.html")

      //停止运行程序

      exit

  }

}

?>

5、做个自动识别的效果

经过多次测试，我们也可以做个自动识别的效果，方法很简单，在你需要自动跳转的页面加入以下代码：

<script type="text/javascript">

var mobileAgent = new Array("iphone", "ipod", "ipad", "android", "mobile", "blackberry", "webos", "incognito", "webmate", "bada", "nokia", "lg", "ucweb", "skyfire")

var browser = navigator.userAgent.toLowerCase()

var isMobile = false

for (var i=0i<mobileAgent.lengthi++){ if (browser.indexOf(mobileAgent[i])!=-1){ isMobile = true

//alert(mobileAgent[i])

location.href = 'http://siteapp.baidu.com/webapp/mahaixiang.cn#m/http://mahaixiang.cn/'

break} }

</script>

6、自动识别移动端适配跳转网址的代码

手机版的网站需要简单，以文字为主，才能很好的兼容，可以在网站的首页设置一个程序来判断用户是手机端还是电脑，如果是手机端，直接中转到手机端，如果是电脑端，直接中转到电脑端（大家也可以使用百度提高的百度移动搜索开放适配服务。

对此，大家可以在网站的首页插入入下代码：

<script type="text/javascript">

function browserRedirect() {

var sUserAgent = navigator.userAgent.toLowerCase()

var bIsIpad = sUserAgent.match(/ipad/i) == "ipad"

var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os"

var bIsMidp = sUserAgent.match(/midp/i) == "midp"

var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4"

var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb"

var bIsAndroid = sUserAgent.match(/android/i) == "android"

var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce"

var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile"

if (!(bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) ){

window.location.href=B页面　

}

}　

browserRedirect()　

</script>

<script type="text/javascript">uaredirect("<A href='http://www.baidu.com/wap/","http://www.baidu.com/index.html")http://www.baidu.com/wap/","http://www.baidu.com/index.html")

</script>

在肥猫科技看来，PC版网页自动识别手机客户端并跳转，用js进行判断是否手机客户端进行跳转最好，特别是静态网页，把这个过程通过js的方式放在用户客户端执行，可以大大减少服务器端额外处理的压力，但是有时需要通过在服务器端进行判断的情况除外。

手机端的标签优化跟PC端的一样，主要问题是移动端页面与PC端页面的适配问题，

手机端标签优化特有的有哪些?

<metacontent="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"name="viewport"><metacontent="yes"name="apple-mobile-web-app-capable"><metacontent="black"name="apple-mobile-web-app-status-bar-style"><metacontent="telephone=no"name="format-detection">

第一个meta标签表示：强制让文档的宽度与设备的宽度保持1:1，并且文档最大的宽度比例是1.0，且不允许用户点击屏幕放大浏览

width-viewport的宽度height-viewport的高度initial-scale-初始的缩放比例minimum-scale-允许用户缩放到的最小比例maximum-scale-允许用户缩放到的最大比例user-scalable-用户是否可以手动缩放

第二个meta标签是iphone设备中的safari私有meta标签，它表示：允许全屏模式浏览

第三个meta标签也是iphone的私有标签，它指定的iphone中safari顶端的状态条的样式

在webapp应用下状态条(屏幕顶部条)的颜色默认值为default(白色)，可以定为black(黑色)和black-translucent(灰色半透明)。注意：若值为“black-translucent”将会占据页面px位置，浮在页面上方(会覆盖页面20px高度–iphone4和itouch4的Retina屏幕为40px)。

第四个meta标签表示：告诉设备忽略将页面中的数字识别为电话号码。

其次是百度对字号间距的规定，需严格遵守。

百度用户体验部对移动页浏览体验的研究成果：

1、主体内容含文本段落时，正文字号推荐14px，行间距推荐(0.42~0.6)*字号，正文字号不小于10px，行间距不小于0.2*字号

2、主体内容含多图时，除图片质量外，应设置图片宽度一致位置统一

3、主体内容含多个文字链时，文字链字号推荐14px或16px：字号为14px时，纵向间距推荐13px字号为16px时，纵向间距推荐14px文字链整体可点区域不小于40px

4、主体内容中的其他可点区域，宽度和高度应大于40px

5、此外，需注意交互一致性，同一页面不应使用相同手势完成不同功能。

再次，降低js，大图片，flash等富媒体资源使用，甚至在非特别必要情况下，使用纯静态文本资源，访问速度快，主题集中，减少蜘蛛工作。用还是不用，可以细致的体现到每个页面策略上去，富媒体的东西无非是利用人右脑功能强化记忆，加强吸引力的。但在移动端，它会严重拖慢加载速度以及占用有限手机空间。并非很好选择，除非对图片要求及flash或交互要求高的站点，不过通常它们的加速方面有强大的技术支持。可有效抵减带来的不利影响。

第四，使用m.jiaodaseo.com，wap.jiaodaseo.com，类似这样的通用标示多次重复标示，并可采用技术手段拒绝pc用户访问。或者强制跳转到pc页面。如果是自适配的，这种办法就不适用了，可加强上面提到的关键词标示，增进识别度。

第五，百度的自定义标签，用以帮助识别pc移动站。

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

2.代码位置：

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

如果是PC站，代码：<metaname="applicable-device"content="pc">

如果是M站，代码：<metaname="applicable-device"content="mobile">

如果是自适应或代码适配，代码：<metaname="applicable-device"content="pc,mobile">。

总的一句话，速度快稳定移动访问体验佳，搜索引擎高度识别，并能建立起移动站跟pc站的一一对应关系。

现在移动互联网发展速度加快，百度移动流量是很多公司都想要实现引流，所以百度移动端优化的推广方式受到了众多公司的青睐。对于上面提到的问题，我们整理了几点关于怎样做百度移动端优化排名的方法。

一、域名格式与页面技术要求。

顾名思义百度手机端优化排名就是在seo百度手机端做关键词的搜索排名优化。那么有哪些影响呢?首先是优化百度移动端排名规则，在排名优化移动端展现中，搜索引擎提倡移动资源，排斥PC页面，所以相同情况下，seo优化移动端站点排名会更靠前。建设格式，URL建议使用：建议用m.x.com这样的子域名格式，而不是使用目录形式的站点。其次请使用：H5进行建站。

二、优化网站移动端seo适配设置。

那么移动搜索对内容有哪些要求呢?尽量保持PC端与seo网站移动端数据同步，做到一一对应，移动搜索会将PC搜索结果适配至移动搜索上。也无需担心因为内容的重复，搜索引擎是否会给予降权，对于移动端页面，spider会认为只是PC端的一个映射而已，会动移动页面进行判断。

移动搜索的优化该怎么设置呢?首先PC和移动URL对应，PC的URL设置自动跳转到对应的移动URL上，用户使用手机打开你网站的时候，也就可以看到对应的内容了，至于如何自动识别PC与移动网站并且跳转。

其次seo手机端优化就是图片延时加载和自动调整图片尺寸。因为是PC网站的图片，而我们实际看到的是手机，所以很容易出现图片变形或图片太大导致网站变形的情况，这个时候我们可以使用自动调整图片尺寸的技术，懂技术的直接可以做好，不懂技术的没关系，把网站添加到百度云加速，然后在云加速里面开启图片快速加载功能即可，这一功能解决了图片延时加载和自动调整网站图片尺寸。

最重要的就是代码，不会代码的就不要做网站移动端seo，手机网站的代码相较于pc要简单的多，因此代码也是尽量极简。

其实关于手机端百度排名优化要求为尽可能的地址，域名跳转保持pc一致，注重用户体验就很完美。

---