设计文章 | 文章资讯
  • 676

    浏览
    原创
    网页设计 WUI
     
    标签释义【】
    加载中...
    网页设计师点赞超高高高的9种技巧,这才是WUI设计的最高级

    67600

    声明:图片来源互联网

    仅做赏析学习

    版权归属原作者

     

    1、保存背景干净

    背景的选择本身会让你的网页设计效果更加出色,值得注意的是,当你的背景需要承载大量文字时,如果背景含有图片,那么文字就会显得很模糊不清,进而导致阅读困难,这时可以考虑尝试用单色背景搭配明度相差较大的一些字体,突出对比,让内容更容易传达!

     

     

     

     

    2、一致性

    这是个老生常谈的问题了,但在实际项目中,你需要考虑更多保持一致性的方法,那比如一个控件元素在页面右上角,那么我们希望在所有的页面中这个元素都应在同一位置,形成品牌效应,减少用户的一个学习成本。除了元素位置一致性以外,我们还应让色彩、字体、间距都应保持一致性。

     

     

    但得灵活运用,比如所有的图片尺寸都一样,所有的文本都一样大小,所有的按钮都一样的样式,这样的“一致”看起来不错,但是实际上会显得更加无聊。

     

    网页中的许多元素可以一致,但是不能完全一样,这是两个概念。基于不同的需求,不同的位置的按钮尺寸是不能完全一样的,但是它们可以沿用相同的样式,并且设计几个相对固定的尺寸比例,这样也可以更好的控制整个视觉和体验。

     

     

     

     

    3、留白

    所谓的留白不是说将画面留出大量的空间,或者说是白色的页面,留白其实讲的是一种版式排版,被广泛应用于各大艺术行业,我们时常用个口诀总结留白“疏可走马,密不透风”,留白是版面里面的一种意境,一种呼吸空间...

     

    3.1标题与段落之间空间

     

    3.2保持段落大小,段落之间要留有一定空间

     

    3.3元素之间要留有一定空间

     

     

     

    4、慎用下划线

    在网站发展的过程中,许多特有的符号或者标识是为了标明含义,比如我们常见的下划线,在平面设计作品中,由于画面不可交互,下划线本身就可以起到很好的强调作用。

    在网页设计中,多数人觉得带有下划线的文字就是链接,所以轻易不要在文字中使用下划线进行装饰.

     

     

     

     

     

    5、注意居中对齐

    对于少量文字或者重点信息时候可使用居中对齐,但是居中对齐本身没有很明显的对齐线,如果你在大量文字排版时使用居中对齐的话,则会导致内容看起来更加混乱,难以阅读,每次视线都不能回到一个固定的位置,会造成很糟糕的用户体验。

     

     

    6、图

    在网页设计里面图起到很重要的作用,可以说一图胜千言!因为网页除了文字便是图了,那么常用的一些图包含图片、图标、图形符号、图标等。这里我们选图时候要注意图文结合必须要和文章相互一致,从产品到封面图都要形成品牌效应!

     

     

     

     

    7、拆分文字墙

    这里所说的墙就是一个屏障,在网页中大量文字在不考虑识别的情况下,一眼看上去就是一面文字的墙,这样做的目的也是为了增强阅读性。所以用短小的段落或者项目列表形式来呈现内容,同时通过合理的配图进行拆分阅读,从而让读者视线中面对信息减少,提升整体阅读体验。

     

     

     

     

     

    8、布局

    在网页设计中或者内容呈现中,无论你的关键信息是什么,请把内容放在最前面,或者将最精美的图片放置在相册最前面,这样做的目的是可以有效的传递有关键信息,或者说将最核心的最吸引的内容进行重点呈现。从而让用户得到核心内容,抓住用户注意力。

     

     

     

     

    9、慎用反显设计

    无论将位于深色背景中的浅色文字的设计通常称为反显文字,而且在实际的使用中大部分用户都会感觉反显文字难以阅读,尤其是含有大量文字的内容情况下,所以在网站的主要内容区域尽量不要用反显文字!

     

     

     

     

     

    页面赏析

    Appreciate

     

    注册页面

     

    倒计时页面

     

    支付页面

     

    着陆页面

    相关原创文章

    iOS设计尺寸规范

    Android设计尺寸规范

    小程序设计规范

    平面设计基础常识汇总

    Web UI 网页设计规范

    令人惊叹的网页设计长什么样?

    超赞的27个高质量免费图片网站

    120G顶级C4D教程强势来袭

    你和大神之间只差一份高级进阶教程

    iPhone X 人机交互指南及其设计细节

    一款APP从设计到切图标注适配全记录

    2018年网页设计的19个趋势!

    21世纪最强设计配色方法

    7种UI设计趋势超流行

    8大史诗级海报设计技巧

    WUI | 极简网页界面设计

    10招教你玩转波普风

    2018现役最全的14种平面设计风格

    设计报价 | 一个LOGO该如何报价?

    珍藏版 | 为什么摄影师都喜欢前景构图?

    10个让人上瘾的设计神器

     

    关键词回复:

     

    软件下载 、UI学习 、面试技巧、Banner,样机下载

    LOGO、C4D教程,名片,包装,字体下载

    设计规范,创意合成,作品集模板

    (可见相对应知识文章)

     

    作者:马保国

    本文由 @马保国 原创发布于云琥在线。未经许可,禁止转载

分享:
你还没有登录,请先登录注册

  • 还没有回复,赶快添加一个吧!

马保国

不讲武德

100粉丝 | 1关注

关注
同学的热门标签
加入讨论圈子
免费试学
平面/UI/电商/室内
/运营/短视频任选
意见反馈
公众号
微信扫一扫
关注天琥公众号