创造真正实用的移动端体验的几点建议

小编:现如今,手机的广泛使用使得为网站设计一个移动端的版本势在必行。然而,移动端网站的设计并不是直接把桌面端的网页移植过去那么简单,设计时还要考虑到一些移动端独有的特性。如果你对两者间的区别以及如何设计移动端网站还有困惑,不妨看下这篇文章来学习下吧~

一个网站需要做到移动端友好是不可否认的。移动端用户的数量已经超过了桌面端用户,而且谷歌已经毫无疑问地面对了这个事实,并对可以良好适应移动端的网站大加赞赏。对于希望大部分时间处于在线状态的商务人士来说,使他们访问的网站适应于移动端是很有必要的。

许多网站所有者以为这仅仅意味着把他们的界面缩小一下适应限定的几个典型的移动设备,就可以成为一个智能手机或者平板端的网站。但事实是,移动端的网站与桌面端的网站是不同的。

手机有更多的局限性,如依赖于电池,无线连接,当然还有屏幕空间。把功能转化到更小的屏幕上并不总是那么容易。在大多数情况下,一个移动端友好的网站需要一个完全不同的设计。以下是移动端设计时需要考虑的几点。

移动端优先

如今许多网站开发者首先针对移动端的使用进行设计,然后才是桌面端。由于屏幕尺寸的限制,他们很快地明白了少即是多,并且在设计中保持最简单的特性。这是一个专注于网站重要的方面的问题,要使用户能够轻松执行重要任务,有利于业务进行。

移动端优先这一点的关键是确定主要的内容,把它们按优先级排列,并首先为最小的屏幕设计。当屏幕的尺寸增大时可以再增加更多元素(按照优先级的顺序)。

简单的菜单和导航

移动端的菜单和导航元素和桌面端的同样重要。然而,桌面网页上的典型的菜单栏对于手机来说太大了,所以在大多数情况下最好使用一个汉堡图标(很容易识别),或者一个可折叠的下拉菜单,放在屏幕顶部的左边或右边。

在手机上,多级菜单也带来一个问题,因为通常情况下,用户不愿意经过很多次点击才看到他们想要的。使用户放弃网站的最大点击次数是两次,相反,少于两次用户将会继续浏览网站。

设计的诀窍就是只展示你的网站中最重要的部分,这些内容最有可能是你的用户想看的或者需要的。避免在你的界面上放太多的选项和小部件。这里是一些你应该避免的导航错误(英文文章,有兴趣的童鞋可以了解下)。

创造价值

如果你的业务想要进军移动市场,为网站设计一个移动端的版本是必要的。优化你的网站的搜索引擎一定是很有帮助的。然而,如果你的用户不能从中找到任何价值,你的app可能就无法吸引到他们。

你的手机APP或网页应该有一些理由促使桌面客户端的用户去下载和安装,或者为书签。包括让用户更容易地完成支付,拥有个人账户或快速地获取重要信息。银行业务、通讯和新闻资讯是典型的大多数用户每天都会使用的很有用的网站。

你应该根据你的业务,努力为手机用户创造这样的价值。如果你能够为你的手机APP用户创造价值,那么你所有为创建手机网站或APP以及设计所做的努力都不会白费。

保持流体布局

你可能认为设计手机端网站时可以使用一个固定的以320像素为基数的宽度(手机端最常用的尺寸)并且觉得这样挺好,但事实是手机尺寸的范围非常广,从176到600像素都有。

你需要设计一个流动的网页布局,这样不论是什么尺寸的手机屏幕都能很好地适应。在手机上设计时你需要用百分比而不是固定的像素数来定义宽度,这样不管用户使用的是什么手机设备都没有关系。网站应该是响应式的,这样就达到了你想要实现的易操作性。

触屏功能

如今大多数的手机设备都使用了触屏,用户也习惯了用这种方式进行交互。因此设计一个手机端的网站更加具有挑战性,因为你需要明确不同的手指尺寸大小、纹理和压力,以便屏幕能够准确地响应。

你应该确保所有需要用户输入的元素如按钮和表单要足够大并且不能重叠。你不能依赖于那些老式的手机上可能还有的触控笔或者手机键盘的使用。

你可以使用许多手机设备都有的滑动和手指缩放的标准功能帮助你进行设计。在这种方式下你可以放置更多可点击的元素。

以用户为中心

设计手机端网站的关键是要时刻考虑到用户。你需要遵从一些特定的模式以提升用户体验。这些模式包括:

  • 使控件足够大并且始终放置在屏幕的底部,让用户能够更方便浏览内容并在需要时操作它们。
  • 让用户更容易地找到他们需要的内容。
  • 保持所有的元素直观和统一,这样就不会让用户很费劲地弄明白网站如何使用。
  • 把需要用户输入的情况降到最低,尽可能地使用自动纠错,并支持横屏浏览。
  • 将默认值预先填入到表格中。

特色功能

移动设备有很多限制,但是也有很多桌面端不具备的特点。包括滑动解锁、GPS定位、手势、陀螺仪和位置服务。你可以运用这些手机独有的特点增强你的APP的用户体验。

一个折扣优惠的网站利用位置服务帮助用户找到特定的打折商店就是一个很好地利用手机特有的功能的不错的例子。滑动的功能在一些交友网站上也可以派的上用场。发挥你的想象力,让你的手机APP或网站迎接用户的赞美吧。

继续执行任务

许多手机用户在使用手机网站或APP 时可能会被打扰,迫使他们在还没有完成任务时把手机关掉。也许是一个电话来了,老板进来了或者路灯变绿了。

不管是什么情况,确保用户在再次打开这个网站或APP的时候可以从之前离开的地方继续浏览是非常重要的。你可以去设计,这样用户可以简单快速地重新开始使用网站和APP,他们也会很赞赏这一点。

结论

移动端网站或者app满足了用户日益增长的需求——不用做出任何牺牲就可以随时访问自己喜欢的网站。然而,设计一个优秀的响应式的网站并没有听起来那么简单。移动设备特有的限制和特点给想要创造积极且无缝对接的用户体验的网页设计师带来了挑战。这些建议可以指导你为你的公司创造出真正的移动端功能的设计。

speckyboy

原文作者:Vincent Sevilla

译文作者:学ui网翻译社—Jillian

(0)

相关推荐

  • 放置类AR体验框架和设计建议 (下篇)

    承接上文: <放置类AR体验框架和设计建议 (上篇)> 模型交互的设计分析及体验建议 1. 模型交互的作用范围及交互特点 当用户在真实环境的场景中稳定放下物体模型后,会有与模型进⾏进一步互 ...

  • 腾讯文档web端体验如何

    今天小编要和大家分享的是如何玩转腾讯文档网页版,希望能够帮助到大家. 操作方法 01 首先在搜狗浏览器中输入腾讯文档官网并点击搜索,如下图所示. 02 然后点击腾讯文档,如下图所示. 03 接着点击立 ...

  • 如何让你的UI拥有更好的体验?

    小编:作为每天和界面打交道的UI设计师,我们都希望自己设计出来的界面更漂亮更富有吸引力.但是一个优秀的界面绝不仅仅是看起来好看这么简单,它的背后往往包含了许多深刻的思考.对照以下的这些原则,看看自己设 ...

  • 产品体验报告 | 要深度分析,不要表面赏析

    某个时间我们下载了许多优秀的APP,定了伟大的目标"每天赏析一款优秀产品,学习前沿的交互和视觉风格,努力提高自己的审美和眼界,确保在工作中能迅速找到参考^_^-" 嗯,相信大家都有 ...

  • 8000元GTX1070高端电脑IDY配置推荐

    小编为大家推荐一套8000元低调奢华i7-6700/GTX1070均衡高性价比电脑配置,注重高端体验.均衡与性价比的玩家不妨一起来看看. 低调奢华高性价比 8000元i7-6700/GTX1070高端 ...

  • 高端游戏直播电脑DIY配置推荐

    直播对电脑配置要求高吗?高端游戏直播电脑DIY配置推荐 游戏直播电脑 Q:游戏直播对电脑配置要求高吗? A:用于游戏直播的电脑,一般对电脑性能.宽带.显示器以及外设方面有较高的要求. 性能方面,一般的 ...

  • 腾讯微云多端统一改版

    小编:学UI网经过10来天的备案升级,终于搞定了. 近期,我们对微云WEB端进行了一次"简单"的改版.这篇文章简要记录了改版过程中的一些思考. 为什么要改版 微云WEB端与移动端体 ...

  • Win8设计特性浅谈

    作者:dengxuecui(崔登学) miaotong(佟淼) 10月,一个收获的季节,微软的新一代操作系统window8悄然而至,同时,我们的微博客户端团队,也搭上了第一波win8应用的末班车,设计 ...

  • 设计师面对未来的诀窍

    [译者注]增强现实.虚拟现实.混合现实.人工智能.3D打印.物联网.商业模式.商业价值.设计创新.黑客增长-这是设计师最好的时代,我们能接触到前所未有的新技术新概念新模式.在它们的冲击之下,各种设计可 ...