175 6191 5976

添加官方微信

领创时代关于网站建设、青岛画册设计、青岛网站设计的观点和相关新闻 将我们的想法与焦点与你共享

兼容移动端设备的最佳网站设计方案

2019-08-16 来源:小领

多年来,网站设计专家们一直在说,移动设备上访问者访问网站的流量一直在急剧增加。出于这个原因,许多公司已经巧妙地开始为其在线业务采用移动版战略,创造适合手机和其他移动设备的体验。

一旦您花时间学习如何设计手机网站并指定移动版策略时,您还需要确保您网站的访问者可以看到这些设计。有很多方法可以做到这一点,有些方法比其他方法更好。下面介绍一下您可以用来在您的网站上实施移动支持的方法,以及最新的移动端网站设计的建议,以便在适应移动端开发与设计中占据有利位置。

提供另一个站点版本的链接。到目前为止,这是处理手机用户最简单的方法。不要担心他们是否可以看到您的网站链接,只需在页面顶部附近放置一个指向您网站的单独移动版本的链接即可。然后读者可以自行选择是否要查看移动版本或继续使用“通用”版本。

该解决方案的好处是它易于实现。它要求您为移动设备创建优化版本,然后在正常网站页面顶部附近添加链接。 

缺点是:您必须为移动用户维护一个单独的站点版本。随着您的网站变大,您可能会忘记维护第二个版本,并且您的网站可能会失去同步性。您是否还为平板电脑创建了第三个版本?可穿戴设备的第四个版本怎么样?这种特定于设备的版本的概念可能会非常快速地失控。你必须在页面顶部放置一个丑陋的链接,非移动阅读器可以看到(并可能点击)。

所以,这种方法已经过时,不太可能成为现代移动端解决方案的一部分。它有时被用作一个临时修复方案,同时正在开发一个更好的解决方案,但在这一点上它实际上是一个短期的创可贴。

使用JavaScript。在上述方法的变型中,一些开发人员使用某种类型的浏览器检测脚本来检测客户是否在移动设备上,然后将它们重定向到该单独的移动站点。浏览器检测和移动设备的问题在于有数千个移动设备。要尝试使用一个JavaScript检测它们,可能会将所有页面加载变得非常慢,并且您仍然会遇到与上述方法相同的许多缺点。

使用CSS @media。CSS命令@media掌握似乎是一种理想的方式来显示CSS样式,仅适用于手持设备 - 如手机。这似乎是显示移动设备页面的理想解决方案。您编写一个网站页面,然后创建两个样式表。“屏幕”媒体类型的第一个为显示器和计算机屏幕设置页面样式。第二个用于“掌上电脑”的样式将您的网站页面设置为像手机这样的小型设备。听起来很简单,但它在实践中并没有真正起作用。

此方法的最大优点是您不必维护两个版本的网站。您只需维护一个,样式表定义它应该如何。 这实际上越来越接近我们想要的最终解决方案。

这种方法的一个问题是许多手机不支持媒体类型 - 它们用屏幕媒体类型显示其页面。许多旧手机和手持设备根本不支持CSS。最后,这种方法不可靠,因此很少用于提供网站的移动版本。

使用PHP,JSP,ASP.NET来检测用户代理。这是将移动用户重定向到移动版网站的更好方法,因为它不依赖于移动设备不使用的脚本语言或CSS。相反,它使用服务器端语言(PHP,ASP.NET,JSP等)来查看用户代理,然后将HTTP请求更改为指向移动设备(如果它是移动设备)。

这里的问题是移动设备使用了许多其他潜在的用户代理。这个脚本将捕获并重定向很多,但不是全部。还有更多的东西一直在增加。

另外,与上述其他解决方案一样,您还必须为网站浏览者维护一个单独的移动网站!必须管理两个(或更多!)网站的这个缺点足以让我们有动力找到更好的解决方案。

使用WURFL。如果您仍然决定将移动用户重定向到单独的站点,那么WURFL(无线通用资源文件)是一个很好的解决方案。这是一个XML文件(现在是一个DB文件)和各种DBI库,它们不仅包含最新的无线用户代理数据,还包含这些用户代理支持的功能和功能。

要使用WURFL,请下载XML配置文件,然后选择您的语言并在您的网站上实施API。有一些工具可以将WURFL与Java,PHP,Perl,Ruby,Python,Net,XSLT和C ++结合使用。

使用WURFL的好处是有很多人一直在更新和添加配置文件。因此,虽然您使用的文件几乎在您下载之前已经过时,但如果您每月下载一次,那么您可能会拥有使用的所有移动浏览器。问题。当然,缺点是您必须不断下载和更新。所有这些都可以将用户引导到第二个网站以及产生的错误。

最佳解决方案是响应式设计。因此,如果为不同的设备维护不同的站点不是答案,那么是什么?响应式网页设计。

响应式网站设计是您使用CSS媒体查询为各种宽度的设备定义样式的地方。响应式设计允许您为移动和非移动用户创建同一个网站。然后,您不必担心移动网站上显示的内容或记住将最新更改传输到您的移动网站。另外,一旦你编写了CSS,你就不必下载任何新内容。

响应式网站设计可能无法在极其旧的设备和浏览器上完美运行(目前大多数设备使用非常少,对您来说不用太担心),但因为它是附加的(在内容上添加样式,而不是采用内容这些读者仍然可以阅读你的网站,它在旧设备或浏览器上看起来不太理想。

版权声明:转载此文章须经 领创时代 同意,并请附上 领创时代 及本页链接http://www.leadnov.com/newsItem.aspx?id=248
创造品牌视觉体验 X 创新IT技术赋能企业
领创帮助您创新品牌战略,让品牌成为最具价值的资产。
中国·山东 青岛市市北区郑州路43号橡胶谷A栋
热线:175 6191 5976
微信:leadnov
Copyright © 2018-2020 leadnov All Rights Reserved
鲁ICP备18056479号-1站点地图

关注领创公众平台

添加官方微信

175 6191 5976