99久久精品免费观看国产_久久无码人妻一区二区三区_50岁熟妇的呻吟声对白_毛很浓密超多黑毛的少妇

網站建設中導航要素的設計

分類: 瀏覽次數:33804 2018-11-06 00:00:00
滿意回答
2018-11-06 00:00:00

網站導航系統用來引導客戶完成特定的指令。網站導航設計需要傳達出導航元素與其所包含內容之間的關系,導航提供了客戶在網站內容之間跳轉的方法,幾種常見的導航形式有:全局導航、局部導航、面包屑、標簽、按鈕、圖標等形式。

QQ截圖20180913101529

1.菜單

根據網站的信息體系層級劃分,全局導航為一級菜單,局部導航為二級、三級或更深層次菜單。表現形式有:文本導航、圖片導航、Tab導航、浮出菜單、垂直菜單。

文本導航是由一行有間隔的超文本組成,簡潔有余,美觀不足;

圖片導航通過JavaScript和CSS可以展示每個導航項,當用戶光標不在其上的狀態、滑入其上的狀態、單擊時的狀態、已鏈接的狀態等與用戶交互的反應;

Tab導航一般是由文本和背景圖像構成,通過CSS背景圖像能夠根據文本內容的多少而延伸,用戶滑入其上或單擊的導航比其他導航有明顯的靠前、突出感;

根據需要展示的信息的多少,浮出菜單分為整個頁面鏈接跳轉和局部頁面信息更新兩種形式,浮出菜單最初只顯示一級菜單項,當用戶滑入或單擊某導航時,其下或其右展開此項的次級菜單,優點是節省頁面空間,缺點是次級項目不夠一目了然,用戶在進行選擇時容易誤操作;

對于從左向右的閱讀語系,垂直菜單一般放置在頁面左側作為全局或局部導航,放置在右側則通常為輔助導航或友情鏈接。

2.鏈接文本

鏈接文本一般的顯示狀態與普通文本不同。如果普通正文設置為沒有下劃線、顏色為“A”,鏈接文本則有下劃線,顏色為“B”,當鼠標滑過,鏈接文本顏色改變、背景色改變,去除下劃線,同時出現小手光標。如果在文本旁邊設計具有明顯指示鏈接意圖的小動畫或圖標更能使用戶認識到這是一個有鏈接的文本。短小的鏈接文本有時不能清楚地解釋,這時,最好為此文本設置Alt說明性提示文字功能,即當鼠標滑過時,彈出解釋說明其鏈接跳轉后頁面的主要內容。

當鏈接文本作為導航標題時,通常會把文本加大、加粗或加寬,突出文本顏色或其與背景色的反差,有時,也為標題文本設置浮雕或蝕刻效果,增強信息組織方式的表現力和可交互性。視覺效果明確的導航標題使用戶知道這是可以被點擊并展開詳細深入內容的。

3.按鈕

在任務流程、應用程序、表單中,點擊按鈕可以執行相應操作。與鏈接文本不同,鏈接文本一般會用來實現從一個頁面到另一個頁面的跳轉,展示不同的信息;而按鈕常用來實現一個操作行為,一個事務命令。網頁上有三種形式的按鈕:圖像按鈕、HTML按鈕、flash按鈕。

4.面包屑導航

面包屑導航系統一般用大于符號、向右箭頭或者豎線表示信息層級之間的遞進關系。最后一個表示當前頁面主要內容標題的文字通常會加粗、加大顯示,有些頁面也因此省略掉頁面標題文字。面包屑導航系統一般放置于整個頁面的頂端,或者放置于主廣告條、全局導航之下,頁面內容之上。

需要注意的是,為了不讓面包屑導航影響主要導航,其表現力要弱于主導航。

5.標簽和卡片堆

標簽和卡片堆有類似的視覺效果。把同類的不同欄目組織起來,欄目標簽整齊排列,當光標滑過或單擊某個欄目標簽時,相應的欄目標簽靠前突出,同時顯示此欄目的內容。

標簽常用來比喻頁面中主導航欄目的顯示效果與內容切換;卡片堆則用來比喻頁面中局部信息塊欄目的顯示效果與內容切換。但前者由于信息量較大,適于頁面鏈接跳轉或整個頁面的刷新;后者則適用Ajax技術進行局部數據更新。

標簽的視覺效果比一般導航菜單要明確,它把標簽欄目所屬的子內容也帶到用戶所矚目的位置。在激活的標簽之下顯示一條相同背景或顏色的子欄目菜單或所屬的具體內容,從左側延伸到右側。用戶可以清楚地感知,標簽不單是一個可以點擊的按鈕,它還控制了用戶瀏覽的信息內容。

6.顏色編碼

顏色是人類識別信息的重要信號。有的網站使用顏色編碼來標記不同欄目,這些顏色的飽和度和明度基本一致。對于大多數瀏覽者來說,顏色編碼可以提供欄目的辨識度。

網站設計師需要注意的是,不要讓顏色編碼喧賓奪主,影響頁面內容的傳達。

7.圖片和圖標

圖片比文字更能產生跨文化、跨民族的效果,因此在網站設計中,也常用圖片構成導航,作為導航的圖片應該簡潔、精致、具有一定的代表性,瀏覽者一看便知。即便如此,由于圖片中的文本不能被搜索引擎收錄,扔需要為圖片導航設置相應的文本導航或者設置Alt說明性提示文字,從而增加網站的曝光率。


標簽:
青島企業郵箱哪家做?多少錢的相關問題

Copyright All Rights GreatGoal Design co.,ltd. 魯ICP備16002128號-3