DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> WEB網站前端 >> 關於網頁技巧 >> 網站設計思考:網站的目錄結構和鏈接結構
網站設計思考:網站的目錄結構和鏈接結構
編輯:關於網頁技巧     

  今天我們來討論“確定網站的目錄結構和鏈接結構”。

  一.網站的目錄結構

  網站的目錄是指你建立網站時創建的目錄。例如:在用frontpage98建立網站時都默認建立了根目錄和images子目錄。目錄的結構是一個容易忽略的問題,大多數站長都是未經規劃,隨意創建子目錄。目錄結構的好壞,對浏覽者來說並沒有什麼太大的感覺,但是對於站點本身的上傳維護,內容未來的擴充和移植有著重要的影響。下面是建立目錄結構的一些建議:

  ●不要將所有文件都存放在根目錄下。

  有網友為了方便,將所有文件都放在根目錄下。這樣做造成的不利影響在於:

  1.文件管理混亂。你常常搞不清哪些文件需要編輯和更新,哪些無用的文件可以刪除,哪些是相關聯的文件,影響工作效率。

  2.上傳速度慢。服務器一般都會為根目錄建立一個文件索引。當您將所有文件都放在根目錄下,那麼即使你只上傳更新一個文件,服務器也需要將所有文件再檢索一遍,建立新的索引文件。很明顯,文件量越大,等待的時間也將越長。所以,給您的建議是:盡可能減少根目錄的文件存放數。

  ●按欄目內容建立子目錄。

  子目錄的建立,首先按主菜單欄目建立。例如:網頁教程類站點可以根據技術類別分別建立相應的目錄,象Flash,Dhtml,Javascript等;企業站點可以按公司簡介,產品介紹,價格,在線定單,反饋聯系等建立相應目錄。

  其他的次要欄目,類似what's new,友情連接內容較多,需要經常更新的可以建立獨立的子目錄。而一些相關性強,不需要經常更新的欄目,例如:關於本站,關於站長,站點經歷等可以合並放在一個統一目錄下。

  所有程序一般都存放在特定目錄。例如:CGI程序放在cgi-bin目錄。便於維護管理。所有需要下載的內容也最好放在一個目錄下。

  ●在每個主目錄下都建立獨立的images目錄。

  默認的,一個站點根目錄下都有一個images目錄。剛開始學習主頁制作時,阿捷習慣將所有圖片都存放在這個目錄裡。可是後來發現很不方便,當我需要將某個主欄目打包供網友下載,或者將某個欄目刪除時,圖片的管理相當麻煩。經過實踐發現:為每個主欄目建立一個獨立的images目錄是最方便管理的。而根目錄下的images目錄只是用來放首頁和一些次要欄目的圖片。

  ●目錄的層次不要太深。

  目錄的層次建議不要超過3層。原因很簡單,維護管理方便。

  其它需要注意的還有:

  1.不要使用中文目錄;網絡無國界,使用中文目錄可能對網址的正確顯示造成困難。

  2.不要使用過長的目錄;盡管服務器支持長文件名,但是太長的目錄名不便於記憶。

  3.盡量使用意義明確的目錄;上面的例子中,你可以用Flash,Dhtml,Javascript來建立目錄,也可以用1,2,3建立目錄,但是哪一個更明確,更便於記憶和管理呢?顯然是前者!

  隨著網頁技術的不斷發展,利用數據庫或者其他後台程序自動生成網頁越來越普遍,網站的目錄結構也必將飛躍到一個新的結構層次。

  二.網站的鏈接結構

  網站的鏈接結構是指頁面之間相互鏈接的拓撲結構。它建立在目錄結構基礎之上,但可以跨越目錄。形象的說:每個頁面都是一個固定點,鏈接則是在兩個固定點之間的連線。一個點可以和一個點連接,也可以和多個點連接。更重要的是,這些點並不是分布在一個平面上,而是存在於一個立體的空間中。

  ●我們研究網站的鏈接結構的目的在於:用最少的鏈接,使得浏覽最有效率。

  一般的,建立網站的鏈接結構有兩種基本方式:

  1.樹狀鏈接結構(一對一)。類似DOS的目錄結構,首頁鏈接指向一級頁面,一級頁面鏈接指向二級頁面。立體結構看起來就象蒲公英。這樣的鏈接結構浏覽時,一級級進入,一級級退出。優點是條理清晰,訪問者明確知道自己在什麼位置,不會"迷"路。缺點是浏覽效率低,一個欄目下的子頁面到另一個欄目下的子頁面,必須繞經首頁。

  2.星狀鏈接結構(一對多)。類似網絡服務器的鏈接,每個頁面相互之間都建立有鏈接。立體結構象東方明珠電視塔上的鋼球。這種鏈接結構的優點是浏覽方便,隨時可以到達自己喜歡的頁面。缺點是鏈接太多,容易使浏覽者迷路,搞不清自己在什麼位置,看了多少內容。

  這兩種基本結構都只是理想方式,在實際的網站設計中,總是將這兩種結構混合起來使用。我們希望浏覽者既可以方便快速的達到自己需要的頁面,又可以清晰的知道自己的位置。所以,最好的辦法是:

  ●首頁和一級頁面之間用星狀鏈接結構,一級和二級頁面之間用樹狀鏈接結構。

  舉個例子。一個新聞站點的頁面結構如下:

  ---------------------------------------------------

  一級頁面 二級頁面

  財經新聞頁 -- [財經新聞1,財經新聞2...]

  / |

  首頁 -- 娛樂新聞頁 -- [娛樂新聞1,娛樂新聞2...]

  / |

  IT新聞頁 -- [IT新聞1,IT新聞2...]

  ----------------------------------------------------

  其中,首頁,財經新聞頁,娛樂新聞頁,IT新聞頁之間是星狀鏈接,可以互相點擊,直接到達。而財經新聞頁和它的子頁面之間是樹狀連接,浏覽財經新聞1後,你必須回到財經新聞頁,才能浏覽IT新聞2。所以,有站點為了免去返回一級頁面的麻煩,將二級頁面直接用新開窗口(POP up windows)打開,浏覽結束後關閉即可。

  注意:以上我們都是用的三級頁面舉例。如果您的站點內容龐大,分類明細,需要超過三級頁面,那麼建議你在頁面裡顯示導航條,可以幫助浏覽者明確自己所處的位置。就是您經常看到許多網站頁面頂部的,類似這樣:“您現在的位置是:首頁->財經新聞->股市信息->深圳股->深發展”

  關於鏈接結構的設計,在實際的網頁制作中是非常重要一環。采用什麼樣的鏈接結構直接影響到版面的布局。例如你的主菜單放在什麼位置,是否每頁都需要放置,是否需要用分幀框架,是否需要加入返回首頁的鏈接。在連接結構確定後,再開始考慮鏈接的效果和形式,是采用下拉表單,還是用DHTML動態菜單等等。

  隨著電子商務的推廣,網站競爭的越來越激烈,對鏈接結構設計的要求已經不僅僅局限於可以方便快速的浏覽,更加注重個性化和相關性。例如,一個愛嬰主題網站裡,在8個月嬰兒的營養問題頁面上,你需要加入8個月嬰兒的健康問題鏈接,智力培養鏈接,或者是有關奶粉宣傳的鏈接,一本圖書,一個玩具的鏈接。因為父母不可能到每個欄目下去尋找關於8個月嬰兒的信息,他們可能在找到需要的問

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