网页设计师认证：如何把握好移动用户体验

新闻 2024-9-22编辑：深圳网站建设阅读（）标签： 移动用户 把握好

深圳网【wǎng】站【zhàn】建设公司 帮【bāng】助企业【yè】提升网【wǎng】站形象,彰显公司【sī】实力,PC+手机+微信+小【xiǎo】程序
【模板网站的价格】国际域名+阿里1G空间+备案 一条龙服务
【定制网站的功能】SEO精准营销系统+城市分站+W3C标准
【营销网站的效果】重长尾，重优化，提权重，扩收录，提排名
【量身订制的设计】据据需求量身定制。设计到满意为止
【专属VIP的服务】24RX365 为【wéi】您提供1对1的专属VIP服务

　　网页设计师认证觉得越来【lái】越多【duō】的【de】产品【pǐn】设计【jì】都选【xuǎn】择遵循【xún】移动优先。原因很简单：我们生活在一个【gè】手机无处不在的世界。但【dàn】这并不总是常态【tài】。

　　目前，网页设计师认证们【men】正【zhèng】面临着在【zài】很小的屏幕设【shè】计【jì】中展示大量【liàng】信息的挑战。除此之外，设【shè】计师还必须熟悉【xī】市场【chǎng】上不断涌现【xiàn】的各种移动设备结构(如曲面屏、异形屏【píng】等)。

　　尽管如【rú】此【cǐ】，也不要被这些表象所迷惑，认为【wéi】手机设【shè】计非常困难。其【qí】实不必过分忧虑，小编已经做了相【xiàng】关调查。并【bìng】结【jié】合自身的经验和【hé】研【yán】究结果，列出了【le】一些简单【dān】的技【jì】巧和技术来方【fāng】便大家在下一个移动设【shè】计项目【mù】中使【shǐ】用。让我们一起【qǐ】来看【kàn】看吧!

　　1.保持主要操作的可访问性

　　确保【bǎo】主要操作的可访问性可以让尽可能多的人使用【yòng】你的产品。保【bǎo】持“Design for Everyone”的理念，重要的是【shì】要考虑人【rén】们手持移动【dòng】设备的【de】不同方式【shì】。

　　人们手持移动设备的三种【zhǒng】主要方式(如下图【tú】所示)，设计师的【de】目标【biāo】就【jiù】是【shì】据此【cǐ】设计【jì】主要动作【zuò】，使它们位于用户手指的操作区域【yù】内。

　　2.考虑可读性

　　与PC端相比，移动设备的屏幕更小【xiǎo】，因此在小型【xíng】移动用【yòng】户界【jiè】面上【shàng】容纳大量信息可能具【jù】有挑战性。只有【yǒu】良好【hǎo】的可读【dú】性与其他设计元素相结【jié】合【hé】，才能提供了【le】出色的用【yòng】户体验。

　　3.避免长滚动问题

　　在阅读大段文【wén】字时【shí】，长滚动是【shì】让用户【hù】集中注意力的好【hǎo】方法。然而研究【jiū】表【biǎo】明【míng】，在其他情况下(例如：当提示用户【hù】完成【chéng】任务时)，用户滚动得越多，就【jiù】越容易失【shī】去兴趣或感到沮丧【sàng】。

　　在这种情况下，建议使用【yòng】具有“点击展开”功【gōng】能的【de】卡片对【duì】复杂内容进行收【shōu】纳【nà】，或通【tōng】过将任务分【fèn】解为几个屏幕，并使屏【píng】幕尽可能短。

　　4.字体类型和大小

　　不【bú】同的字体【tǐ】可以唤起用【yòng】户不【bú】同的情感，同【tóng】时提供【gòng】易读【dú】性。字体选择【zé】不当【dāng】也会破坏设【shè】计，这就是大多数设计师会在【zài】选择正确的字体上花费很多时间的【de】原因。在【zài】谈到字体时，请记住以下几个重【chóng】要【yào】提示：

　　字体：选择一种适合【hé】多种尺寸和权【quán】重的字体，以保证【zhèng】每种尺寸【cùn】的【de】可读性和可用性。

　　字体大小【xiǎo】：使【shǐ】用清晰的【de】字体大小。苹果【guǒ】和谷歌推荐至少【shǎo】使用11号字体，这样【yàng】用户可以在不缩放的情况下以【yǐ】正常的【de】观【guān】看距离【lí】阅读。

　　颜色对比度：使用对比度检【jiǎn】查来【lái】预【yù】防字体【tǐ】和背景之间产生的【de】颜【yán】色问题。另外，应用9-22-10规则【zé】，该规则是保持颜【yán】色平衡的理想比【bǐ】例【lì】。

　　5.留出足够的间距和填充

                                                           图【tú】片源于网络、侵删

　　小屏幕【mù】设计并不一定意味着你只能【néng】使用更小的文本或更【gèng】少的空间。尽量不要让文【wén】本【běn】或其他元【yuán】素【sù】重叠，通过增加【jiā】行【háng】高或元素间距来提【tí】高易读性。

　　另外，还要记住，新【xīn】技术每天都在【zài】涌【yǒng】现，作为一个【gè】设计师，紧跟潮流【liú】是很重要【yào】的。例如【rú】，弯曲的手机屏幕意味【wèi】着将【jiāng】填充增加几【jǐ】个像素【sù】的内边距，以避免【miǎn】不必【bì】要的接触(建议设【shè】备使用大约16pt的【de】最小填充)。

　　6.设计友好的触摸按钮

　　由于【yú】手机触【chù】摸控【kòng】制很【hěn】小【xiǎo】，经常会发生意外【wài】的点击。为了避免这种痛点，需要【yào】创【chuàng】建至少9-22毫米(40px)的控件，这样用【yòng】户就可以用手指精确地点击它们【men】了。

　　为了【le】帮助你理解这条建议的重要性，不妨想想你在【zài】手机中看到的广告【gào】。在广告中，按钮通常【cháng】很小，不容易被发现【xiàn】，并且很【hěn】难触及。当然【rán】，这些【xiē】CTA的目的【de】是防止我们都讨【tǎo】厌的意外【wài】接触。

　　7.保持标签栏干净清晰

　　标签【qiān】栏是每个应用程【chéng】序的一部分，这【zhè】意味着你在设计它们【men】的时候应该【gāi】非常小心【xīn】。现在不是发挥【huī】创造力【lì】的时候!

　　设计干净清【qīng】晰的标签【qiān】栏，并【bìng】尽可能命名【míng】所有标签，以【yǐ】获得更好的用户体验。只【zhī】有当你110%确【què】信用户会【huì】很容易地识别和【hé】理解你的标签时，再【zài】使用图标表达【dá】。如果【guǒ】图【tú】标是必需的【de】，那么它们的结构应该尽可能简【jiǎn】单，不要设计【jì】或【huò】多的选项和层级。

　　8.使用常见的导航条

　　尝试对【duì】导航菜【cài】单使用标准组件，如iOS选项卡栏或Android导航抽屉。不【bú】要试图重新发【fā】明一些新的导航条。用【yòng】户熟悉这些常【cháng】见模式，因此你的【de】应用【yòng】程【chéng】序对他们来说【shuō】将会更加直【zhí】观。这也适用于在这些【xiē】平【píng】台【tái】上设计其【qí】他【tā】不同的元【yuán】素。

　　后记

　　请记住，每次你【nǐ】完【wán】成【chéng】设计时【shí】，无论你遵循【xún】了什【shí】么规则【zé】，或者它在你的眼中有多好，都【dōu】应该执行可用性测试。网页设计师认证希望本篇文章能够为大【dà】家【jiā】带来一【yī】定【dìng】的帮助，一定要将这些【xiē】技巧应用实践【jiàn】，否则你很快【kuài】就会忘记它们!

• 上一章：容易误读的地名,容易读错的城市有哪些
• 下一章：公司网页设计视觉元素排版布局设计技巧