現在網站需要發布的(de)信息量越來越多(duō)，這樣無形中增加了(le)頁面内容放置的(de)壓力。爲了(le)讓内容能夠進行有層次的(de)編排，網站中多(duō)采用(yòng)分(fēn)欄目的(de)形式，并将内容分(fēn)門别類地歸入相應的(de)欄目中。這時，頁面中就會有很多(duō)欄目。本節将介紹多(duō)欄目頁面的(de)色彩布局。

企業網站建設公司以淘寶網首頁爲例，有想從網站中購買東西的(de)用(yòng)戶，也(yě)有在網站中開設網店(diàn)的(de)賣家，網站的(de)欄目劃分(fēn)比較多(duō)。分(fēn)析該網站的(de)色彩布局，主要有如下(xià)幾點。

1. 導航的(de)色彩布局

下(xià)面通(tōng)過導航的(de)色彩布局，來了(le)解多(duō)欄目頁面中的(de)色彩布局。以淘寶網爲例，下(xià)面分(fēn)析導航的(de)色彩應用(yòng)。

導航1：觀察顔色使用(yòng)，分(fēn)别有黃色導航文字、橙色導航文字填充、白色導航文字、白色導航條背景。

導航2：觀察顔色使用(yòng)，分(fēn)别有黃色邊框、奶黃色背景、分(fēn)欄線、黑(hēi)色文字、黃色按鈕、綠色與白色搭配的(de)提醒按鈕。

産品類别的(de)色彩布局

以産品類别色彩布局爲例，下(xià)面企業網站建設公司對其選擇的(de)顔色進行具體分(fēn)析。

⑴ 橙色交互操作邊框：顔色值爲#FF4400。

⑵ 灰色邊框：顔色值爲#D8D8D8。

⑶ 産品類别劃分(fēn)線：實線，顔色值爲#D8D8D8。

⑷ 産品劃分(fēn)線：虛線，顔色值爲#C2C2C2。

⑸ 文字顔色：橙色、黑(hēi)色、藍色，顔色值分(fēn)别爲#FF5500、#444444、#076FA2。

⑹ 産品鏈接标簽：應用(yòng)于産品圖片下(xià)方的(de)文字，顔色值爲#FF4400。

總結上述顔色的(de)應用(yòng)，⑴ ~⑹ 的(de)具體顔色及其顔色值。

企業網站建設公司以前也(yě)分(fēn)析過網頁設計中形狀與顔色的(de)變化(huà)，其有著(zhe)“層巒疊嶂”的(de)效果，是合理(lǐ)的(de)。由此，在幫助提升多(duō)欄目頁面色彩布局技巧的(de)同時，也(yě)可(kě)以發現多(duō)欄目頁面的(de)色彩布局，不同欄目采用(yòng)不同顔色搭配的(de)手法。