很多企業(yè)在架構(gòu)官網(wǎng)的時(shí)候,，經(jīng)常會(huì)煩惱于該如何設(shè)計(jì)官網(wǎng),，才能讓官網(wǎng)顯得高大上。

為了實(shí)現(xiàn)“高大上”,，企業(yè)可謂是費(fèi)盡心思，參考借鑒了大量不同風(fēng)格的網(wǎng)站，看著是博采眾長,，可最后呈現(xiàn)的效果反而不盡人意,。

“官網(wǎng)的交互效果要怎么才酷炫？”

“排版要怎么才顯得豐富多變,？”

“是不是應(yīng)該專門去請?jiān)O(shè)計(jì)師設(shè)計(jì)一下,？”

下面，我們就來看看中匯創(chuàng)意營造有限公司,，是如何通過“主打色”法則,，四兩撥千斤的塑造出一個(gè)有個(gè)性、有格調(diào)的官方網(wǎng)站的,。

如何選擇官網(wǎng)的主打色,？

那么品牌的“主打色”應(yīng)該從何而來呢？常見的方式,，就是從品牌Logo中提取,。這樣做可以有助于品牌調(diào)性的統(tǒng)一，是品牌建設(shè)中基礎(chǔ)手段,，中匯創(chuàng)意也是這么做的,。

于是就有企業(yè)會(huì)問了：假如我們企業(yè)的Logo顏色不夠好看怎么辦？

很簡單,，調(diào)整,。

其實(shí)只要企業(yè)在商標(biāo)注冊時(shí)沒有申請指定顏色，那么企業(yè)是可以自由的對Logo顏色進(jìn)行調(diào)整的,。那么對Logo顏色的選擇上,，要考慮什么方面呢？

一是要考慮到顏色是否與品牌定位,、行業(yè)定位相符,。

如科技行業(yè)一般會(huì)選擇冷靜的冷色調(diào)，如藍(lán)色,、黑色等,；而像中匯創(chuàng)意這類創(chuàng)意型公司，一般會(huì)選擇橙色,、黃色,、紅色等，這一類炙熱,、熱情,、飽滿、充滿能量的色彩,，色調(diào)明亮,、強(qiáng)烈,、活潑，有積極向上的意象效果,。

二是要從實(shí)際角度,，考慮這個(gè)顏色是否適合用來進(jìn)行物料延展。

同一個(gè)色系里有無限種色彩坐標(biāo),，因此品牌定下主色調(diào)后,，還要把關(guān)好顏色的飽和度、明度,，在經(jīng)過不斷的比對后,，選出優(yōu)先顏色，制定標(biāo)準(zhǔn)化顏色參數(shù),。

如中匯創(chuàng)意所選擇的橙色,，是一種帶紅棕的橘調(diào)，微量的棕色往明快中調(diào)和了一絲穩(wěn)重,，不管是用在線上還是線下物料都有優(yōu)秀的視覺表現(xiàn)力,。

如果能將主色調(diào)運(yùn)用到極致，甚至可以讓消費(fèi)者只要看到顏色,，大腦就會(huì)不自覺的聯(lián)想到你的品牌,。

如可樂紅、電信藍(lán),、郵政綠,，還有奢侈品牌蒂芙尼，就把品牌色蒂芙尼藍(lán)包裝成了家喻戶曉的Pantone1837,。

以大色塊制造視覺沖擊

奠定品牌調(diào)性

首頁的banner圖,，是首先映入用戶眼簾的模塊，只要能利用好banner位,，你的網(wǎng)站已經(jīng)成功了一半了,。中匯創(chuàng)意的做法，就是利用全屏大banner先色奪人,，用大片濃郁的品牌主打色抓住用戶的眼球,。

“其實(shí)網(wǎng)站的設(shè)計(jì)并不用太復(fù)雜，也能營造出很強(qiáng)的視覺沖擊力,?！?/span>

中匯創(chuàng)意網(wǎng)站負(fù)責(zé)人說道。

“事不過三,，色不過三,。我們的banner雖然搶眼，但實(shí)際上只運(yùn)用了兩個(gè)顏色,，白色和橙色,。只要對比度足夠,，那么白色就是不會(huì)出錯(cuò)的萬能搭配色。至于網(wǎng)站的整體,，我們可以搭配黑色灰色,，這兩種顏色沒有明顯的色彩傾向,，不會(huì)破壞色彩的協(xié)調(diào)性,。”

Banner最常見的排版形式是居中排版以及左右排版,，利用線條或者英文可以對標(biāo)題文字起到很好的修飾作用,。

文案不宜太多，要精,、要簡,，如果字?jǐn)?shù)或元素太多，反倒會(huì)破壞這種高級的美感了,。

如何用主打色點(diǎn)綴細(xì)節(jié)

提升畫面整體質(zhì)感

什么叫主打色,？就是要讓它獲得十足的存在感，能無時(shí)無刻地從品牌畫面中跳出來,，成為點(diǎn)睛之筆,。

由于在Banner圖上如果已經(jīng)使用了大色塊，那么在其他的板面上我們就要有所節(jié)制,。

例如下圖,，橙色的雙引號一下子給整張圖賦予了設(shè)計(jì)感。當(dāng)?shù)咨巧曙柡投容^低的深色時(shí),，可搭配純白色文字,。在這樣的畫面中，只需添加一筆明亮的彩色就能輕而易舉的提升質(zhì)感,。

白底時(shí)也是同理,，以白色搭配深灰色文字，對小元素,、標(biāo)題賦予顏色起到畫龍點(diǎn)睛的作用,。      

遇到圖文排版，如果怕圖片的色彩會(huì)打破畫面的和諧感,，可以對圖片進(jìn)行黑白效果處理,，然后以主色填充的色塊作為裝飾。

手機(jī)端頁面

有時(shí)候也可以利用網(wǎng)站的互動(dòng)效果,，讓這抹顏色活動(dòng)起來,。中匯創(chuàng)意就試用了凡科建站中的鼠標(biāo)懸停hover效果。

總結(jié)

大部分的品牌官網(wǎng),，其出發(fā)點(diǎn)都是為了承載內(nèi)容而不是炫技,，因此品牌其實(shí)不必過分的追求網(wǎng)站的互動(dòng)技巧,，只需將精力放在美觀度和實(shí)用性上即可。

文中所介紹的案例,，是一種簡單高效的,，通過靈活用色以低成本打造出高端感的方法，很值得對官網(wǎng)設(shè)計(jì)毫無頭緒的企業(yè)去借鑒,。

至于網(wǎng)站的排版難題,，則更容易解決了。凡科建站提供了海量優(yōu)質(zhì)的行業(yè)模板,，用戶只需要簡單的拖拽修改,，即可高效獲得優(yōu)先展示效果，更重要的是,，后續(xù)的維護(hù)同樣簡單方便,。

點(diǎn)擊右方鏈接，直達(dá)案例官網(wǎng)：http://charmviv.com/

（提示：移動(dòng)端打開為移動(dòng)端網(wǎng)頁,，PC端打開為電腦端網(wǎng)頁）