UI设计技巧:如何提高UI设计的可用性

如何提高UI设计的可用性?无论是网页设计还是APP设计,要确保产品的可访问性是一件知易行难的事情。很多UX设计师的工作都是由一系列的小决定堆叠起来,最终积累构建成一个庞大的产品。但同样这些小决策所带来的小问题也会影响每一个用户,尤其是对身体、认知有障碍的用户,造成巨大的障碍。因此,我们需要善於提升产品的可访问性,继而影响整个产品的可用性。

UI设计技巧:如何提高UI设计的可用性

UI设计技巧

如何提高UI设计的可用性?

UI设计技巧一:给用户提供较大的目标区域

UI设计技巧:如何提高UI设计的可用性

UI设计技巧

每个人面对光标和交互目标时,或多或少都高估或低估自己的交互操作效率。如果给用户设置的目标区域或交互元素太小,也没有提示出发的悬停效果,虽然绝大多数健全用户会在操作过程快速通过微调和校正来尽快达到交互目标,但对有行动或认知障碍的用户而言,会造成非常大的麻烦,甚至是巨大的挑战。

通过给用户提供更大的目标交互区域以及悬停效果,可以让用户更方便地同页面元素交互,从而减少更多不确定性。

UI设计技巧二:使用高对比色彩

UI设计技巧:如何提高UI设计的可用性

UI设计技巧

视力障碍用户在阅读低色彩对比度内容时,会明显感觉到困难,提高UI对比度不仅对这类用户友好,而且对於降低视觉疲劳也有显着效果。

另外,根据W3C规定,高於4.5:1的色彩对比度,能给界面带来更清晰的轮廓,也更利於用户分辨不同元素和控件边界。

UI设计技巧三:不单纯使用色彩表达

UI设计技巧:如何提高UI设计的可用性

UI设计技巧

同样对於视力有障碍的用户而言,单纯使用色彩向他们传递「禁止」、「完成」等含义,在大多情况下会显得不够清晰,甚至他们可能无法直接识别。再者,颜色本身的含义是後天被赋予,部分是被约定俗成,但并不是每个人对此都有足够清晰的认知,甚至同一种色彩在不同文化和场景会表达出截然相反的含义,例如:白色在西方国家代表纯洁,但对於东亚国家而言是死亡、葬礼之意。

因此,通过清晰的文本和符号协助色彩完成信息的传达,会让UI信息更加清晰直观,甚至当你去掉色彩是,UI界面中的内容和文本同样能被用户正确识别。

UI设计技巧四:为连结和按钮添加指引性文本标签

UI设计技巧:如何提高UI设计的可用性

UI设计技巧

按钮和连结上对应的文本不应该是简单的「是否」、「确定」、「取消」,在很多语境中,这些词汇会有多种理解方式,容易给用户带来误解。

为连结和按钮添加指引性更强的文本标签,能帮助用户了解按钮实际的功能和指向性,也便於有视力障碍用户无需过多猜测。

除此之外,按钮和连结文本要控制好色彩对比度,吸引用户快速关注,从而提高UI的可访问性。

UI设计技巧五:使用有意义的标题和结构

UI设计技巧:如何提高UI设计的可用性

UI设计技巧

对用户而言,阅读长篇大论的文本是有门槛的,相反结构化文本在这方面会强很多。

就算文本内容不多,也要确保分段清晰,带有明确主题总结的小标题,能让用户立刻抓住段落的核心信息,保证他们在浏览过程不会因为走神而找不到内容。此外,标题除了具有总结性,最好使用表述性语句,方便用户理解内容功能,保证标题和内容的相关度足够高。

UI设计技巧六:用占位符演示表单内容

UI设计技巧:如何提高UI设计的可用性

UI设计技巧

表单是界面中极为重要的组件之一,为了保持界面乾净整洁,使用占位符描述表单内容是一种常见的手段。如果用户输入时占位符消失,他们可能会忘记应该输入什麽内容或采用什麽样的样式。

为了降低认知负荷,直接使用对应字段格式的占位符来展示给用户,通过字段输入框外确定文本告知用户具体输入的字段。这样不管什麽时候,用户都不会存在不清楚填写什麽问题的情况。

UI设计技巧七:用清晰报错指引帮助用户

UI设计技巧:如何提高UI设计的可用性

UI设计技巧

在填写表单字段时,即使有明确的指引,用户依然有相当大的概率填写错误,这个时候报错提示就显得十分重要。

用户在填写表单过程中难免会出现,这时要确保错误提示的色彩对比度足够强,方便用户能够定位。同时兼顾有视力障碍的用户,尽可能简单用词,告诉用户如何解决这些错过,避免用户去猜。

UI设计技巧八:使用高对比度的焦点指示器

UI设计技巧:如何提高UI设计的可用性

UI设计技巧

虽然绝大多数用户都会使用鼠标和触控板操控,但依然有部分用户习惯使用键盘,再者再进行多字段表单输入时,使用键盘Tab按键快速切换也的确比鼠标交互要快。

当用户使用键盘进行快速切换,选中按键和输入框的焦点指示器,尽可能使用对比度高的色彩,方便用户清楚知道当前选中的控件,以便产生疑惑或模糊不清的感觉。

提高控制界面可访问性,能兼顾更大范围用户,有效延长产品本身的价值,从而提高产品所带来的转换。

本文来自投稿,不代表重蔚自留地立场,如若转载,请注明出处https://www.cwhello.com/42293.html

如有侵犯您的合法权益请发邮件951076433@qq.com联系删除

(0)
InspirrInspirr订阅用户
上一篇 2022年6月25日 01:27
下一篇 2022年6月25日 01:27

相关推荐

  • 分享如何套用html模板文件。

    套用HTML模板文件的步骤如下: (图片来源网络,侵删) 1、准备模板文件 创建一个HTML文件,该文件将作为模板,在文件中编写基本的HTML结构,包括DOCTYPE声明、html、head和body标签等。 在head标签中引入CSS样式表…

    2024年6月26日
    03
  • 网页设计技巧:优秀的网页设计头部需要注意什麽?

    如今极简主义风格盛行,大部分企业网站版面非常简约,看多了难免会让人觉得乏味。因此,不少网页设计师都会花心思在网页的头部,使网站在视觉上更加丰富且富有深度。那麽,优秀的网页设计头部需要注意什麽?看看,南…

    2022年6月25日 建站资讯
    0114
  • 公司网页设计如何使用动效?

      説明使用者从错误或者意外的操作当中恢复 对於使用者来说,错误与意外的页面操作其实是经常发生的。当错误发生的时候,不仅会影响到用户体验,还会直接影响到用户的实际操作。因为无论这些错漏或者意外是怎…

    2022年6月25日
    0130
  • 哪些产品适合使用深色背景设计?深色网页设计需要注意什麽

    在网页设计中,选用深色作为背景颜色一直受到人们的争议。合理的深色系背景设计会使界面变得更加简单易用,同时还能提高产品的使用效率。相反,不恰当的深色背景,不仅会亏掉你精心的设计,甚至可能会让用户对产品…

    2022年6月25日 建站资讯
    0258
  • 如何做好签到功能设计?用实战案例帮你掌握。

    签到的存在不仅可以增加用户的黏性,也是激活用户参与度的关键因素之一。签到按钮在 UI 设计场景中,算是较为常见的一个类型,一个好的签到按钮不仅可以提高用户的关注度,也能激发用户的点击欲。这就是给你的一个…

    2023年3月7日 SEO操作
    03
  • UI设计技巧:UI设计需要了解哪些心理学内容

    企业若想要透过UI设计能吸引用户关注、发掘潜在客户,甚至进行诱导转换等,了解相关的心理学是非常重要的。那麽UI设计需要了解哪些心理学内容? 为什麽UI设计需要了解心理学? 在UI设计和交互设计中,学懂用户心理学…

    2022年6月25日 建站资讯
    0221
  • B端筛选功能如何设计?4个章节帮你掌握。

    引言筛选作为一个常用的功能,在产品设计中的应用面是非常广的。比如我们去购物,会选择销量高、价格实惠并且包邮的商品,筛选区的设计就便于用户进行数据的查询和定位,可以快速查询到满意的商品。本文就筛选这个…

    2023年3月7日 SEO操作
    04
  • 做一个公司网站要多长时间?

    如果找网页设计公司做网站要多长时间?当我们去拜访客户的时候很多的企业主都会问我们这样的问题。 这样分情况来说明一下,主要分为:模板网站、定制型网站这2种。 模版型网页设计,制作周期一般在5~7个工作日。 所…

    2019年8月19日
    0228

联系我们

QQ:951076433

在线咨询:点击这里给我发消息邮件:951076433@qq.com工作时间:周一至周五,9:30-18:30,节假日休息