专栏首页无原型不设计来自用户体验大师的100个UX设计建议——上篇

来自用户体验大师的100个UX设计建议——上篇

以下内容由摹客团队翻译整理,仅供学习交流,摹客iDoc是支持智能标注和切图的产品协作设计神器

网站用户体验设计(UXD或UX)是通过提高用户与网站交互的可用性、可访问性和效率来提升用户满意度的过程。在Intechnique机构,我们一直都在研究并应用最好的用户体验原则。今年早些时候,我成为了世界上第9个获得尼尔森诺曼集团(Nielsen Norman Group)颁发的UX硕士学位的人。在此,我想分享一下这些年来我获得的一些最佳实践原则。以下是我列出的100个顶级用户体验实践,供网页设计师们参考。

一、关于用户流程

1. 把网站设计想象成铺设一条黄色的砖路,理解用户角色的目标和需要,然后不断让用户从一个区块跳转到下一个。

2. 用户更有可能注意到网站/页面顶部附近的内容/选项,建议按其重要性排序。

3. 风格一致且易于使用的web界面可以让用户专注于内容并进行浏览。

4. 避免在网站上创建死循环页面,它们不仅会让用户困惑,并且会给他们增添额外的操作。

5. 使用常见的网站模式和界面,不要增加用户的学习成本。

二、关于滚动页面

6. 只要明确页面下方的折叠区域有更多相关的信息,用户就会向下滚动页面。

7. 网站应该提供用户一个强大的视觉指示器,用于滚动页面和查看是否有更多的内容。

8. 网站页面越长,用户滚动到底部的可能性就越小。

9. 设计滚动页面的想法很棒,因为滚动页面的速度比点击更快,但注意不要让页面过长。

三、对比和颜色应用

10. 如果是专为色盲人士设计的网页/产品,将整体颜色调整至灰度,以确保所有用户都能阅读重要信息。

11. 除了链接外,网站上的任何文本都不要使用蓝色。

12. 注意手机网站上的色彩对比,屏幕眩光让用户无法使用网站/产品。

13. 为网站的CTA按钮专门保留一种颜色,不要用于其他元素。

14. 温暖、明亮的颜色可以应用在显眼位置,寒冷、黑暗的颜色则应用在背景中。

四、关于加载设计

15. 确保网站用户能够快速轻松地完成他们的主要目标

16. 对用户来说,最重要的是网站看起来加载很快(即使这只是他们的感觉)。

17. 用户对网站速度的感知是基于加载时间、加载行为、等待时间和动画的流畅性。

18. 优先向用户展示网站框架和默认元素,以便在加载时了解网站布局。

19. 网站的文本应该在图片完成加载前出现,以便用户可以在网站加载其他内容时开始阅读。

20. 超过几秒钟的加载延迟,往往会让用户选择离开网站。

五、关于移动端设计

21. 如果手机界面元素很小,或者元素间靠得很近,用户很难准确地点击它们。

22. 手机触控目标的最小尺寸应该是1cm x 1cm,并适当填充。

23. 如果用户需要用小拇指去点击手机网站或应用程序,这说明界面上的交互目标太小。

24. 当用户拿着平板电脑时,大拇指最容易接触到的地方是屏幕的两侧和底部。

25. 除了正常的网页滚动,其他任何地方都不需要设计垂直滑动。

26. 移动设备上尽量不要设计双击交互,确保用户可以通过一次触摸完成交互。

27. 在设计移动布局时,考虑用户是否会单手或两只手使用设备的情况。

六、关于导航设计

28. 在网站上设置一个明显的路径供用户访问导航菜单。

29. 如果你的网站层次结构超过3-4级,是时候考虑重新设计了。

30. 考虑使用粘性菜单导航(跟随浏览器滚动的导航),特别是在较长的网页中或需要快速访问时。

31. 一个好的网站导航并不会妨碍网页,使用后会消失在背景中。

32. 导航与网站应该保持一致,不能改变整个网站的风格。

33. 导航标签需要具体化,使用承载信息最多的单词,不要超过2-3个单词。

34. 使用面包屑导航,让用户知道他们在网站上所处的位置。

35. 移动端导航设计:显示最常用的选项,并将其他选项隐藏在汉堡包菜单下。

36. 桌面端的汉堡菜单使用场景较少,因为它并不是非常引人注目,用户也不熟悉,增加了交互成本,减少了信息的呈现。

37. 对于手机的辅助导航,可以使用分类登录页面、子菜单或页面内菜单。

38. 菜单下拉列表应该是垂直的,而不是水平悬停,因为水平滚动要困难得多。

39. Megamenus菜单的设计应该比网页更窄,用户才能很轻松地“点击”菜单。

40. 如果使用megamenus菜单,需要将链接整理成组,并区分可点击和不可点击项。

41. 不要在网站菜单中隐藏登录或搜索功能。

七、关于表单设计

42. 将表单标签和字段对齐到一条垂直线上,以便快速扫描。

43. 字段标签应该在文本字段之外,而不是在文本字段内,这样用户才不会丢失目标。

44. 使用分隔符区分不同部分,使长的网页表单对用户更加友好。

45. 将表单错误提示放在网页表单中所有导致错误的字段旁边。

46. 错误消息提示应该是有用的、可用的、简洁的和容易理解的。

47. 一次性在所有导致错误的字段旁边显示错误提示弹窗,这样移动用户就不会错过这些提示了。

八、关于链接

48. 网站上的链接必须突出——使用蓝色文本或下划线来表示超链接。

49. 链接应该看起来就是链接的样子。

50. 链接文本应该表明链接的指向,而不是让用户通过点击一个链接来找出它的指向。

以上就是《用户体验大师的100个UX设计技巧——上篇》,感兴趣的朋友请继续关注。不久就会为大家推出《用户体验大师的100个UX设计技巧——下篇》。

原文作者:Andrew Kucheriavy

原文地址https://www.intechnic.com/blog/100-ux-design-pro-tips-from-user-experience-master/

学习工具,但不受限于某种工具。摹客iDoc,高效协作,从产品到开发,只要一个文档,让你的团队高效协作!

原文链接:https://www.intechnic.com/blog/100-ux-design-pro-tips-from-user-experience-master/

原文作者:Andrew Kucheriavy

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 你应该知道的网页设计中的规则和禁忌

    网页设计是一个棘手的话题。当你创建网站时你需要考虑很多事情。为了简化这个任务,我这里准备了一个列表,每个网页设计师在设计网页时都应该考虑这些注意事项。好消息...

    奔跑的小鹿
  • 了解这些设计原则,助你打造最佳用户体验

    以下内容由Mockplus团队翻译整理,仅供学习交流,Mockplus是更快更简单的原型设计工具。

    奔跑的小鹿
  • 移动网站应用设计:速度至关重要!

    以下内容由Mockplus(摹客)团队翻译整理,仅供学习交流,Mockplus是更快更简单的原型设计工具。

    奔跑的小鹿
  • 你应该知道的网页设计中的规则和禁忌

    网页设计是一个棘手的话题。当你创建网站时你需要考虑很多事情。为了简化这个任务,我这里准备了一个列表,每个网页设计师在设计网页时都应该考虑这些注意事项。好消息...

    奔跑的小鹿
  • 成人视频网站也遭遇数据泄露!姓名、性取向等108亿条数据曝光,含53万中国用户

    最近,从Zoom到三星手机,从数据公司到娱乐明星,互联网公司的信息泄漏事件频发,文摘菌都觉得有点“写不过来”。

    大数据文摘
  • 网络罪犯:互联网丛林中的捕猎者

    作者 Rabbit_Run 概述 任何使用互联网的人都身处危险之中,不分你年龄几何,不管你在网络上喜欢做什么。网络罪犯能够部署一个强大的军火库,瞄准任何可能的...

    FB客服
  • 当AI学会了咪蒙的文风之后……

    不小心训练了一个AI学习了咪蒙的文章风格,获取了她的世界观,本文演示下此AI的能力。

    mixlab
  • 大神干货:冠军选手分享解题思路,助你轻松突围初赛

    2020年腾讯广告算法大赛的初赛的帷幕已然拉开,新老选手们正面临着全新数据集的挑战。在大家努力刷分的紧张时刻,我们为大家邀请到2019年腾讯广告算法大赛冠军、数...

    腾讯智能钛AI开发者
  • 大会活动 | WAIC2020腾讯QQ黄俊洪:科技向善,用技术解决AI发展所带来的问题

    7月10日,世界人工智能大会腾讯论坛在上海成功举办。本次论坛邀请到了国内外数十位重量级嘉宾,共带来5场主题演讲和1场圆桌论坛,进行观点与经验的交流,思想与智慧的...

    优图实验室
  • 自拍表情包 | 现代古风水彩画

    ? 导语 表情包已经成为我们日常生活中聊天表达情感时不可或缺的一部分,有60%的用户每天都会发送表情消息,但现状往往是用户都在使用千篇一律的表情包,缺乏个性化...

    腾讯ISUX

扫码关注云+社区

领取腾讯云代金券