服务与支持 |咨询热线 0931-8733767
  • 金城在线
  • 公司简介
  • 发展历程
  • 企业文化
  • 售后服务
  • 工作机会
  • 联系我们

网页设计配色方法

来源:发布时间:2017-10-31 9:13:38

        当我们了解了色彩的基本理论和各种色彩的心理学特征之后,就要考虑如何在网页设计中合理的进行配色了,从互联网上成功的网页配色案例我们能够注意到,成功的网页配色遵循一定的规律,只有坚持科学理性的方法,才能够获得好的页面效果。

        (一)详细的市场调研与分析

        通过调研,明确网站的主题、服务的对象以及色彩所表达的目的。“目标用户是指接受并理解网站建设方通过网络媒介传递的信息的个体。网站是为了目标用户(受众)而存在的,否则就没有建设的意义。没有以目标用户作为参照所设计出的网站,只能是失败的作品。”

        4为产品做广告之前我们需要市场调研,这个已被大家所熟知,但提起网页设计的市场调研,真正执行的并不多。实际上,网页设计同样需要详尽的市场调研与分析,来进行准确的市场定位,明确目标受众的年龄层次、个人喜好等等。所以当我们想决定一个网站配色的时候,我们就要弄清楚网站的主题和网站的主要的浏览对象,这样才能在配色上,配合网站的主题同时迎合浏览者的胃口。当然,考虑色彩所表达的目的也是极为必要的,上文已经提到过,每一种颜色都有其特定的心理学特征,如果你不遵循这一规律,必然会影响页面的效果。譬如一个糕点类的商品的宣传页面,如果使用了蓝色为主色调的配色,就会压抑浏览者的食欲,同时也无法凸显出商品的特征。

        (二)确定网页页面的主色调

        做完了市场调研与分析,明确网站的主题、服务的对象以及色彩所表达的目的之后,就可以为网页的页面来确定一个主色调。主色调的选择是根据网站的主题和服务的对象来选定的,比如电子产品类的网站,我们可以选择黑色作为主色调,凸显科技感与现代感;比如女性化妆品的网站,我们可以选择粉红色作为主色调,增加页面对女性浏览者的吸引力和亲和力。对于某些企业网站来说,使用公司视觉识别系统中的标准色作为网站的主色调也是常用的做法,这样做可以更符合公司的形象战略,同时也能够提升公司的整体形象。

        (三)辅助色彩的选择与搭配

        当网页的主色调确定下来之后,就应当根据主色调来选择一到两种辅助色彩,但颜色不宜过多,否则页面很容易变得杂乱不堪。如果页面的整体颜色同属于一种色相,那么辅助色彩的颜色只需要在主色调的明度和纯度上进行调整,或者搭配中性色,这样有助于保持页面的整体风格的统一。当辅助色确定不和主色调为同一色相时,我们可以选择对比色或者补色来当做网页的辅助色彩,这样可以带来较为强烈的视觉效果,同时也可以凸显页面中某些需要强调的区域。

        (四)文字与背景颜色的选择与搭配

        当网页的主色调和辅助色彩决定了之后,就可以考虑文字与背景颜色的选择与搭配了。网页中的文字,除了装饰性的文字可以不用考虑易读性之外,其他出现的文字都要把文字的易读性放在首要的位置,在满足了这个前提之下,再考虑使用更加匹配或协调的色彩。文字在网页中的易读性,除了和文字本身的字体和颜色有关外,文字背景的颜色也起到了至关重要的作用,一般来说,文字会采用与背景色相对比的颜色,来保证文字的可读性,而背景色也会尽量采用能衬托出文字的配色。文字的配色上要尽量避免过于鲜艳的色彩,以免带来过于强烈的视觉刺激,降低了页面的档次。而在背景色的选择上,我们还要注意尽量避免出现过于花哨的纹样,以免影响到文字的阅读。

        (五)超链接的样式与色彩

        前文已经提到,默认的超链接样式显然无法满足浏览者的审美需求,在成熟的页面设计中,超链接的样式和色彩都是经过精心设计的搭配过的。一般来说,超链接的样式和色彩应该和网页中其他的文字有着明显的区分,这样才能够明确的提示浏览者,此处是可以点击的“超链接”。超链接在网页中有四个状态可供设计师进行设计,分别是 a:link(超链接创建未点击)、a:hover(鼠标经过超链接)、a:active(鼠标点击超链接时)、a:visited(超链接点击后),大多数情况下,a:hover 和 a:active 通常采用相同的样式和配色。而 a:link 和 a:visited的样式或色彩会进行明显的区分,这样有助于帮助浏览者掌握哪些链接已经点击查看过了。


相关文章
  • 预约专家

    为您提供一对一解决方案
    立即预约
  • 售前咨询

    周一至周五9:00——17:30
    立即咨询
  • 联系方式

    13919049954

    全国7×24小时热线服务
  • 免费报价

    专属专业顾问1对1报价
    免费报价