移动 Web 设计中的一些错误理念

fmms 13年前
     <div id="news_body">     <p>        目前,移动互联网飞速发展,越来越多的网站和应用开始向移动设备上迁移。但是,由于设备和操作方式的不同,移动 Web 设计和传统的 Web 设计之间有很多不同点,这就导致了一些错误的设计理念出现。</p>     <p>        在设计过程中我们应该注意哪些问题呢?下面,让我们来看看本文作者——<a href="/misc/goto?guid=4958335299196396922" target="_blank">Headscape</a> 的联合创始人之一 Paul Boag 是怎样看待这些问题的。</p>     <p>        <strong>以下为文章原文:</strong></p>     <p>        我的 Web 开发开始于 1994 年,那时我们犯了很多错误。但不幸的是,在 2011 年的移动开发领域,我又开始看到了这些错误的再次出现。</p>     <p>        我不确信我是否喜欢一些人讨论移动 Web 的方式。就像传统 Web 设计经历过青涩的青春期一样,移动 Web 设计现在正处于这一时期。</p>     <p>        开发设计组织正开始关注移动互联网,因为他们留意到用户一步步地接纳了这一网络,就像前几年一步步接纳传统互联网一样。他们知道移动互联网会变得举足轻重,但他们对其用户基础并没有具体的考量,以用来评估是否值得大笔的投资。</p>     <p>        当我们看着 Web 设计师纷纷转投移动 Web 时,我们意识到其实这也和以前传统印刷业设计师转投 Web 是一样的情况。</p>     <p>        可这些转行的设计师,带来的也许有不好的建议,和一些半吊子的解决方案。</p>     <p>        我曾留意到移动 Web 和传统 Web 之间有一些共同点。这些共同点主要存在于以下三个方面:</p>     <p>        <strong>1、“我们也能进行 Web 设计”</strong></p>     <p>        我还记得,在九十年代末和新世纪的头几年,印刷业设计师刚开始转行做 Web 设计,那时状况有多恼人!在他们的观点中,互联网和印刷出版物差别不大。</p>     <p>        实际上,两者的确有很多互通的技巧,但也有很多差别。Web 和出版物并没有看上去那么相似。</p>     <p style="text-align:center;"><img alt="移动 Web 设计中的一些错误理念" src="https://simg.open-open.com/show/5394ad4754ff3e0e05b26c8650f2e2f9.jpg" width="483" height="300" /></p>     <p>        移动 Web 上我看到了一样的情形。很多传统 Web 设计者声称他们也能做移动 Web 设计。他们试着将传统 Web 设计中的技巧运用于移动 Web。不过,这并不总是靠谱。</p>     <p>        我不是说 Web 设计者不应该涉足到移动的领域。我只是希望这些设计者在提出所谓“可以满足要求”的解决方案之前,能更细心地去理解思考一下移动 Web 的特点,而不是在对这种新形式的传播媒介完全不够了解时就发表见解。</p>     <p>        我还想说的是,单纯地载入一个适于移动 Web 的样式表,或者只进行响应式设计,这不可能足够。这就涉及到一个接下来要说的,我思考了一段时间之后留意到的相同点。</p>     <p>        <strong>2、“我们只需要简单地重用……”</strong></p>     <p>        回到以前,那时 Web 设计的客户正考虑“把他们的小册子放到网上”。他们希望复制已有的印刷工作的内容,一样的文字,一样的设计,什么都一样。</p>     <p>        让我担心的是,今天的 Web 设计者和客户也正进行着过去那种谈话。等着把内容“送上 Web”的客户,谈论的是把相同的内容简单搬运到移动设备或者桌面电脑上,也就是希望“已有的站点”能出现在移动设备上就足够了。设计者同样没有考虑,<strong>用户是否需要两份一样的内容分别出现在移动 Web 和传统 Web 上</strong>。</p>     <p>        说到移动 Web,我认为语境是最重要的(context is king)。我们要放到 Web 上的内容应该完全依赖于用户所处的语境。用网站 <a href="/misc/goto?guid=4958335299196396922" target="_blank">Headscape</a> 作例子,用户不大可能希望在智能手机的小屏幕上浏览我们的选集。但是,他们可能希望在需要帮助时能联系到我们的办公室或者得到我们的电话。</p>     <p>        移动设备的定位和桌面电脑是不一样的。我们不能单纯照搬已有的网站,还认为这就已经足够。</p>     <p>        <strong>3、“这个站点/App 只工作在……”</strong></p>     <p>        我们这些从事 Web 设计有一段时间的同僚有时会开玩笑地提起“浏览器战争”。“战争”期间,为了抢夺市场,浏览器制造商会发布各自特有的标签,提供给 Web 设计者使用。这场战争的受害者最终是用户。他们登陆一个站点时,经常会看到一条通知,告知他们只能用特定浏览器访问这一站点(通常是 Internet Explorer)。</p>     <p>        Web 设计者其实也是战争的受害者。有时他们不得不答应客户的要求,针对不同的浏览器重复地设计数个版本的网站。最后,客户也受够了,因为他们必须为互不兼容的浏览器导致的重复工作买单。</p>     <p>        我的确在现在移动 Web 领域看到类似“浏览器战争”的事情发生着。开发者组织正在发布用于 iPhone 和 iPad 的 App,用于 Android 的 App,甚至用于 Windows Mobile 的 App。开发者可以利用每种设备各自的特性,来为用户创造不同的体验。</p>     <p style="text-align:center;"><img alt="移动 Web 设计中的一些错误理念" src="https://simg.open-open.com/show/34680963615ccbcb4bf624a298557cd8.jpg" width="504" height="281" /></p>     <p>        可这样一来,大家都遭罪。用户会因为在自己用的平台上,没有另一个平台上某个拉风的 App 而抱怨。开发者更要抱怨为每一个平台进行重复开发。而投资开发的客户则必须为这些重复的工作买单。</p>     <p>        这个问题有一个解决办法,那就是可以考虑开发基于 Web 的 App,而不是基于本地设备。实际上,有很大可能我们不需要本地 App。这样,也许就能实现针对所有移动设备平台只进行一次开发,而且可以使用渐进式增强的方式来在各种设备上提供最出色的用户体验。</p>     <p>        <strong>从云到设备,再从设备到云</strong></p>     <p>        现在,基于 Web 的移动 App 最大缺点是运行速度和连接的可靠性。相比本地 App,基于 Web 的移动 App 总是慢一拍。更麻烦的是很多场合根本就没有条件接入 Web。至少现在,本地 App 更像是比较好的选择,不过我们都应该为它潜在的衰退做准备。</p>     <p>        也就是说,我认为移动 Web 正显示着 Web 演化的方向。过去,软件在本地机器上运行。但是,最近我们看到了一个基于 Web 方向的流动。这可以归结于网络带宽的提升。可靠的高速连接是基于云的应用程序大规模井喷的前提。当移动 Web 应用转移向本地设备时,桌面应用却转向云。我怀疑,当移动设备的可靠高速连接得到保证时,我们将会看到本地移动 App 重新回到云端。因为这将会更加节省开发资源,而且更利于重复编码之外不同种设备的互通。</p>     <p style="text-align:center;"><img alt="移动 Web 设计中的一些错误理念" src="https://simg.open-open.com/show/a635227453e36d253af8a68ffc908e9c.jpg" width="473" height="300" /></p>     <p>        当然,这些都只是猜测。但是,当讨论移动 Web 市场的发展时,我确信它的未来是充满希望的。我想我们能从 Web 过去发展遇到的问题中学习,从而另辟蹊径,开发设计出便宜、高效而且易用的移动站点,而绝不仅仅是现有站点一个格式重排后的版本。</p>     <p>        <strong>结语</strong></p>     <p>        关于移动 Web 是传统 Web 一个简单扩展的论调,我看来是错误的。然而,我也完全不认同本地 App 将一统天下的观点。我认为,未来应该是定制设计的基于云的移动站点。不过,我也相信要等到移动网络能提供更好的全局连接时,我们才能跨过本地 App 这一步。</p>     <p>        Via <a href="/misc/goto?guid=4958335300770300382" target="_blank">Boagworld</a></p>    </div>