干货!简化和改善网站UI设计的7个技巧

干货!简化和改善网站UI设计的7个技巧,

你对自己的网站当下的UI设计效果满足吗?若是不知道若何改善的话,那么这篇文章或许对你有很大的辅助。

据统计,成年人平均天天在手机上破费3到4个小时。只管人人不懂若何确立APP或网站,但却能显著感知一个产物设计的利害。这可以很显著的映在产物使用时间上,而且很大水平可以归结为直观的用户体验和可能被忽视的UI界面。

现在,UI设计是确立网站或应用程序用户信托的主要组成部门。优异的UI设计,带有清晰、熟悉的图标,一致的调色板,尺寸巨细,可以让用户快速、轻松地浏览页面内容。

修改现有的网站或应用程序设计可能会面临许多障碍,但你完全可以做一些小事情,让UI设计到达一个新的水平。无论是在你的图形、调色板、网站导航工具、图标、字体巨细和间距上,你的UI设计总有需要改善的地方。

在本文中,站长之家将跟人人分享7种简朴的方式,让你的应用程序和网站UI设计经由简朴的调整之后,在视觉上更吸引力。

字体的使用要制止

使用的字体并不是越多越好,最好只使用一种字体。我们建议使用无衬线字体,如Helvetica。由于它更易于阅读,而且在小屏幕和大屏幕上的展示都对照优越。

通常可以在差别位置举行调整。例如,题目(H1)可以是粗体,或者接纳比通例文本(p)更粗的字体,而通例文本则接纳通俗字体,也以实验用颜色来区分和确立条理。

固然,你还可以在设计中使用两种字体(一种用于题目,一种用于其他文本,好比段落,题目等等)。我们很少在设计中看到两种以上的字体,但泛起这种情形时,是有一定缘故原由的。

好比下图中,使用字体过多,导致页面观感杂乱。

干货!简化和改善网站UI设计的7个技巧

内容的可读性

若是页面上的文字和背景图片在颜色上过于相似,那就无法突出文字内容。效果就是不利于用户阅读,要么就是快速浏览,要么爽性跳过这部门内容。

干货!简化和改善网站UI设计的7个技巧

而这个问题很容易解决。首先,在图片上添加一个覆盖层,凭据字体颜色,调整背景图片的明亮水平,也可以通过调整图像的透明度来到达类似的效果。实现这一点的另一种方式是在文本周围添加阴影。

检查内容的对齐方式

在决议若何阅读内容时,,对齐起着至关主要的作用。人人很少会看到长花样文本居中或向右对齐,博客类或长文本内容更是如此。统一将文本左对齐是一个对照稳妥的做法,而不是选择居中方式。

干货!简化和改善网站UI设计的7个技巧

请注意,在某些情形下,居中文本仍然是合适的。一些例子包罗小题目或段落,引用等等。

颜色使用需郑重

虽然颜色在传递信息方面异常有用,但要郑重使用,而且只在你试图转达内容中最主要的部门时使用。

例如,对于一篇博客文章,你不会将所有文本都设置为亮绿色。颜色对于界说设计层级是异常主要的,好比可以降低不太主要的文本的饱和度,从而突出想要抓取眼球的内容。

干货!简化和改善网站UI设计的7个技巧

最后,我们建议设计之前,要保持颜色的一致性和界说调色板。颜色的组合有数百万种,你可以花几个小时来测试哪种灰色对照悦目,或者哪种紫色对照适合你的设计页面。虽然这可能很耗时,但值得去实验,若有需要的话,就作出改变。

有心栽花花不开,无心插柳柳成荫。这是不是很多内容创作者心中的痛?有时觉得内容不错,但没想到发布后毫无水花;有时随便发发的内容本不抱有期待,却迎来了超乎寻常的反馈。B站UP主,视频流量,短视频运营

留白跟内容是一样主要的

留白对于内容的可读性异常主要。过于群集的文本和图片会让用户感应不适,而过多的空缺会导致读者需要过多的转动,从而在无法快速浏览并发生挫折感。

干货!简化和改善网站UI设计的7个技巧

要给内容足够的呼吸空间。在页面公布之前,请确保在差别的装备上测试留白,以确保可读性。

对于大多数字体来说,1.5到1.625的行高是一个对照稳妥的选择。

设计模式要为品牌标识起弥补作用

在界面确立一个全新的点击或转动模式是不需要的,通常不会给用户留下深刻印象。

干货!简化和改善网站UI设计的7个技巧

应该使用用户熟悉的模式,例如在网站顶部添加导航栏(在大多数网站上都能看到),而不是在底部列出网站的功效,让用户需要转动才气找到这些功效。

设计保持一致性

应该保证你的设计在所有渠道都保持一致性——包罗网页,应用程序,移动端,社交媒体账号等等。

干货!简化和改善网站UI设计的7个技巧

当用户接见你的网站或查看社交媒体资料时,应该给他们一致的熟悉感。只管保持颜色和字体的一致性,这会让受众更好地遐想到你的产物和品牌。也可以确保用户在点击你的网站时不会感应疑心。

总而言之,在UI设计方面,可以经常问自己这些问题:

  • 用了若干种字体?

  • (若是跨越一种字体)是否可以简化网站,或者在页面上限制字体效果更好?

  • 图片上的文字是否易于阅读?可以在差别的装备上读取吗?若是谜底是否认的,那么给图像添加一个覆盖层。

  • 网站的哪些部门居中?把它移到左边是不是更悦目?(要注意的是,要凭据装备调整对齐方式。好比在手机端上居中效果可能对照好,但在较大的显示器上左对齐可能对照好。)

  • 用了若干种颜色?一个个实验使用更多或削减颜色,并实验限制彩色文本的使用。

  • 段落和图片距离空间是否合理?实验增添或削减留白的数目,以改善原有的设计。

  • 所有的页面或帖子都有相同的导航吗?只管让转动和单击模式在整个面板上保持一致。

  • 所有的页面设计是一致的吗?若是不是,试着保持所有页面的颜色和结构一致。

以上就是改善UI设计七个要点,希望对你能有所辅助。

注文章由站长之家编译自medium,点击这里查看英文原文。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 2895593579@qq.com 举报,一经查实,本站将立刻删除。