如何快速打造一个有设计感的网站

六. 色调

到这几乎差不多已经完成调整了,但如果你够细心的话会发现按钮以及导航菜单的颜色还是 Bootstrap 默认的蓝色系。在有着设计师存在网站,设计师都会负责进行网站色调的调整,为了保证网站的一致性,所有按钮和导航一般是三到四种颜色(更多可以查看极客公园之间的文章小按钮大学问)。

在这里,虽然不可能像大公司网站那样取色严谨,但还是有一些快速的方法使网站看起来很搭配的。

使用 GIMP 的取色器读取背景图片的主题颜色,确认其 GBR 十六进制值;

使用 Color Scheme Designer确认与差异大但同时又互补的颜色;

最后根据确定的颜色来制定按钮,可以用[Bootstrap Buttons][]等在线直接生成。

这样首页上那个大大的注册按钮就搞定了,接下来是修改导航菜单的颜色,这个比较简单,写入代码 .nav-pills > .active > a, .nav-pills > .active > a:hover {background-color: #FF9473;} 即可。看看咋样。

如何快速打造一个有设计感的网站,PS教程,

结语

如果经历过了上面所说的流程的话,相信你已经可以在比较短的时间内制作出了一个还能拿得出手的网站了。