DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> WEB網站前端 >> 關於網頁技巧 >> 網站架構設計:網站導航系統作用和分類
網站架構設計:網站導航系統作用和分類
編輯:關於網頁技巧     

網頁制作poluoluo文章簡介:導航系統的分類:全站、區域、情境式、輔助性導航。

導航系統的作用:告訴你在哪裡,可以去哪裡,這裡有什麼,附近有什麼,指引你下一步的行為。
導航系統的分類:全站、區域、情境式、輔助性導航。

浏覽器的導航特點
考慮浏覽器環境,其實浏覽器上已經有後退、前進、收藏、設為首頁等功能,但有時候在頁面本身的浏覽情境當中也最好要放這些功能,比如在浏覽一篇文章,到了結尾能看到[收藏]、[關閉]、[返回]等功能可以方便不少用戶看完後其它意圖的操作。還有就是區分有無鏈接的文字樣式,區分是否浏覽過文字的樣式(這些其實是編寫CSS樣式范圍內的)。

建立情境
最典型的例子用戶隨便從Google搜索到一張網頁,當點擊進入頁面後,就算是進入了一個情境中。情境中應該告訴用戶這是在哪裡?(我在什麼位置,這是什麼網站),這裡有什麼(頁內標題),用戶下一步能做什麼(能看,能下載,能購買),還能去哪裡(欄目,本欄頁內導航),以上幾點類似於《Don't make me think》中內頁的6點基本要素:1.站點ID、2.頁面名稱、3.欄目下一級欄目、4.頁面導航、5.“你在這裡”指示器、6.搜索。

改善靈活性
網站中各欄目之間的內容可能保持垂直的排列方式,但用戶在訪問內容時要考慮Ta們可以會隨時跳轉到其它欄目的二級、三級頁面中,保持橫向和縱向的導航,注意不要導航輔助功能的設置。提供增加的情境和靈活性,彌補等級式系統的不足之處。

全站導航系統
全站導航系統就是要在網站上的每一頁都會展示的導航系統,可直接連向重要的區域和功能,無論用戶在哪個層次中。全站導航保持一致性,以密集且重復來訪的用戶為中心,進行設計和測試。
值得一提:具有情境式的全局導航系統,這類導航不僅告訴你這裡有什麼內容,還告訴用戶正在哪塊內容中。(圖1)   圖1

區域導航系統
當用戶進行某個欄目中後,可能該欄目還會分很多小欄目,把這些小欄目列出來,方便用戶可以立刻浏覽那些內容,有些網站會把全站導航和區域導航整合成一致且統一的系統,如下拉菜單。和全站導航一樣,在同一個站點中他們的表現形式最好一致且統一的。

情境式導航
進入目的頁面後,會有一些內容指向特定的網頁、文件、對象。比如網站上的“相關文章”,“喜歡這個商品的用戶也會喜歡”,“同類TOP10”,要注意[情境式全局導航系統]主要是說明所處的位置,[情境式導航]是說明在這張頁面內容的情境下,有什麼相關內容可以告訴並提供鏈接給用戶(稱外部情境式導航鏈接,玩概念:)。比如你在Joyo買《精通CSS》這本書,在介紹這本書的頁面中,總會有一些鏈接是指向與CSS類的其它書籍。還有一種是在文章敘述的文字中放鏈接(稱內聯情境式導航鏈接,玩概念:)。

實踐嵌入式導航
認識到全站、區域和情境區導航元素都在大多數網頁上同時共存,如何在網站中整合好。不過這個問題可能涉及到:網站欄目多少、頁面結構復雜度、實現一些效果的JS程序、交互過程相關這些。

輔助性導航系統
包括網站地圖、索引、指南。確保大型網站可用性和可尋性的關鍵。
網站地圖:1. 強化信息層次,使得用戶熟悉對內容的組織方式。2.對了解網站用途的用戶,則便利其快速、直接訪問內容。3.避免讓用戶承擔太多信息,協助用戶。網站地圖強化層次感,探索感。網站地圖有一個很實在的好處,當你在搜索引擎中找到某個網站,它可以直接把你帶到相關的欄目中。(圖2)
  圖2
網站索引:就是將網站的內容以關鍵詞、詞匯、標簽按一定順序(字母,筆劃)排列而成。內容之間可以沒有等級關系。方便已知條目的尋找,比如歌星中找“曾轶可",只要有找首字首拼音“Z”就可以。
對小型網站可以利用你對內容了解的知識來決定要引入哪些鏈接,來創建索引。
對大型網站首先用戶從索引中選擇術語,再從以該術語為索引的文件清單中選出想要的。

指南:網站的新手指南。設計指南原則1.指南要短。2.無論何時,用戶都能離開指南。3.允許用戶在指南中,前進,後退的自由移動。4.指南的設計目的是回答問題的。5.截圖應該明確,具有把重點功能放大的效果。6.如果指南有好幾頁,要目錄。

向導和配置器:主要是協助用戶選擇配置產品細節(圖3)   圖3 高級導航方法
個性化和定制化
個性化(猜測用戶想要什麼。在特定環境中會運行的很好,但在用戶體驗時,就會失敗)就是針對個人的行為、需求、喜好提供剪裁後的網頁給用戶。如網上買書時,會有“推薦同類書籍”,可能有些推薦的書你已經買過並看過了。定制化(用戶告訴我們想要什麼。但有時候用戶自己都不知道他們要需要什麼)是給用戶直接控制權,可以針對展現格式、導航和內容選項的組合做調整。如Google Reader。

可視化:讓用戶可能采用可視化的方式浏覽GROXIS。(在網上浏覽博物館網站時就像逛現實生活中的博物館一樣身臨其境的感覺,想了想谷歌音樂的[挑歌]欄目可能比較類似這種概念)

社會化導航用戶上網的需求點、興趣點可以從觀察其它用戶行為中推論出來的基礎上。比如說一些人上論壇,微博時就是看最近有什麼網絡話題,關注一些熱門的標簽,標題;而這類標簽,話題主要是通過搜索日志、使用量統計數據、顧客數據庫等站長統計軟件中獲得。(其實這也是情境式導航,只不過作者用這類導航的產生方式來歸納:這類導航的內容是通過用戶的行為統計產生的,就成了[社會化導航]了)

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved