趙 愛 濤

(石家莊職業(yè)技術學院 信息工程系,河北 石家莊 050081)

?

網(wǎng)站導航系統(tǒng)的設計應用

趙 愛 濤

(石家莊職業(yè)技術學院 信息工程系,河北 石家莊 050081)

網(wǎng)站導航系統(tǒng)的設計應遵循以人為本，直觀易操作；與網(wǎng)站內(nèi)容、風格、結(jié)構(gòu)一致的原則.網(wǎng)站導航系統(tǒng)設計的方法有全局導航、局部導航、文字導航、面包屑導航和搜索引擎式導航.

導航系統(tǒng)；網(wǎng)站；設計

隨著網(wǎng)絡技術的飛速發(fā)展，網(wǎng)站作為信息傳遞的媒介，已經(jīng)滲入到人們工作、生活的方方面面.網(wǎng)站提供了導航、文字、圖片、聲音、動畫等多種媒體元素，瀏覽者通過網(wǎng)站獲取所需的各類信息.而導航系統(tǒng)作為網(wǎng)站設計好壞的評價指標，在構(gòu)建一個成功的網(wǎng)站中扮演著重要的角色.本文就網(wǎng)站導航系統(tǒng)在網(wǎng)站設計中的作用、設計原則和方法進行分析研究.

1 網(wǎng)站中導航系統(tǒng)的重要性

網(wǎng)站信息量巨大，瀏覽者要想快速高效地獲取需要的信息，離不開網(wǎng)站導航.在進入網(wǎng)站后，瀏覽者需要知道“我在哪，要去哪，怎么去”，而這些問題由網(wǎng)站導航系統(tǒng)來解決.

導航系統(tǒng)在網(wǎng)站中承擔著展現(xiàn)信息結(jié)構(gòu)的功能，對網(wǎng)站的規(guī)劃和布局起著決定性的作用.一個好的導航系統(tǒng)能夠改善用戶的網(wǎng)站體驗，幫助用戶定位自己在網(wǎng)站中的位置，知道下一步該去哪里和如何順利地返回上一頁，從而有助于用戶制定更好的閱讀路線，增進對內(nèi)容的理解，避免用戶在虛擬網(wǎng)絡空間里出現(xiàn)迷航的現(xiàn)象.

網(wǎng)站導航系統(tǒng)要實現(xiàn)三個方面的功能：(1)瀏覽者能從互聯(lián)網(wǎng)的一個頁面跳轉(zhuǎn)到另一個頁面，即實現(xiàn)頁面跳轉(zhuǎn).(2)能尋找和定位所需的信息，即實現(xiàn)對網(wǎng)絡信息的瀏覽.(3)提供訪問網(wǎng)頁定位所需的所有文字、圖片等的鏈接.鏈接是網(wǎng)站導航設計的關鍵，通過鏈接可以體現(xiàn)網(wǎng)站內(nèi)容的關聯(lián)性和結(jié)構(gòu)的完整性.

2 網(wǎng)站導航系統(tǒng)的設計原則

(1)以人為本，直觀易操作

網(wǎng)站的用戶是瀏覽者，因此，首先必須滿足以人為本的基本原則.導航結(jié)構(gòu)設計要簡單明了，符合瀏覽者的瀏覽習慣，使瀏覽者能快速進入網(wǎng)站主題內(nèi)容并定位信息.

設計和制作導航系統(tǒng)時，對于一些行業(yè)網(wǎng)站或個性化網(wǎng)站，要考慮特定用戶的喜好、文化程度、工作性質(zhì)等因素，最大程度地滿足用戶的特定需求.

導航的結(jié)構(gòu)和層次設計越簡單，瀏覽者越能快速訪問所需的信息，增強用戶瀏覽信息的體驗感，提高網(wǎng)站的服務能力.一般網(wǎng)站導航設計層次多為二到三層，以方便用戶尋找.

例如，某介紹玫瑰花的網(wǎng)站導航系統(tǒng)，分兩個層次，如圖1所示.

圖1 玫瑰花網(wǎng)站導航系統(tǒng)層次

網(wǎng)站鏈接文字、圖片設計要醒目，尤其對于首次訪問網(wǎng)站的用戶，這種直觀易操作性可以大大提高用戶的體驗感，利于網(wǎng)站的發(fā)展與推廣.

(2) 導航設計要與網(wǎng)站內(nèi)容、風格、結(jié)構(gòu)一致

首先，網(wǎng)站的內(nèi)容是設計的依據(jù)，是導航設計的靈魂，導航要完整、準確地表達出網(wǎng)站的內(nèi)容和信息.對網(wǎng)站內(nèi)容進行分析、歸納、總結(jié)、分類，有助于理清導航系統(tǒng)的框架結(jié)構(gòu)，確定導航的設計形式.

其次，根據(jù)網(wǎng)站的風格設計不同的導航系統(tǒng).網(wǎng)站的風格是指網(wǎng)頁中所有元素形成的整體形象，能給瀏覽者的一個綜合感受.網(wǎng)站設計中，網(wǎng)站的整體風格及其創(chuàng)意設計非常重要，同時也最難把握，因為沒有一個固定的模式可參考，需要制作者不斷積累設計經(jīng)驗.

不同的網(wǎng)站，風格是不同的，網(wǎng)站導航的設計也應該是獨特的，并通過色彩的搭配，文字效果的設置，圖片、動畫的應用等來體現(xiàn).當然風格的設計離不開內(nèi)容這個靈魂，根據(jù)主題內(nèi)容的不同，風格有活潑型、沉穩(wěn)型，有輕松的，也有嚴肅的，形式上有中規(guī)中矩的，也有特立獨行的.根據(jù)網(wǎng)站性質(zhì)的不同分為企業(yè)網(wǎng)站、商業(yè)網(wǎng)站、教育科研機構(gòu)網(wǎng)站、個人網(wǎng)站以及其他類型等,用戶種類不同，風格也不同，例如，兒童類網(wǎng)站迪斯尼采用靚麗的顏色、卡通的形象來制作各種導航按鈕.

“網(wǎng)站具有多屏、分頁、嵌套等特點，統(tǒng)一的網(wǎng)站風格能給瀏覽者留下深刻的印象.”[1]對同一個網(wǎng)站來說，網(wǎng)站導航系統(tǒng)的布局、文字排版、色彩處理要統(tǒng)一、協(xié)調(diào)，不能有太大的跳躍，要塑造網(wǎng)站的整體形象，以便于瀏覽者把握網(wǎng)站的整體風格，也有利于技術實現(xiàn)以及后期的修改和維護.瀏覽者閱讀的習慣是從上到下、從左到右，因此，大部分網(wǎng)站導航一般放置在網(wǎng)頁的頂部或左側(cè)，有時還結(jié)合右側(cè)和底部導航的方式[2].頂部導航是一種最常用的導航布局方式，位于頁面的上方.頂部導航符合瀏覽者的瀏覽習慣，便于瀏覽者對網(wǎng)站結(jié)構(gòu)、內(nèi)容的了解，適用于任何網(wǎng)站結(jié)構(gòu)類型.左側(cè)導航通常作為局部導航，是主導航的二級或三級欄目導航，通常運用于左右型結(jié)構(gòu)的網(wǎng)站.底部導航主要是主導航一級欄目的文字鏈接，位于頁面底部.當頁面較長，出現(xiàn)多屏時，瀏覽者不必將屏幕滾動回頂部，可以通過底部的文字鏈接繼續(xù)訪問感興趣的內(nèi)容.

再次，根據(jù)網(wǎng)站的結(jié)構(gòu)特點設計導航系統(tǒng).對于小型網(wǎng)站，所有文件都在站點的根目錄下，文件不能太多，否則容易造成混亂，沒有太多的邏輯結(jié)構(gòu)可言.一般的網(wǎng)站都是采取邏輯性強的樹形結(jié)構(gòu)，先是首頁，然后是各欄目的分類頁面，最后為具體的文章頁面.所有的頁面都能鏈接到首頁，分類頁面之間可以互相鏈接，不同分類下文章頁面之間一般不直接鏈接，可以通過設置關鍵字來鏈接.

3 網(wǎng)站導航系統(tǒng)的設計方法

3.1 全局導航

全局導航即主導航，在網(wǎng)站中以一級欄目的菜單形式出現(xiàn)，位于網(wǎng)頁的主要位置頂端或左側(cè)，引導用戶對網(wǎng)站進行瀏覽.網(wǎng)站的類型不同，一級欄目的多少不同，設計風格也不同.例如，“hao123網(wǎng)址大全”，是權威的中文上網(wǎng)導航，收錄了音樂、小說、影視、游戲等分類的網(wǎng)址和內(nèi)容，欄目較多，分類較細.“網(wǎng)易” 推出了門戶網(wǎng)站、電子郵箱、在線游戲、在線教育、在線音樂、電子商務等多種服務，主導航欄目也較多，如圖2所示.

圖2 “網(wǎng)易”的主導航形式

3.2 局部導航

局部導航是對主導航的補充，是網(wǎng)站的二級或者三級欄目，同主導航一起實現(xiàn)網(wǎng)站的架構(gòu)，完成頁面的跳轉(zhuǎn).它主要位于網(wǎng)頁的左側(cè)或右側(cè)，適用于“T”字形或“國”字形的網(wǎng)頁框架結(jié)構(gòu)；或采用主導航鼠標經(jīng)過的下拉菜單形式來實現(xiàn).

3.3 文字導航

最好使用文字導航，比起圖片和flash鏈接，文字導航能讓搜索引擎快速收錄.導航系統(tǒng)的鏈接是搜索引擎收錄網(wǎng)站的最重要的內(nèi)部鏈接.

3.4 面包屑導航

對于大中型網(wǎng)站，通常使用面包屑導航.面包屑導航的作用是告訴瀏覽者他們目前在網(wǎng)站中的位置以及如何返回，是通過改變字體的顏色和大小來提示瀏覽者目前所在的網(wǎng)站位置，并且向瀏覽者提供歷史瀏覽路徑及返回的鏈接.

面包屑導航可以用于判斷頁面在整個網(wǎng)站中的位置，架構(gòu)比較清晰.它直接反映網(wǎng)站的目錄結(jié)構(gòu)，可以減少網(wǎng)站內(nèi)部的“迷航”現(xiàn)象.如圖3所示.

圖3 面包屑導航樣式

面包屑導航的實現(xiàn)方式為：首先，通過最后一個節(jié)點標簽，提示用戶在網(wǎng)站的當前位置，例如圖3的“愛情”；其次，整體從左到右是用戶瀏覽到此位置的路徑，例如圖3“玫瑰花首頁>花情花語>愛情>”；最后，除當前頁面節(jié)點標簽外，其他節(jié)點標簽均可點擊鏈接文字，回到上一級或某級的位置，直至回到訪問網(wǎng)站的最初位置，例如網(wǎng)站首頁.有了這些標簽提示，瀏覽者就不會在網(wǎng)站的諸多信息中迷失了.

3.5 搜索引擎方式的導航

網(wǎng)站的用戶可以按照關鍵字設計進行信息的搜索.用戶在搜索文本框中輸入關鍵詞，然后點擊搜索按鈕，產(chǎn)生可以訪問的信息列表，瀏覽者可以從列表中選擇內(nèi)容并打開內(nèi)容頁面.搜索引擎的關鍵詞搜索是最有效的導航方式，可以直接定位到瀏覽者的目的頁面上.

綜合網(wǎng)站導航的設計一般為多種方法相結(jié)合，為用戶提供全面的服務.導航設計的創(chuàng)意是無限的，任何樣式，只要符合導航設計的原則，就可以實現(xiàn)導航的功能.

網(wǎng)站導航系統(tǒng)就像大廈的地基一樣，體現(xiàn)網(wǎng)站的基礎和架構(gòu)，是用戶瀏覽網(wǎng)頁時重要的引導，在網(wǎng)頁設計中占有舉足輕重的地位.

[1] 譚嵐丹.網(wǎng)站設計中導航系統(tǒng)的藝術性[J].大眾文藝,2011(12):80.

[2] 詹晶晶，黃慧琴，劉沛芬.網(wǎng)站導航欄設計的應用心理[J].藝術與設計，2010(12)：62-63.

責任編輯：金 欣

Designing and application of the website navigation system

ZHAO Ai-tao

(Department of Information Technology, Shijiazhuang Vocational Technology Institute, Shijiazhuang, Hebei 050081, China)

This paper expounds the importance of navigation system in website.Site navigation system designing should be man-centered, easy to operate, substantial and characteristic.The designing methods include global, local, text, bread crumbs and search engine navigations.

navigation system; website; design

2015-03-26

趙愛濤(1975-)，女，河北石家莊人，石家莊職業(yè)技術學院講師.

1009-4873(2015)04-0037-03

TP393.092

A