一、利用颜色衬托图像与笔墨

有时候你不得不处理一些蹩脚的图像。
通过半透明的颜色上衬托你要表达的工具,让它们更像背景纹理而不是紧张焦点元素。
这将为你供应必要的比拟,使叠加的文本可读。
不才面的示例中,我对文本运用了深蓝色阴影以进一步提高比拟度。

二、不要过度利用负空间

负空间,也叫负形。
是指除表达主体本身所占用的画面空间之外的留白部分。
而所谓的负空间Logo,则是指的是利用分外的表现技法让主体之外的空间也展示内容从而创造出的形状简洁却可以表达繁芜内容的Logo。

html页面切换效果用户体验设计13 个晋升页面转化的技能 jQuery

产品设计师每每喜好负空间。
但是,当属于一起的元素之间存在过多的负空间时,眼睛就会变得断断续续,陷入空洞,而不是轻易地在连接的元素上流动。

三、没有人喜好废话

任何剖析过网页数据的人都知道,你只有很少的韶光来吸引用户的把稳力。
比方下面的例子:

四、纵然是纯文本布局也该当具有视觉吸引力

页面的纯文本部分可能很难设计,特殊是如果你没有机会利用插图、图像,那么你的品牌颜色和一些大略线条也是提高设计质量的利器。

五、图标小,插图大

图标很生动,但他们该当摆清自己的位置。
如果把它们做得很大,你的插图就会很糟糕。
如果利用带有标题的图标,那么就优先凸显标题。

六、谨慎利用字母间距

我们可以通过多种办法利用字母间距来奥妙地改进排版,但如果你不是履历丰富的排版师,请坚持在大写字母中添加字母间距,而不是在句子大小写文本中添加额外的字母间距,这会会产生可读性问题,并且会毁坏字体设计的自然节奏。

七、掌握好你的段落行长

很多文本不可读的第一大罪魁罪魁可能是行长问题。
标准行长该当不超过笔墨展示区域的三分之二。

八、彰显代价

不才面例子中,真正的代价主见隐蔽在一个险些不可读的字幕中。
通过添加真实用户的头像,就可以证明社交的可信性。

九、没有人喜好小文本

下面的例子中,CSS 中利用了可变的网页排版,创建了正文为 11 像素,导航链接为 9 像素的场景。
浏览器默认的 16px 字体大小现在已有 20 年历史了——一定要学会利用为当代屏幕设计的字体, 18-20px 是个可考虑的选择。

十、奇数技巧

布局可考试测验包含更多的奇数元素。
如果你有 4 个元素,试着把个中的 2 个元素结合在一起。
如果不好做,就优先考虑你最想表达的不雅观点并减少最弱的那个。

十一、管理认知超负荷

在可能的情形下结合并减少你要表达的东西。
在标题和副本之间创建大小比拟以改进视觉层次,并在你有很多话要说时利用负空间来创造更沉着的体验。

十二、利用通亮的颜色作为强调

大面积利用通亮的颜色会让你碰着比拟度问题,可能无法知足基本的文本可访问性哀求。
在较小的元素,如按钮,就须要避免白色文本。

十三、常常检讨灰色文本的比拟度

‍利用灰色文本是在文本元素之间创建层次构造的一种盛行方法。
但这每每会导致严重的易访问性问题,由于文本缺少足够的比拟度。
利用在线工具检讨比拟度,如果你须要建立一个更清晰的视觉层次构造,可以增加字体大小的比拟度。

以上是关于优化页面转化的13个技巧,希望你能加以对照并开始动手优化你的产品体验。

本文由@"大众号:真的不一定 原创发布于大家都是产品经理。
未经容许,禁止转载

题图来自Unsplash,基于CC0协议