網(wǎng)站導(dǎo)航的布局非常靈活。
一般情況下,網(wǎng)站導(dǎo)航位于頂部居中或縱向居左的偏多。如果網(wǎng)站導(dǎo)航位于右側(cè),為了避免干擾,原來在右側(cè)下方出現(xiàn)的友情鏈接和廣告按鈕可能就不會(huì)在第一屏出現(xiàn),或者把它們放置在頁面左下方。
如果網(wǎng)站導(dǎo)航位于頁面底部,則通常在折疊位置以上,即一屏之內(nèi)能看到。
導(dǎo)航布局的各種方式常?;旌鲜褂茫热纾喝謱?dǎo)航在標(biāo)志下方居左水平排列,實(shí)用性導(dǎo)航位于頂部右側(cè)水平排列,局部導(dǎo)航垂直左側(cè)排列。
1.橫向頂部
主導(dǎo)航水平位于頁面上方,這就是導(dǎo)航的常見位置。人們常規(guī)的閱讀習(xí)慣是從上到下、從左到右,所以主導(dǎo)航菜單一般都布局在頁面頂部,水平排列。對(duì)于布局穩(wěn)定的全局導(dǎo)航,用戶的閱讀經(jīng)驗(yàn)使其知道全局導(dǎo)航的常規(guī)位置和功能,雖然關(guān)注度不高,一旦需要使用時(shí)卻可以輕松定位。
2.縱向左側(cè)
按照視線流從上到下、從左到右的習(xí)慣,也會(huì)把全局導(dǎo)航或局部導(dǎo)航設(shè)置在頁面左側(cè)垂直排列。
3.橫向底部
如果導(dǎo)航位于頁面下方折疊位置以上:
一種情況是頁面內(nèi)容比較少,一屏就可以全部顯示;
另一種情況是內(nèi)容很多,需要拖動(dòng)滾動(dòng)條才能看下面的內(nèi)容,但拖動(dòng)滾動(dòng)條時(shí),導(dǎo)航的位置始終位于底部,并不會(huì)隨滾動(dòng)條向上滾動(dòng)以致消失,即采用了浮動(dòng)布局法。
4.縱向居中
縱向居中的導(dǎo)航會(huì)把整個(gè)網(wǎng)頁一分為二,信息內(nèi)容分列左右兩側(cè)。用戶瀏覽信息時(shí)會(huì)受到中間導(dǎo)航條的干擾,思維出現(xiàn)停頓和跳躍。
比較好的處理方法是,縱向居中的導(dǎo)航平常收起狀態(tài),光標(biāo)滑過后展開,單擊選擇某菜單項(xiàng)后再次收起,空出版面來顯示具體內(nèi)容。
5.隨意布局
貌似隨意布置的導(dǎo)航菜單,給人自然放松的感覺,但是在細(xì)節(jié)處理上,網(wǎng)站設(shè)計(jì)風(fēng)格應(yīng)保持一致,文字、顏色、圖形、背景、投影燈視覺元素設(shè)計(jì)應(yīng)統(tǒng)一。各導(dǎo)航菜單間距小于導(dǎo)航菜單整體與其他內(nèi)容面積之間的距離,或者導(dǎo)航菜單周圍有大面積留白,從整體看,有很明確的信息塊的印象。
6.浮動(dòng)布局
浮動(dòng)布局的導(dǎo)航菜單,通常使用在設(shè)計(jì)感強(qiáng)、頁面較長的網(wǎng)站上,如果只在第一屏設(shè)置主導(dǎo)航菜單,向下滑動(dòng)時(shí)主導(dǎo)航隨之滑動(dòng),既可以節(jié)省空間,又可能讓用戶在頁面中的任何位置隨時(shí)使用。
Copyright All Rights GreatGoal Design co.,ltd. 魯ICP備16002128號(hào)-3