如何在网页设计中使用绿色

小编:植树节马上就要到来了,植树节让你想一种颜色你想到了哪种呢?绿色,代表着生机和希望。我们可以在保证视觉舒适的同时追求自然,让色彩丰富我们的生活。在网站主页上用绿色元素去突出信息重点是一个不错的选择。

清新、安定、环保,在这三个关键词的遐想画面中一定有绿色。

绿色是一个在网页设计中被广泛运用的颜色,本身就带着一种与生俱来的平静感。绿色在心理学上被认为会产生一定的视觉冲击力,因此,能在网站主页上用绿色元素去突出信息重点是一个不错的选择。

以下是AnyForWeb为大家汇总的比较有代表性的包含绿色成分的网页设计,供大家参考学习。

1.该网站案例很好的证明了绿色独具的引导和提示作用。网站导航的主色对用户的视觉会有很大的影响,亮丽的颜色可能会刺眼;暗淡的颜色有可能太沉闷,因此,温和的深绿色是网站导航色彩的选择之一。

2.Sprout的网站没有没使用大片的绿色,只是在灰度较高的背景上加了一些绿色的装饰来做点缀。但这些元素并不只是美观而已,同时也在无形中指引着我们,反差明显的绿色和黑灰色让用户能轻而易举的分辨出信息重点。

3.Sampex的网站以深绿色为主。深绿色在绿色系中是一种比较正式的颜色,可以在公司的官方网站设计中考虑使用。当亮度和深浅调到让用户有视觉舒适感的时候,同时也会伴随着大气、踏实的心理感受。

4.这个案例中所用到的绿是一个争议不断的颜色,绿色?黄色?大家可能有不一样的观点,在这里暂时称它为柠檬绿。这类相对不够鲜明准确的颜色在网页设计的使用上也应该格外注意,避免与其冲突的颜色,使用单一化的色彩设计,让页面上的内容尽可能的看起来简单清楚和活力。

5.青绿色是绿色系中最具亲和力的颜色,为用户带来一种莫名的洁净和安全感。由于青绿色属于比较亮眼的色彩,因此,该色在使用时应该尤其注意亮度的调节,避免用户在短时间内就产生视觉疲劳。

6.VERDI的网站页面运用了色块“拼接”的效果,从白到灰再到绿色。白色和灰色都是中性色,所以页面中的绿色很自然的成了最抢眼的一部分,这样的搭配方式也让画面更富有运动感。

7.这个案例中的绿色属于较浅的橄榄绿,整体使用了微渐变的效果。色彩的运用让整体显得安宁大方,顺其自然的获得一种视觉愉悦感。

8.在模糊背景上使用亮绿色按钮是在原有的基础上加重了网页的行为召唤力。每一处色彩所在都在暗示,并且指引用户点击和查看。

9.两种不同的绿色之间的相融合也能产生奇妙的视觉感官反应,让用户的视线能有很连贯的过渡,整个页面不会显得突兀。

10.蓝绿色与大地色系之间的搭配更能令人感受到自然的气息。褐色部分使用了纹理背景设计,让画面氛围产生即视的生活感。

绿色,代表着生机和希望。我们可以在保证视觉舒适的同时追求自然,让色彩丰富我们的生活。

AnyForWeb和AnyForWeb UED的官方微博微信现已正式开通,欢迎大家!

站酷

原文作者:尛沫尛沫

(0)

相关推荐

  • 网页设计中几种色彩分析及其之间的搭配

    在网页设计中色彩的运用和搭配是很重要的环节,所以我写了点资料,供大家参考一下! 操作方法 01 一.红色1 分析:红色色感温暖,性格刚烈而外向,是一种对人刺激性很强的颜色.红色容易引起人的注意,也容易 ...

  • 网页设计中的形状法则

    今天的文章简直是网页设计师的福音,满满的干货,感谢@祝小贱带来这么好的教程.文章主要讲的是形状在网页设计中的妙用,运用适当的形状,可以瞬间让你设计的网页提高几个档次,关键文章还很浅显易懂,小编忍不住再 ...

  • 网页设计中的极简风格—无的力量

    小编:首先感谢@飞屋睿UIdesign为我们分享讲解什么是极简设计以及如何做到极简并配上很优秀的图来帮助我们讲解.不久前刚看到一句话来和大家分享下,感觉可以用来提升逼格.这句话是这样写的"U ...

  • 充分利用网页设计中的面包屑

    小编:面包屑导航是网页设计中非常重要的一个组成部分,虽然看起来短小精悍,但它的作用却非同小可.那么你知道面包屑导航都有哪些分类,分别的作用是什么吗?面包屑应该在什么时候使用?什么?你还不知道什么是面包 ...

  • 网页设计中的大事件 – 彩色字体

    小编:今天@Ethan为大家带来一篇关于网页设计中彩色字体的文章,主要介绍了什么是彩色字体以及注意事项和如何创作.感兴趣的小伙伴可以试着自己创作一下,完成后别忘记晒出来呦. 那么什么是彩色字体?这是一 ...

  • 【海平面】在网页设计中,如何应用纹理?

    当提到网页设计,纹理的应用是未来的趋势.极简主义的方式已经一去不复返了--我们想要纹理那种令人快乐的"小零碎"呈现在我们的网页上,现在就想要它! 纹理是一种简单而有效的方式,可以为 ...

  • 巧用格式塔原则处理网页设计中的正负空间

    本文中,我们讨论了关于网页正负空间的格式塔原则.文章虽然有点长但讲解详细,希望能对你有所帮助. 备注:翻译过程中为了适合我们的阅读习惯,有对原文进行一定的内容简化和语义修饰,如有不妥欢迎大家根据官网链 ...

  • 网页设计中文字排版设计的技巧

    谈到到网页设计中的排版,这是可个大学问.网站上每一个元素都能影响浏览,排版设计的好与坏绝对能考验一个设计师的基本功底,而短短的一篇文章并不能将排版介绍清楚,本文就先主要分享网站主题部分文字的排版,后期 ...

  • dw(网页设计)中怎样让段落首行自动缩进

    dreamweaver网页设计中为了让页面更加好看,有时候会给段落添加一些样式,让段落可以 自动首行缩进两个字符,今天我就来讲讲dw怎样实现 首行缩进这个功能. 操作方法 01 第一步,打开软件,新建 ...