网页设计师制作的五大最常见的用户体验错误

善微科技 2019 09月07日 发布

网页设计师的使命是创建引人入胜的用户体验,帮助网站访问者完成任务并增加转化次数。在这个过程中,他们往往只关注美学,走捷径,最终依赖各种常见的设计模式和趋势。这样做的危险在于,它们可能会受到流行趋势的影响,因此,由于趋势被不适当地部署,因此会出现常见的用户体验错误。


当涉及到网络,人们不想学的东西,他们想要做的事情。网络上有很多例子,设计师选择只关注视觉吸引力,这样做会牺牲可用性。他们认为推动设计的“哇哇时刻”本身就足以吸引用户。但令人遗憾的是,用户很难理解用户界面,使用该网站时遇到了真正的困难,并且该网站的跳出率飙升。


 


常见的用户体验错误驱使人们离开。

设计师应尽其所能避免常见的用户体验错误,并将障碍放入用户的路径。

让我们来看看一些常见的UX错误。


网页设计常见的UX错误1:大型固定标题


在网站上可以看到越来越多的高粘性标题。“品牌块”和导航菜单具有固定的位置并占用大量空间。它们保持粘在浏览器窗口的顶部(“粘性标题”),并且经常在内容滚动时阻止内容。


大品牌网站上的一些标题高度超过150像素。他们的价值在哪里?固定元素(例如粘性标题)可以带来真正的好处,但是网页设计者应该小心使用它们 - 需要考虑几个重要的UX问题。


大胖头棒是一个主要的UX错误。

这个网站上的粘性标题超过160像素高,占据了很多可视区域。

粘性导航头可能太舒服了

如果已经决定使用粘性导航标题,则最好与用户一起测试。过度使用带有内容的粘性导航标题是一个常见的UX错误。使用固定的标题,访问者仍然可以轻松浏览。未能找到合适的平衡可能会为主要内容留下少量空间,并为访客留下令人窒息,幽闭恐怖的网站体验。


有时候CSS有一个简单的解决方法:通过使粘性标题略微透明,人们仍然可以在滚动时通过它看到内容,这使得内容区域感觉更加丰富。


 


网站上的大型粘性导航是最常见的UX错误之一。

这个网站的粘性标题高度超过180像素!在某些笔记本电脑上,这超过了整个页面高度的30%:用户体验不佳,这是可以避免的。


不考虑移动设备上粘滞的Nav Header问题

有些人可能正在使用大型高分辨率计算机显示器,其中粘性导航头可以加速交互,但移动设备呢?毫无疑问,大量网站访问者将通过移动设备访问该网站,因此固定标头可能不是最好的主意。幸运的是,响应式设计技术可以为不同的平台设计不同的解决方案,并坚持使用针对桌面浏览器的粘性导航标题。


 

Web设计人员常见的UX错误。

在这种情况下,标题导航可以说是高分辨率屏幕的正确解决方案,因为它可以实现更高效的导航。在较小分辨率的屏幕上,标题也是固定的,但占用了相当大的空间。移动设备上粘性导航标题的绝佳替代品是永远存在的汉堡菜单。虽然这种模式不是一个普遍的问题解决者,但它确实释放了大量的空间。


网页设计常见的UX错误2:薄,轻字体


如今,轻薄的字体在众多移动应用和网站上无处不在。随着屏幕技术的进步和渲染的改进,很多设计师都在使用它们,因为它们优雅,干净,时尚。但是,薄字体会导致可用性问题,从而妨碍用户体验。


网站上所有文本的目标都是清晰易读的,薄型会严重影响可读性。并非所有访问者都会在显示器上查看呈现薄型的网站。 


最重要的是,文字必须清晰易读。如果用户无法阅读您应用中的文字,那么排版的美妙程度并不重要。


Apple人机界面指南

Apple指的是移动应用程序,但同样的原则适用于网站。易读性是强制性的,不是可选的良好可用性。如果内容不可读,那么将内容放在网站上是没有意义的。


精简字体也是移动设计中常见的UX错误。

移动网站上的轻薄字体示例会对可读性产生负面影响。

以下是在使用thin类型之前需要考虑的一些常见UX错误:


使用轻薄字体,因为它是时尚的

字体不仅应该看起来不错,而且应该清晰易读。为了获得适当的对比度和易读性,设计师应力求在设计中实现最佳组合:尺寸,重量和颜色。


最好在各种设备和屏幕尺寸上测试网站,以确保所有网站文字都清晰可辨。


这导致我们下一个常见的UX错误:


不测试所有主要设备上的文本易读性

对于许多设计师昂贵,精细调整的显示器而言,轻薄型可能看起来很好,但是经常在更便宜,不合标准的显示器上看到我们设计的普通用户也必须考虑。最佳做法是检查字体在所有主要设备上的外观:台式电脑,笔记本电脑,平板电脑和智能手机。


例如,在测试移动设计时,让参与者在白天使用移动设备上的网站 - 现实世界的用户并不总是拥有完美的浏览和照明条件。如果在网站上使用瘦字体,则可以采用一种简单的方法来适应移动用户:在移动设备上指定较粗的字体以提高可读性。


网站的用户体验问题。

旧版Apple Music网站上的低对比度文本。

网页设计常见的UX错误3:低对比度文本

在现代用户界面设计中,使用低色彩对比元素也变得时髦。它源于极简主义的设计趋势,因为通过降低某些区域的对比度,设计将显得“极简主义”。设计师无法削减需要呈现的信息的复杂性,因此他们在设计中扮演低对比度。


我们已经介绍了很薄的字体,但是存在一个更大的缺陷:由于糟糕的可读性而严重阻碍用户体验的低字形轻字体的组合。设计师应该尽一切可能避免这种可用性陷阱。


正文副本中的低文本对比度

Cool Springs Financial在其网站上使用了一个薄的Helvetica变体用于正文。虽然它看起来很优雅,并且有助于美观的用户界面,但很难在几个平台上阅读。虽然低对比度不一定是坏的,但它会使文本难以阅读,从而对网站的可用性产生负面影响。


UX趋势低对比度文本的示例。

网站上的小而薄的低对比度正文文本使其难以阅读。

不测试文本对比度

在网络上有一个名为Colorable的对比度检查的漂亮工具,可以帮助设计师根据Web内容可访问性指南设置正确的文本对比度。一旦设计师知道他们正在使用正确的文本对比,他们可以调整其网站上的其他颜色,并进行快速的多个设备/用户测试,以确保文本可读。


网页设计常见的UX错误第4号:滚动劫持

在网络上获得支持的另一个高风险趋势是“滚动劫持”。实现此趋势的网站控制页面滚动(通常使用JavaScript)。当人们遇到它时,他们不再控制页面滚动并且无法预测其行为,这很容易导致混乱和沮丧。这是一个冒险的实验,可能会损害网站的可用性,最糟糕的是,会导致“ 计算机风靡”。


一些网站可以通过滚动劫持逃脱,但这并不意味着每个人都可以。例如,许多网页设计师使用滚动劫持,视差效果和各种产品的高分辨率图像来关注Apple的网站。Apple拥有其目标市场,独特的概念以及其网站的独家内容。由于每个站点都有独特的问题,因此它也必须为这些问题量身定制独特的解决方案


不与真实用户一起测试

借用时尚创意或UI模式时,最好在真实用户身上测试网站原型,以避免UX问题。简单的可用性测试将揭示滚动劫持的实现是否可行。如果不进行测试,设计人员无法知道滚动劫持是否有效,并且做出假设通常代价高昂。


善微科技作为长沙网站建设的优秀服务提供商,已经为上百家企事业单位提供了网站建设、微信/小程序开发、网络营销等服务,优质的服务得到了广大客户的一致认可,如果您有网站建设、微信开发、小程序开发等方面的需求,请致电:400-019-8939,我们会根据您所从事的行业领域和网站类型,在最短的时间内请我们的营销顾问与您预约后上门拜访您,直接面谈交流为您解答所有的网站建设疑问。

我们服务的城市有衡阳网站建设张家界网站建设岳阳网站建设湘潭网站建设常德网站建设益阳网站建设永州网站建设娄底网站建设怀化网站建设郴州网站建设益阳网站建设

如没特殊注明,文章均为善微网络原创,转载请注明来自https://www.sanways.cn/news/572.html