有时候,一种网站设计趋势的出现,让人简直想抓狂。这就是其中之一——一个漂亮的设计,但实际上文字几乎无法阅读。

当然,这可能有点夸张,因为在大多数情况下,你还是可以猜出文字的意思。但用户必须思考,只不过人们会停留下来去理解这个设计吗?

让我们来看看几个不同的例子,展示设计中“忽略”可读性的方式。

示例 1:模糊的文本元素

其中一种常见的可读性与设计技巧是使用其他元素(如照片或动画对象)来遮挡文字。

如果做得好,你可以创建图层,而不会延迟阅读屏幕上的文字。通常情况下,这是真实的,因为遮挡是很小的。但是越来越多的设计侵占了文字元素,以至于你可以弄清楚这些词,但需要额外的几秒钟来思考和理解。

考虑到人们的注意力持续时间如同金鱼,这是一个明智的设计选择吗?

这里的另一个挑战是响应能力。在不同的屏幕尺寸上,更多的字母可能被遮挡,更加影响可读性。

在上面的例子中,文字在两个位置被遮挡:冲浪者的头部遮挡了“track”中的一个A,而App Store标志侵入了文字的底部一行。

示例 2:文本覆盖文本

几乎没有什么比文字叠加在文字上更难阅读的了。那么,为什么设计师还要这样做呢?

上面的例子可能提供了一个答案:尽管存在可读性问题,但这看起来相当不错。简单的背景配上一块大大的黄色文字,再加上一个小小的橙红色圆圈,视觉上很有趣,吸引人眼球。

只有在此之后,你才开始思考由于颜色对比度和层叠的文字而带来的可读性挑战。甚至在屏幕顶部的小小“2022”也会在滚动时叠加在文字元素之上。如果你试图专注于文字,这在视觉上需要花费很多精力来消化。

示例 3:快速运动

有时有些单词你只是觉得不适合阅读。

当单词与快速动作相结合时。每个文本元素一闪而过时,阅读它的机会很小。这种情况在有大量视频工作的投资组合网站上经常发生。

在上面的例子中,动作非常快,但有一些片段你可能想停下来阅读。对于那些想停下来仔细看看屏幕上的一些项目的人来说,视频上的暂停按钮可能很好。(就网站的可访问性而言,这也不是一个坏因素。)

示例4:不规则方向

这是一种设计趋势,你在印刷项目中看到的比网站更多,但开始更多地出现在数字空间中——文本元素的奇怪方向。(除了标准的从左到右、从上到下的阅读体验。)

优点是,这肯定会引起你的注意,如果单词很短——比如上面的例子——可读性就不会牺牲那么多。

这种技术的问题总是“为什么?”方向的改变对设计有什么额外的作用吗?还是只会妨碍设计?是否为用户创造了更大的理解或意义?

当你创建一个可读性有问题的设计时,这些都是很好的问题。

示例5:多层

当你看上面的例子时,你可能会看到我们已经提到的一些可读性问题被囊括至一个项目中——文本覆盖文本和模糊的字母。还有一个动画具有在阅读领域移动的液体效果。

在这个例子中,所有这些都发生在屏幕的前三分之一,而其他部分则相当裸露。

它对你有用吗?

这个设计带来了一个令人遗憾的阅读挑战,可能比其他一些例子需要更长的时间来理解单词,因为你必须阅读一个名字,并在动画过时的瞬间思考它。

另一方面,这个设计看起来很酷。但这足以让你坚持长时间阅读来解决问题吗?

示例6:实验字体

实验排版可以是展示品牌或为设计项目创造氛围的一种奇妙而时髦的方式。但有时这些字体读起来有点困难。

诀窍是将它们与易读的选项配对,这样用户一次只需专注于一件事。

在上面的例子中,使用了两组更时髦的字体,这给可读性带来了挑战。但这种设计的真正挑战是实验字体背后闪烁的背景。阅读可能非常容易,字体周围的活动更少。

示例7:对比度挑战

对网络上的文本最大的关注之一是可读性的对比度。具有突出背景的文本颜色和风格对于清晰简洁的阅读至关重要。(这也是网站可访问性的一个关键因素。)

通常,设计师将文本和背景元素分层,因为对比度会影响可读性。当文本在背景元素上分层或部分分层时,这种情况最为常见,因为背景元素中的颜色不同。

在许多情况下,例如上面的例子,文本在一个背景上可读,然后在另一个背景下不可读。你假设用户会坚持这些更改,这样他们就可以阅读单词了。

总结

在规划一个新的设计项目时,可读性对你来说有多重要?你能试试这里的设计方案吗?

这当然是一个真正的风险,但每一种网站设计趋势都有利弊。

精选文章:

2023年家居趋势全揭秘 | 13大主要潮流亮点

设计师过30岁必觉醒的中华血脉,居然都藏在博物馆显眼包里了!

环保与美学的完美融合,户外设计的最新趋势是可持续性

nendo与精灵宝可梦合作,把皮卡丘马赛克了,还做成了杯子?

智慧背后的救赎:iMac如何改写了苹果的命运?