我的网站会将访问者恢复到一个单独的移动网站,这在阅读了一些在线指南后似乎相当简单。
但是,我希望人们能够点击移动网站上的链接,然后将他们带到桌面网站。
我看到的问题是,如果我链接回桌面站点,如果它们在移动设备上,它只会将它们重定向回来?
我怎样才能解决这个问题?
我的网站会将访问者恢复到一个单独的移动网站,这在阅读了一些在线指南后似乎相当简单。
但是,我希望人们能够点击移动网站上的链接,然后将他们带到桌面网站。
我看到的问题是,如果我链接回桌面站点,如果它们在移动设备上,它只会将它们重定向回来?
我怎样才能解决这个问题?
你真的想在服务器端做这种事情,而不是在客户端。问题是您强制移动用户(连接可能不好)首先下载整个桌面站点(可能超过 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
所有这些工作的替代方案是开发一个移动优先的响应式网站。不知道你的情况,我会留在那里 - 它并不总是适用于每一个场景。
将重定向到移动设备设为可选(即桌面页面顶部的链接),或仅将移动设备重定向放在初始入口点,即mydomain.com
. 如果他们去mydomain.com/index.html
,那么不要重定向。这样一来,您的“返回桌面”链接就可以只是一个普通的链接,指向index.html
、来自index_mobile.html
或发送到他们的移动体验的任何地方。
就个人而言,我更希望布局足够流畅以适应任何浏览器,那么一开始就没有问题。请记住,现在有各种尺寸的平板电脑可以搅乱移动浏览领域。
不幸的是,您无法在 window.location 更改后检查引荐来源网址。但是您可以添加一个主题标签,然后检查它。
if(window.location.hash == "#stayHereDude"){
// do nothing, or whatever
} else {
window.location = "mobile/index.html";
}
然后,您将在移动页面上创建指向 /index.html#stayHereDude 的链接。
您应该结合用户代理方法来检测带有查询字符串的设备以实现此类功能。所以让我们假设你的链接是
site/default.aspx
如果有人点击此页面,请检查用户代理并在响应中更好地提供适当的站点或事件如果设备检测到移动设备是否只是重定向到m.yourdomain.com/site/default.aspx
但如果有人点击页面 site/default.aspx?type=desktop 然后覆盖检查用户代理并呈现桌面站点的行为。
永远不要先加载桌面站点,然后通过 javascript reditect 加载到移动站点。使用用户代理服务器端执行此操作。
您可以使用 Cookie、会话或本地存储,这样当用户单击“转到桌面站点”时,它会设置一个值。
假设当手机上的用户单击“转到桌面站点”时,您将名称设置为“mobileOff”,并将值设置为“1”或“true”。然后,无论您在哪里进行移动检查,添加一个条件来检查用户的 cookie/session/localStorage 中的 mobileOff,如果它设置为 true,则绕过自动移动重定向,否则,加载主桌面站点。
在进行移动重定向的主页上,您需要检查 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";
}
如果您只是从单个页面重定向到您的移动网站,则此方法有效。
静止的
/site/index.html
/site/mobile/index.html
然后你可以使用一系列的东西。
如果您使用的是静态站点,则变得更加困难,因为它会因 JavaScript 重定向和两个许多重复页面而变得混乱。发布您的代码并告诉我们您当前的设置方式,我将更新我的解决方案。