建站学习网,专业提供各类建站教程,网页素材,SEO资讯等建站资源!

网站模板_网站源码_网站素材_建站教程_建站学习网

当前位置:建站学习网 > 网页设计 > 交互设计教程 >

5个帮你瞬间提高网页对比度的小技巧!

更新时间:2017-04-14整理编辑:建站学习网阅读:0

   缺乏对比度是一个非常常见的问题,而且往往易于补救。当你听到客户对你咆哮着“不够完美!“的时候,他们真正想说的是,他们希望看到的是更多对比的设计元素。今天这篇好文总结了5个简单实用好上手的技巧,来收!

  你的的设计项目是否总觉得看起来不是那么出众,这很有可能是因为缺少足够的对比度。对比度的主要作用就是提高要素之间的差异化,使得每个设计看起来更加独立,突出和特别。

  有很多方式可以创建设计对比度,包括使用各种不同类型的元素,从印刷到色彩调整等。创建对比度非常重要,它可以使一个设计完成从平凡到令人惊艳的蜕变。如果你还不知道该怎么办,那下面的五个建议或许可以帮到你

  1. 做得更大(或者更小)

  过多的同等重量的元素会显得相同。最简单的办法是让一个元素显著更大或更小。

  这个不同的项目会变成眼前的焦点,用户将被吸引到画布的该区域,因为它是不同的。

  制作一个元素时,照片或文本块大或变小不仅仅是在它的物理尺寸上,更重要的是它的视觉重量。理解这一点最简单的方法是排版。看看上面的图片。这两个词都是一样的“大小“,但是感觉就大不一样。这种反差的原因是相对于厚的字母,薄的字母在页面底端。

  你可以把这个相同的概念延伸到别处,你会发现几乎任何其他设计元素也是如此。

  看上面这个网站上的小传单。在页面和按钮在屏幕的底部,顶部要特别注意的基于文本的导航。为什么其中的文字吸引你的眼睛更快?为什么所有类型的是相同的大小,但内部的五颜六色的相片框却能使它看起来更大更醒目。

  2. 添加纹理

  虽然现在平板化和迷你风格作为设计趋势的主流,纹理不再像之前那样常用,。但你仍然可以在很多地方看到它,有时候你甚至没有思考为什么它会存在。

  从平面元素改变到任何与一个纹理,图案或三维样式将有助于创造聚焦。加入纹理背景可能是最直接的解决方案,或者说相同条件下,添加纹理比其他方案来得更快更好。

  考虑与文本元素质感相同的纹理,这在许多复古排版风格中很流行。主要类型的纹理质感包括粗糙和光滑。他们可以相互合作区提高设计的对比度,以此创造视觉焦点。

 

  3. 改变形状

  看看上面的图片。你看到的第一个是什麽?对我来说这是里面那个有问号的圆形物体。

  你知道为什么吗?在一个充满矩形的形象中,它是唯一的圆形。跟其他对象的区别使得它脱颖而出。颠倒字符这一安排也是它引人注目的原因之一。改变一个元素的形状或取向可以增加最直接的影响。

  下一次如果你的设计感觉有点平淡,你也可以尝试这种方法。钝化照片的边缘,把元素放置在一个圆形框架中,而不是矩形。选择一个垂直的照片。

  所有这些改变尝试可能让你在第一次有点不习惯。但请坚持尝试,当你做的时间久了,你就会摸索出一些有趣的经验了。

  4. 添加色彩(或者直接扔掉)

  

  色彩是在处理设计时需要考虑的重要要素。通过改变色调,或者添加删除颜色,你可以改变一个设计的整体情绪。颜色可以使事物出现或大或小,或深或浅,诀窍在于对比运用调色板。

  对比度的最简单的形式是色盘,配对的颜色沿着轮形成不同的反衬组合:

  互补:从色盘的相对侧高强度对比

  三元:颜色隔开沿轮三分之一增量

  拆分互补:在一种颜色旁边的两个颜色就是它的互补色。

  这个色板非常管用,如果你已经有了一个调色板,就不用担心做细微的调整,或者怎么样选择对比的颜色了。

  把温暖,凉爽的颜色和中性色调混合。 通过添加色度和色调,改变颜色的饱和度,使颜色和基色相区别。 综合管理亮的颜色与暗的颜色,就像把它分成阴阳一样看待。 添加没有颜色的元素。黑色或白色的元素可以是很多不同色系的添加重点, 它们和许多其他基色都能产生对比。

  5. 添加不同

  适量的添加出人意料的的形状和细节会带来意想不到的惊喜。在设计中,一个惊喜是什么?它可以是任何要素,这个要素或许与其他元素并不十分匹配,但仍能与整体和谐相处。

  这些要素包括:

  一个与已有元素对称的新元素。

  一个引导你完成设计的视觉提示,比如强烈视觉冲击的形状或视觉追踪模式比如上图中在网站设计中的应用,它们使网站看起来充满活力。

  如平面构成中的变异,在多个重复元素中一个变异的元素。

  更改元素或文本的排序,如上图中,在单词Anima的变化(用字母“I“)。

  改变在视觉上一个行的定位或一个元件的尺寸。 不同风格的影像,如把照片更改为插图或动画的提示。

  混合复杂又简单的视觉效果或排版样式。

  结论

  提高元素之间的对比度的好处是,它可以提高一个设计项目的直接影响。通过改变元素的外观,你可以改变视觉的焦点,并帮助用户提炼出最重要的一部分消息。

  缺乏对比度是一个非常常见的问题,而且往往易于补救。当你听到客户对你咆哮着“不够完美!“的时候,他们真正想说的是,他们希望看到的是更多对比的设计元素。现在你的挑战就是运用你手边的工具去完成这一转变。

本文网址:https://www.dedexuexi.com/wysj/jhsj/2924.html

本站部分文章搜集与网络,如有侵权请联系本站,转载请说明出处。

收藏此文 赞一下!() 打赏本站

如本文对您有帮助,就请建站学习网抽根烟吧!

支付宝打赏
微信打赏
请谨慎对待程序的图标和名称
« 上一篇2017年04月13日
一组能切实提高转化率的网站着陆页设计
2017年04月13日下一篇 »
  • 网易云音乐WP1.0设计项目实战
    0阅读
    WP 平台是很多设计师很少涉足的地方,优设之前发过一篇WP设计规范指南,今天网易的同学继续上干货,来一篇WP的设计项目实战!作为一款有诚意的音乐APP,这次设计过程相当用心,值得学习的地方也很多,学习来。项目背景Windows Phone一直是各家公司缺少投入的平台,WP用户不得不经常面对一个成...
  • 马伯庸教你如何做一个万年好甲方
    0阅读
    编者按:原以为亲王精通历史,会写小说,现在才知道他也很懂作为甲方的门道啊。今天分享@马伯庸 同学的一篇好文,前有笑点,后有干货,有趣得紧。作为设计师,能遇到这样的甲方就嫁了吧。@马伯庸 :对我们甲方来说,艺术性是第三才需要考虑的因素。我们第二考虑的是如何有效率地把核心信息传达到客户那儿去。无论多么...
  • 网站设计主题和风格是重点
    0阅读
    企业为了在互联网上争夺一席之地,纷纷建起了网站。企业的网站就像企业的网络门户,既然是门面那么就要将网站建设好,充分展现企业的良好形象。貌似许多企业建网站是为了赶时髦,因为他们的企业网站设计的实在是不堪入目,这样不仅不会为企业带来什么利益,相反还会毁了企业的形象。那么企业要建好这样的门面应该如何入手呢...
  • 如何给网站布置干净的“关于我们”页面
    0阅读
    所有网站,无论是官方、电子商务、社会化网络还是个人站点,都应该设计一个恰到好处的关于页面,直截了当地告诉到访者,为什么要浪费他们宝贵的时间浏览你的网站。 一、为什么要有关于页面 不要让用户思考! 1、向浏览者传达本站的价值,留住用户 2、始终提醒自己站点的主旨,不要跑题 二、起什么名 关于页面存在的...
  • 如何建立一个成功的移动应用
    0阅读
    一个消费者应用程序是否成功,只通过相加其组成部分的总和来计算。简单的查看用户手机应用的下载历史,用户设备残留的移动应用数量,和那些真的被坚持使用的移动应用情况,就能知道这句话的真实含义。然而,如果你想知道为什么有些用户不再使用某些手机应用,那这篇文章可能会给你一些启示。 像一台机器一样,移动应用通过...
 
QQ在线咨询