多年来,网站建设公司的专家们一直在说,访问者通过移动设备访问网站的流量一直在急剧增加。出于这个原因,许多公司已经明智地开始采用移动策略,设计制作适合手机和其他移动设备的体验的网站。一旦您花了时间学习如何为移动电话设计网页,并实施您的策略,您还将希望确保您网站的访问者能够看到这些设计。有很多方法你可以做到这一点,有些工作做得比其他更好。在网站建设和运营时如何检测移动端设备的点击量?下面是您可以用来在您的网站上实现移动支持的方法,以及关于在今天的网站上实现这一点的最佳方法。
提供指向其他站点版本的链接
到目前为止,这是处理手机用户最简单的方法。与其担心他们能不能看到你的页面,只需在页面顶部的某个地方放置一个链接,指向你网站的一个单独的移动版本。然后,读者可以自行选择是要查看移动版本还是继续使用“普通”版本。此解决方案的优点是易于实现。它要求您为移动设备创建一个优化版本,然后在正常站点页面的顶部添加一个链接。
但缺点是,您必须为移动用户维护一个单独的站点版本。当您的站点变得更大时,您可能会忘记维护第二个版本,您的站点可能会失去同步。您是否还为平板电脑创建了第三个版本?可穿戴设备的第四个版本如何?这种特定于设备的版本的概念可能会很快失控。你必须在页面顶部放置一个丑陋的链接,让非移动读者可以看到(可能还可以点击)。归根结底,这是一种过时的方法,不太可能成为现代移动战略的一部分。在开发更好的解决方案时,它有时被用作一种权宜之计。
使用JavaScript
作为上述方法的一种变体,一些开发人员使用某种类型的浏览器检测脚本来检测客户是否在移动设备上,然后将客户重定向到该单独的移动站点。浏览器检测和移动设备的问题在于有成千上万的移动设备。要尝试使用一个JavaScript来检测所有页面,可能会使您的所有页面变成下载噩梦-而且您仍然会受到与上述方法相同的许多缺点的影响。
使用css@media
css命令@media似乎是仅用于手持设备(如手机)显示CSS样式的理想方式。这似乎是显示移动设备页面的理想解决方案。您可以编写一个网页,然后创建两个样式表。第一种为“屏幕”媒体类型,用于设置显示器和计算机屏幕的页面样式。第二个用于“手持”样式的小设备,如那些移动电话您的页面。听起来很简单,但实际上并不管用。
这种方法的最大优点是,您不必维护您的网站的两个版本。您只需维护它,样式表就定义了它应该是什么样子-这实际上更接近于我们想要的最终解决方案。这种方法的一个问题是许多电话不支持媒体类型-它们以屏幕媒体类型显示页面。而且许多旧手机和手持设备根本不支持CSS。最后,这种方法是不可靠的,因此很少用于提供移动版本的网站。
使用PHP、JSP、ASP检测用户代理
这是将移动用户重定向到网站移动版本的更好方法,因为它不依赖于移动设备不使用的脚本语言或CSS。相反,它使用服务器端语言(PHP、ASP、JSP、ColdFusion等)。查看用户代理,然后将HTTP请求更改为指向移动页面(如果它是移动设备)。执行此操作的简单PHP代码如下所示:
stristr($ua, "Windows CE") orstristr($ua, "AvantGo") orstristr($ua,"Mazingo") orstristr($ua, "Mobile") orstristr($ua, "T68") orstristr($ua,"Syncalot") orstristr($ua, "Blazer") ) {$DEVICE_TYPE="MOBILE";}if (isset($DEVICE_TYPE) and $DEVICE_TYPE=="MOBILE") {$location='mobile/index.php';header ('Location: '.$location);exit;}?>
这里的问题是,移动设备使用的其他潜在用户代理非常多。此脚本将捕获并重定向其中的许多内容,但并不是所有的脚本都能捕获和重定向其中的一大部分。而且一直都在添加更多的内容。另外,与上面的其他解决方案一样,您还必须为这些读者维护一个单独的移动站点!必须管理两个(或更多!)网站是足够的理由去寻找一个更好的解决方案。
使用WURFL
如果您仍然决定将您的移动用户重定向到一个单独的站点,那么WURFL(无线通用资源文件)是一个很好的解决方案。这是一个XML文件(现在是DB文件)和各种DBI库,它们不仅包含最新的无线用户代理数据,而且还包含这些用户代理支持的特性和功能。要使用WURFL,您需要下载XML配置文件,然后选择您的语言并在您的网站上实现API。有一些工具可以在Java、PHP、Perl、Ruby、Python、NET、XSLT和C+中使用WURFL。
使用WURFL的好处是有很多人随时更新和添加到配置文件中。因此,尽管您正在使用的文件几乎在您完成下载之前就已经过时了,但如果您每个月左右下载一次,您的读者通常使用的所有移动浏览器都有可能不会出现任何问题。当然,缺点是你必须不断地下载和更新这一切,这样你就可以引导用户访问第二个网站,以及由此产生的缺陷。
最佳解决方案是响应性设计
那么,如果为不同的设备维护不同的站点不是解决问题的办法,那么什么才是答案呢?响应性网页设计。
响应性设计是指使用CSS媒体查询为不同宽度的设备定义样式。响应性设计允许您为移动用户和非移动用户创建一个网页。然后,您不必担心在移动站点上显示哪些内容,或者记住将最新的更改转移到您的移动站点。另外,一旦你写好了CSS,你就不需要下载任何新的东西了。响应性设计可能不能在非常旧的设备和浏览器上完美地工作(大多数设备和浏览器在今天的使用非常少,您不应该太担心),但是因为它是附加的(在内容中添加样式,而不是删除内容),这些读者仍然能够阅读您的网站,只是在他们的旧设备或浏览器上看起来并不理想。