Question

我正在设计一个移动网站，基本上我想要两个版本。一个是javascript和css密集型，另一个是旧款手机。非常简单的xhtml。

根据浏览器的功能，有什么方法可以自动重定向吗？

Answer 1

如果构建正确，那么同一个XHTML站点应该支持这两个版本也就是说，我看到了几种可能性：

检查用户代理以确定浏览器类型
在密集型JS版本上使用带有指向简单站点链接的noscript标记
使用JS重定向到简单的XHTML网站上的密集型JS版本（在SEO方面不是很好）

Answer 2

下载一个将元刷新设置为1秒的简短html文件，它也将包含javascript。如果javascript启动，则会立即更改元刷新的URL。

这是一个优秀的降级概念，因为较旧的手机连接速度较慢，因此下载Web应用程序两次是一个糟糕的设计。

理想情况下，您应该让他们下载非js版本，但其中包含脚本标记，因此它还会下载至少一个javascript文件，并且会使用不显眼的javascript来更改原始页面。

但是，因为我预计这将是一个糟糕的设计，这就是为什么我建议元刷新，在下载之间有一个非常微小的暂停，以给javascript时间来修复它。

您还可以通过检查某些对象（例如<canvas>）的存在以及根据对正确网址的更改来检查javascript的版本。

Answer 3

查看UAProf，“关于捕获无线设备的功能和偏好信息的规范。内容提供商可以使用此信息以适当的格式为特定设备生成内容。” （引自维基百科页面。）

同样有趣的是WURFL，这是一个开源的“XML配置文件，其中包含有关许多移动设备的功能和特性的信息。”您可能还想阅读此内容：WURLF and UAProf。

DeviceAtlas是一种流行的商业解决方案，声称比WURFL更全面（它包括所有WURFL数据等）。请参阅：How do you compare DeviceAtlas to WURFL and UAProf。

Answer 4

您可能不需要两个单独版本的网站。使用feature detection来逐步增强您的简单体验是一个更好的主意，以确定何时执行花哨的东西。话虽如此，如果浏览器不支持CSS规则，它们通常会自行优雅地降级。

.background-gradient {
  background-color: #333; 
  background-image: url(some_image.png); /*older browsers simply get the bg image*/
  background-image: -webkit-linear-gradient(top, #333333, #eeeeee); 
  background-image: -moz-linear-gradient(top, #333333, #eeeeee);
  background-image: -ms-linear-gradient(top, #333333, #eeeeee);
  background-image: -o-linear-gradient(top, #333333, #eeeeee);
  background-image: linear-gradient(top, #333333, #eeeeee);
}

确定移动浏览器是否支持CSS和javascript

4 个答案: