1. 论坛系统升级为Xenforo,欢迎大家测试!
    排除公告

高品质网页banner设计细节处理技巧

本帖由 阿繆2017-09-18 发布。版面名称:图形设计

  1. 阿繆

    阿繆 New Member

    注册:
    2016-05-31
    帖子:
    25
    赞:
    0
    网页banner,网站展示首图,用户进入网站映入眼帘的页面设计视觉。可以说,一个优秀的网站banner图,可以提升整个网站的品质感和档次。那么设计一个优秀的网页banner图,设计是需清楚那几个要点。
    主题明确
    首先我们设计一张图是,应清楚这张设计的用途。让用户一眼就能知道一张图传达出那些信息。所以小编建议在设计整个框架时,尽量减少过多的辅助干扰元素,banner切割的太细碎,内容繁多,就会分散用户的注意力。
    突出重点文字
    用最醒目的字眼图片内容的核心,让用户可以最快的获取的其中的信息,如下图,主题信息和价格做的不明显,让用户阅读的很吃力。“5折”字样一定要大,要醒目,其余的则需要相应的弱化。
    [​IMG]

    正确的排布方式应该像下面这样:
    [​IMG]

    符合用户阅读习惯
    这点主要要注意整个版面的排版,按用户的阅读习惯出发,从左至右,从上到下。如下图:
    [​IMG]

    颜色不要过于刺激
    有些客户会要求用比较夸张的色彩来吸引访问者的眼球,希望由此提升banner的关注度,实际上,亮色谁能吸引眼球,但往往会让产用户产生视觉疲劳,从而丢失用户。
    [​IMG]

    上图的颜色选可能过于鲜艳了,看久了眼睛会疲劳。而下图的颜色稳重、纯净,让人看了很舒服:
    [​IMG]

    产品数量不宜过多
    “多”并不等于富,不等于好;适量即可。整个banner的显示尺寸非常有限,摆放太多产品,反而会让画面拥堵、不透气,视觉效果大打折扣。
    [​IMG]

    留白
    留白是设计的一门学问,留白的方式大小都会影响画面的整体效果。正确而适当的留白不仅能够保持良好的阅读率,更能很大程度上的提升画面的气愤和品质。
    [​IMG]

    平衡信息和视觉元素
    当所要表达过度是,如何平衡好信息与元素、元素与元素之间的画面?如何在有限的尺寸里尽可能的完美呢?
    大家可以对比上面两张图,就能够体会到平衡了:
    [​IMG]

    [​IMG]

    一张优秀的网站banner设计可以激发用户的点击欲望,优秀banner的设计同时也是对客户的一种尊重,用户在选择时,潜意识里会认可你。
    原文链接出处:广州网页设计http://www.ewpv.com/news_text.asp?ID=1243