购买
下载掌阅APP,畅读海量书库
立即打开
畅读海量书库
扫码下载掌阅APP

3.4 常见问题

网页及网站的色彩搭配是初学者最头疼的问题之一。一般来说,下面几个问题是最经常遇到的。

3.4.1 如何快速掌握网页的色彩搭配

由于人们对于色彩美感的认识存在着共同性,因此对于网页色彩的搭配也有一些技巧可以充分利用。下面介绍几种容易上手的技巧。

1.先确定主色彩,再衍生出其他色彩

前面已经介绍过,任何一个设计良好的网页都会有一个主色彩,这样才不会使浏览者眼花缭乱。作为设计者,可以先根据实际情况选择好一种基本色彩。然后调整该色彩的透明度或者饱和度,在此基础上衍生出其他的色彩。例如,在RGB模式下的颜色,当R取值为54、G取值为126、B取值为194时的颜色如图3-13所示。

当调整颜色的饱和度,使R、G、B分别取值为104、137、182时,颜色效果如图3-14所示。如果调整饱和度,也可以得到某些比较协调的颜色。图3-15显示的是把图3-13中的颜色的不透明度调整为63%时的效果,而图3-16显示的是将不透明度调整为40%时的效果。

图3-13 R取值为54、G取值为126、B取值为194时的颜色

图3-14 调整色彩饱和度产生其他颜色

图3-15 不透明度为63%时的效果

图3-16 不透明度为40%时的效果

2.先确定主色彩,再使用其互补色

这种方法也比较简单,用户根据实际情况选择一种颜色,然后再获得该颜色的互补色。利用这两种颜色作为主要的颜色来进行网页配色。在网页设计中,在适当的位置恰当地运用互补色,不仅能加强色彩的对比,拉开距离感,而且能表现出特殊的视觉对比与平衡效果。例如,如果选择如图3-17所示的颜色作为基本色,则其互补色如图3-18所示。

图3-17 选择基本色

图3-18 获得互补色

获得互补色有个技巧,在Photoshop中首先使用基本色填充画布,然后按Ctrl+I快捷键,即可获得其互补色。

3.4.2 如何获得某个网页的基本色的RGB值

获得某个网页基本色的RGB值可以使用Photoshop来实现。例如,想要取得新浪网首页的基本色的颜色值,可以按照以下步骤来操作。

step 1 在浏览器中打开新浪网的首页,按PrtSc键进行屏幕抓取。

step 2 打开Photoshop,选择“文件”→“新建”命令,新建一个空白文档。按Ctrl+V组合键,将抓取的屏幕图粘贴到画布中。

step 3 单击工具箱底部的前景色面板,弹出“拾色器(前景色)”对话框,如图3-19所示。

图3-19 拾色器(前景色)对话框

step 4 在抓取的图片上面单击网页的基本色,此时,在“拾色器(前景色)”对话框中的颜色面板中的颜色也在随之变化,从对话框中可以得到基本色的RGB值。

除了使用Photoshop之外,还有其他的一些小工具可以取得基本色的颜色值,在此不再详细介绍。 3kbu2GpCrT61CQZ8BABchU9WtHJBXy63yEIbwUMYKbyEKRck/2ig1R+E3z0o9D19

点击中间区域
呼出菜单
上一章
目录
下一章
×