让人们从移动网站恢复到桌面版网站

时间:2012-10-01 10:04:11

标签: javascript html mobile

我的网站会将访问者还原为一个单独的移动网站,在线阅读一些指南后,这似乎相当简单。

但是,我希望人们能够点击移动网站上的链接,然后将其带到桌面网站。

我看到的问题是,如果我链接回桌面网站,只要它们在移动设备上,它就会重定向回来?

我怎样才能解决这个问题?

7 个答案:

答案 0 :(得分:7)

你真的想做服务器端的这种事情,而不是客户端。问题是你是强迫移动用户(在可能很糟糕的连接上)首先下载你的整个桌面站点(可能超过1MB),只是为了使javascript重定向生效。

到那时,您的移动访问者可能已经失去耐心而已经离开了。

我在这里写了关于这个过程的博客:http://www.9xb.com/blog-2012-08-6-common-pitfalls-when-deploying-a-mobile-site-and-how-they-can-be-avoided/ - 如果你跳到文章的底部,你会看到一个流程图,它描绘了整个过程。这种特殊方法使用cookie,但可以进行调整。这个流程图的优点在于它与语言无关 - 您可以在任何服务器端编程风格中进行开发。

为了您的方便,我已经包含了下面的流程图(尽管我强烈建议您阅读本文):

http://www.9xb.com/wordpress/wp-content/uploads/2012/08/mobile-deployment-small.png

所有这些工作的替代方案是开发一个移动优先的响应式网站。不知道你的情况,我会把它留在那里 - 它并不总是适合每一种情况。

答案 1 :(得分:4)

使重定向到移动设备可选(即桌面页面顶部的链接),或将移动重定向仅放在初始入口点,即mydomain.com。如果他们转到mydomain.com/index.html,则不要重定向。这样,您的“返回桌面”链接就可以成为index.html的常规链接,来自index_mobile.html或您发送给他们移动体验的任何地方。

就个人而言,我更倾向于布局足够流畅,无论如何都适合任何浏览器,那么开始就没有问题。请记住,现在有各种尺寸的平板电脑可以淹没移动浏览水域。

答案 2 :(得分:4)

很遗憾,在window.location更改后,您无法检查引荐来源。但是你可以添加一个#标签,然后检查它。

if(window.location.hash == "#stayHereDude"){
    // do nothing, or whatever
} else {
    window.location = "mobile/index.html";
}

然后,你会在手机页面上链接到/index.html#stayHereDude。

答案 3 :(得分:1)

在制作移动设备重定向的主页上,您需要检查href中是否有某些内容标记为来自移动网站。在我的情况下,我使用了移动网站主页的链接,结尾处有一个?m = 0。例如:http://www.yoursite.com/?m=0

然后在主页上的重定向之前检查href中的m = 0。如果它在那里,不要重定向,如果不是,重定向到移动。

if (window.location.href.match("m=0")) { 
} else {
    window.location = "http://www.yoursite.com/mobilesite";
}

如果您只是从单个页面重定向到移动网站,则此方法有效。

答案 4 :(得分:1)

您可以使用Cookie,会话或本地存储,以便当用户点击“转到桌面网站”时,它会设置一个值。

假设您将手机上的用户点击“转到桌面版网站”,将名称设置为“mobileOff”,将值设置为“1”或“true”。然后,在您进行移动检查的任何地方,添加条件以检查用户的cookie / session / localStorage中的mobileOff,如果设置为true,则绕过自动移动重定向,否则,加载主桌面站点。

答案 5 :(得分:1)

你应该结合用户代理方法来检测设备俱乐部与查询字符串到这种功能。 所以我们假设你的链接是

site/default.aspx

如果有人点击此页面,请检查用户代理,并在设备检测到移动设备是否只是重定向到m.yourdomain.com/site/default.aspx时检查相应的网站或事件。 但如果有人点击页面site / default.aspx?type = desktop,则覆盖检查useragent并呈现桌面网站的行为。

永远不应该首先加载桌面网站,然后通过javascript reditect到移动网站。使用用户代理服务器端执行此操作。

答案 6 :(得分:0)

静态

/site/index.html
/site/mobile/index.html

然后你可以使用一系列的东西。

  1. 缓存
  2. 会话状态
  3. 用户登录和首选项设置(甚至保存数据库)
  4. 如果您使用的是静态网站,则会因为JavaScript重定向和两个重复页面混乱而变得更加困难。发布您的代码并告诉我们您目前正在进行设置的方式,我将更新我的解决方案。