編者按：導航的方式多樣，今天著重聊聊側邊導航。如何在大小、形式、色彩以及排版方面將導航玩出不一樣的姿態(tài)，來看高手的作品跟@AnyForWeb_UED 同學細致專業(yè)的分析 >>>

　　導航在網(wǎng)站設計中的重要性已經(jīng)毋庸置疑，但重要不意味著它必須高調，安靜與顯眼兼具的導航才最符合用戶的使用體驗，而側邊導航恰巧同時滿足了這兩點。網(wǎng)站側邊導航的好壞與否很容易判斷，主要取決于它的大小、形式、色彩和排版。

　　一般來說，側邊導航的寬度尺寸控制在內容部分寬度的三分之一左右;

　　主要表現(xiàn)形式有抽屜式導航、固定式側邊導航和隱藏式側邊導航等;

　　色彩上要與頁面整體風格互相協(xié)調融合，避免過于亮眼的顏色。雖然導航應該顯眼，但通過色彩來實現(xiàn)卻不是一個好方法，通過排版、形式、字體等方式同樣能達到目的;

　　側邊導航的排版布局比較簡單，分為左側導航和右側導航。一般將導航置于左側的居多，這樣能獲得更多的關注度。

Fine Goods

　　逼真的擬物化設計加上木質紋理背景，案例網(wǎng)站中的側邊導航應用變得格外應景。導航與網(wǎng)頁整體設計風格很融合，同時用紋理的細微變化以示區(qū)別，不僅讓用戶獲得視覺上的舒適感，也讓導航更加與眾不同。

The Max

　　這個案例中體現(xiàn)的是導航設計中的慣用手法，使用與背景色反差較大的顏色來點綴頁面中的重要元素，同時起到提亮導航的作用。由于背景色選擇了深沉的悶黑色，所以導航的顏色也選用了同色系的黑色，但相對亮一些，整體效果既不唐突，也能很快速、自然的吸引用戶視線。

CDN77

　　這個是一個比較單一的網(wǎng)站配色，導航設計的比較隨性，所以讓整體效果神秘中帶著休閑。設計師將網(wǎng)頁打造成少線框的體驗，讓頁面更加自由而無拘束，同時突出了右上角“LOGIN”幽靈按鈕的設計，引導用戶登錄點擊。

DHIRAJ

　　這個網(wǎng)站沒有遵循導航尺寸介于內容三分之一到二分之一大小的規(guī)律，因此視覺上會讓用戶造成內容部分有些壓抑的感覺。但這個案例中的某些細節(jié)很值得我們借鑒，比如內容板塊頂部的自然陰影設計;大標題中的水印字樣等，這些元素都令網(wǎng)站看起來更加自然親切，拉近了網(wǎng)站與用戶之間的距離感。

SVN FTP

　　純手繪風格的網(wǎng)頁設計可能會讓網(wǎng)站顯得太過童真，而下面的案例卻表現(xiàn)出了手繪風格的另一種形態(tài)。設計師沒有將網(wǎng)站中的文字都設置成手寫涂鴉的狀態(tài)，因此網(wǎng)站的用戶體驗并沒有因為風格的原因受到任何影響。尤其導航部分，與底色同色系的淺灰色底紋將導航和背景很好的區(qū)分開來，視覺流暢不違和。

GEORGINA BOUSIA

　　Georgina Bousia的網(wǎng)站很直觀的給用戶一種清新平靜的感覺。干凈簡單的導航也能為網(wǎng)站帶來高端大氣的感覺，但也不可否認設計師在其中花了很多小心思。內容大圖上有輕微的半透明幾何陰影效果，讓圖片中的風景多了一些陽光灑落的設計感。

212

　　網(wǎng)站導航也能設計出一種場景交錯的感覺。內容部分的某一環(huán)節(jié)與導航自然銜接，黑色的使用不僅沒有顯得乏味單調，反而制造出了一種獨特的復古時尚感。兩者之間的垂直視差效果更利于吸引用戶。

VIPER

　　這是一個很特別的網(wǎng)站導航設計，設計師用下拉的形狀側面體現(xiàn)了導航的簡易性和適用性。導航在網(wǎng)站整體中表現(xiàn)得比較隱蔽，更像是一個頁面中的補充設計。

ONYMOLY

　　ONYMOLY的網(wǎng)站導航采用了雙層設計，再加以簡單的圖標設計，這樣的好處是讓用戶更清晰的查看到網(wǎng)站的內容分類。色彩上，設計師使用了中性的黑白搭配，將對主內容區(qū)域的視覺影響降到最低。

ATLANTA

　　如果你覺得網(wǎng)站導航只是靜靜的安置在頁面?zhèn)冗吙雌饋硖y(tǒng)的話不妨試試下面這個案例的做法。設計師在導航周圍添加了絲帶效果，讓頁面看起來瞬間充滿活力。

　　有時候，只需要一些別出心裁的小效果就能讓導航變得與眾不同。但基于導航對整個網(wǎng)站的重要性，舒適的用戶體驗與美觀度之間的取舍需要設計師仔細考量。

當前文章：超贊！有哪些將側邊導航玩得特別出彩的網(wǎng)站？
URL網(wǎng)址：http://aaarwkj.com/news43/165993.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供用戶體驗、網(wǎng)站設計、網(wǎng)站策劃、軟件開發(fā)、網(wǎng)站導航、微信公眾號

廣告

聲明：本網(wǎng)站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經(jīng)允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)