網(wǎng)頁設(shè)計—前期準備工作

1、網(wǎng)頁設(shè)計前期準備工作第一節(jié)、客戶需求分析客戶需求 客戶的需求往往是多方面的、不確定的，需要去分析和引導?？蛻舻男枨笫侵竿ㄟ^買賣雙方的長期溝通，對客戶購買產(chǎn)品的欲望、用途、功能、款式進行逐步發(fā)掘，將客戶心里模糊的認識以精確的方式描述并展示出來的過程。 暗示需求和明確需求暗示需求就是客戶對難點、困難、不滿的陳述，明確需求就是客戶對難點、困難、不滿的具體陳述。 研究客戶需求1，首先要圈定明確的客戶群 只有明確的客戶群 才能讓我們很好去研究 2，學會用客戶的語言來描繪產(chǎn)品 3，學會理解客戶的多重身份 4，了解客戶的價值觀 5，理解客戶需求背后的深層次心理需求 6，像客戶一樣體驗，像客戶一樣感知他們的生

2、活世界 1）像客戶一樣看 2）像客戶一樣用 3）像客戶一樣想 去體驗客戶的生活世界，而不是客觀世界。只有這樣，才能像有經(jīng)驗的銷售那樣，能見到什么人說什么話。 客戶需求分析的作用：有助于我們網(wǎng)站內(nèi)容的組織，設(shè)計風格的確定、頁面的設(shè)計等。第二節(jié)、網(wǎng)站風格定位一、色彩色彩的使用在網(wǎng)頁制作中起著非常關(guān)鍵的作用，網(wǎng)頁的色彩是樹立網(wǎng)站形象的關(guān)鍵之一，有很多網(wǎng)站以其成功的色彩搭配令人過目不忘。色彩總的應用原則應該是“總體協(xié)調(diào)，局部對比”，即主頁的整體色彩效果應該是和諧的，只有局部的、小范圍的地方可以有一些強烈色彩的對比。下面來談談網(wǎng)頁的色彩搭配。網(wǎng)頁制作用彩色還是非彩色好呢？根據(jù)專業(yè)的研究機構(gòu)表明：彩色的記

3、憶效果是黑白的倍。也就是說，在一般情況下，彩色頁面比完全黑白頁面更加吸引人。我們通常的做法是：主要內(nèi)容文字用非彩色（黑色），邊框、背景、圖片用彩色，這樣頁面整體不單調(diào)，看主要內(nèi)容也不會眼花。將色彩按“紅黃綠藍紅”依次過度漸變，就可以得到一個色彩環(huán)。色環(huán)的兩端是暖色和冷色，中間是中性色。色彩有冷暖色之分，冷色（如藍色）給人的感覺是安靜、冰冷；而暖色（如紅色）給人的感覺是熱烈、火熱。冷暖色的巧妙運用可以讓網(wǎng)站產(chǎn)生意想不到的效果。 暖色：如圖631（a）中的黃色、橙色、紅色、紫色等都屬于暖色彩列。暖色跟黑色調(diào)和可以達到很好的效果。暖色一般應用于購物類網(wǎng)站、電子商務網(wǎng)站、兒童類網(wǎng)站等，用以體現(xiàn)商品的琳

4、瑯滿目，兒童類網(wǎng)站的活潑、溫馨等效果。 冷色：如圖631（b）中的綠色、藍色、藍紫色等都屬于冷色彩列。冷色一般跟白色調(diào)和可以達到一種很好的效果。冷色一般應用于一些高科技、游戲類網(wǎng)站，主要表達嚴肅、穩(wěn)重等效果。 相近色：色環(huán)中相鄰的三種顏色。如圖631（c）中的黃綠色、黃色和橘黃色。相近色的搭配給人的視覺效果很舒適，很自然，所以相近色在網(wǎng)站設(shè)計中極為常用。 互補色：色環(huán)中相對的兩種色彩。如圖631（d）中的亮綠色和紫色，另外如紅色和綠色，藍色和橙色等?；パa色調(diào)整一下補色的亮度，有時候是一種很好的搭配。補色在網(wǎng)站設(shè)計中用得也極為普遍。網(wǎng)頁色彩的搭配網(wǎng)頁設(shè)計中，色彩永遠是最重要的一部分。當人們距離顯

5、示屏較遠的時候，看到的不是優(yōu)美的版式或者是美麗的圖片，而是網(wǎng)頁的色彩。 使用單色：先選定一種色彩，然后調(diào)整透明度或者飽和度，產(chǎn)生新的色彩，用于網(wǎng)頁。這樣的頁面看起來色彩統(tǒng)一，有層次感。 使用相近色：就是在色帶上相鄰近的顏色，例如綠色和藍色，紅色和黃色就互為鄰近色。采用鄰近色設(shè)計網(wǎng)頁可以使網(wǎng)頁避免色彩雜亂，易于達到頁面的和諧統(tǒng)一。 使用互補色：對比色可以突出重點，產(chǎn)生強烈的視覺效果，通過合理使用對比色能夠使網(wǎng)站特色鮮明、重點突出。在設(shè)計時一般以一種顏色為主色調(diào)，對比色作為點綴，可以起到畫龍點睛的作用。 背景色的使用：背景色一般采用素淡清雅的色彩，避免采用花紋復雜的圖片和純度很高的色彩作為背景色，

6、同時背景色要與文字的色彩對比強烈一些。 色彩的數(shù)量：網(wǎng)站用色并不是越多越好，對于初學者來說，網(wǎng)頁用色最好控制在三種色彩以內(nèi)，通過調(diào)整色彩的各種屬性來產(chǎn)生變化。下列色彩組合較易使版面醒目：黑白，藍白，黑灰白，藍黑，紫黃。步驟1確定網(wǎng)站的色調(diào) 從視覺角色主次位置把網(wǎng)站色調(diào)分為主色調(diào)、輔色調(diào)、點睛色和背景色，如圖632所示網(wǎng)頁配色實施步驟 主色調(diào)：頁面色彩的主要色調(diào)、總趨勢，其他配色不能超過該主要色調(diào)的視覺面積（背景白色不一定根據(jù)視覺面積決定，可以根據(jù)頁面的感覺需要）。 輔色調(diào)：僅次于主色調(diào)的視覺面積的輔助色，是烘托主色調(diào)、支持主色調(diào)、起到融合主色調(diào)效果的輔助色調(diào)。 點睛色：在小范圍內(nèi)點上強烈的顏色

7、來突出主題效果，使頁面更加鮮明生動。 背景色：襯托環(huán)抱整體的色調(diào)，協(xié)調(diào)、支配整體的作用。一個頁面的色彩角色主要是根據(jù)其面積的大小來區(qū)別主次關(guān)系，達到最終目的的。當不同的顏色使用的面積相當，這個頁面容易呈現(xiàn)枯燥單調(diào)之感，而沒有局部細節(jié)的變化。當一個頁面使用的色彩過多、面積大小用得過于瑣碎，這個頁面容易出現(xiàn)花哨、主次不分、沒有整體的感覺。 紅色：紅色是強有力的色彩，是熱烈、沖動的色彩。瑞士畫家、理論家和色彩家約翰伊頓教授描繪了受不同色彩刺激的紅色。他說：在深紅的底子上，紅色平靜下來，熱度在熄滅著；在藍綠色底子上，紅色就像熾烈燃燒的火焰；在黃綠色底子上，紅色變成一種冒失的、莽撞的闖入者，激烈而又尋常

8、；在橙色的底子上，紅色似乎被郁積著，暗淡而無生命，好像焦干了似的。 步驟2色彩的象征感情 橙色：橙色的波長僅次于紅色，因此它也具有長波長導致的特征：使脈搏加速，并有溫度升高的感受。橙色是十分活潑的光輝色彩，是暖色系中最溫暖的色彩，它使人們聯(lián)想到金色的秋天，豐碩的果實，因此是一種富足的、快樂而幸福的色彩。橙色稍稍混入黑色或白色，會成為一種穩(wěn)重、含蓄有明快的暖色，但混入較多的黑色后，就成為一種燒焦的色彩，橙色中加入較多的白色會帶有一種甜膩的味道。橙色與藍色的搭配，構(gòu)成了最響亮、最歡快的色彩。 黃色：黃色是亮度最高的色彩，在高明度下能夠保持很強的純度。黃色有著太陽般的光輝，因此象征著照亮黑暗的智慧之

9、光；黃色有著金色的光芒，因此又象征著財富和權(quán)利，它是驕傲的色彩。黑色或紫色的襯托可以使黃色達到力量無限擴大的強度。白色能夠吞沒黃色銳利的光芒，淡淡的粉紅色可以像美麗的少女一樣將黃色這驕傲的王子征服。 綠色：鮮艷的綠色非常美麗、優(yōu)雅，特別是純綠色，是很漂亮的顏色。綠色很寬容、大度，無論藍色還是黃色滲入，仍舊十分美麗。黃綠色單純、年輕；藍綠色清秀、豁達。含灰的綠色，也是一種寧靜、平和的色彩，就像暮色中的森林或晨霧中的田野那樣 藍色：藍色是博大的色彩，天空和大海最遼闊的景色都呈蔚藍色，無論深藍色還是淡藍色，都會使人們聯(lián)想到無垠的宇宙或流動的大氣，因此，藍色也是永恒的象征。藍色是最冷的色，使人們聯(lián)想到

10、冰川上的藍色投影。藍色在純凈的情況下并不代表感情上的冷漠，它只不過代表一種平靜、理智與純凈而已。真正令人的情感縮到冷酷悲哀的色，是那些被弄混濁的藍色。 紫色：通常人們會覺得有很多種紫色，因為紅色加少許藍色或藍色加少許紅色都會明顯地呈現(xiàn)紫色。所以很難確定標準的紫色。約翰伊頓對紫色做過這樣的描述：紫色是非知覺的色彩，神秘，給人印象深刻，有時給人以壓迫感，并且因?qū)Ρ鹊牟煌?，時而富有威脅性，時而又富有鼓舞性。 黑白：黑色與白色是對色彩的最后抽象，代表色彩世界的陰極和陽極。太極圖案就是黑白兩色的循環(huán)形式來表現(xiàn)宇宙的永恒運動。黑白所具有的抽象表現(xiàn)力以及神秘感，似乎能超越任何色彩的深度。 灰色：灰色具有柔和

11、、高雅的意象，而且屬于中間性格，男女皆能接受，所以灰色也是永遠流行的主要顏色。在許多的高科技產(chǎn)品，尤其是和金屬材料有關(guān)的產(chǎn)品，幾乎都采用灰色來傳達高級、科技的形象。使用灰色時，大多利用不同的層次變化組合或搭配其他色彩，才不會因過于單一、沉悶而產(chǎn)生呆板、僵硬的感覺。 提示黑白是最基本和最簡單的搭配，白底黑字，黑底白字都非常清晰明了?；疑侨f能色，可以和任何彩色搭配，也可以幫助兩種對立的色彩和諧過渡。如果你實在找不出合適的色彩，那么用灰色試試，效果絕對不會太差。步驟3三種以上的色彩搭配一般來說，一個網(wǎng)站的標準色彩不宜超過三種，太多會使人眼花繚亂。如果超過三個顏色，就要注意搭配技巧，使其看起來不花如

12、： 使用純度較高的顏色，搭配純度較低、明度較高的顏色，使各色彩之間比較和諧。 不同色相以及所占不同面積、位置的主次關(guān)系，形成有韻律的視覺音符。 白色背景襯托前景，效果顯得更清爽、明快，整體更統(tǒng)一。 利用了同類色、臨近色、補色之間的關(guān)系，相互調(diào)和了視覺感覺。 白色的框線使各色塊之間整齊、規(guī)律，加上白色的文字，加強了頁面的明快感。 漸變調(diào)和不同色相、不同色塊。 背景色的統(tǒng)一掌控了全局。二、排版(網(wǎng)頁版式規(guī)劃）網(wǎng)頁設(shè)計中版式規(guī)劃是最重要也是最關(guān)鍵的一個步驟，網(wǎng)站的版式規(guī)劃要根據(jù)不同的行業(yè)、不同的主題規(guī)劃最適合的網(wǎng)頁版式。同時還要考慮到以后用dreamweaver布局時的方便性。常用到的版面布局形式有

13、：（教材31頁） (1)骨骼型（分欄式結(jié)構(gòu)）（2）“國”字型布局結(jié)構(gòu)：頁面的頂部和底部各有一個橫向的分欄，中間是豎向分欄，其欄目數(shù)為三個以上，通過上下分欄和兩側(cè)的豎分欄形成一個封閉的矩形框，也可以通過一個矩形的邊框來形成。這種結(jié)構(gòu)有一種聚合的力量，使中間的內(nèi)容更加突出。橫欄式劃分豎欄式劃分國字形結(jié)構(gòu)（3） “同”字型布局結(jié)構(gòu)：與國字型結(jié)構(gòu)類似，不同的只是頁面的底部沒有橫分欄，同樣也可采用邊框來形成。這種結(jié)構(gòu)由于沒有完全封閉，版面的開放性比國字型結(jié)構(gòu)要好一些。整個版面除上部的橫分欄外，以豎向分欄為主體，兼有平安、穩(wěn)定和嚴肅、蓬勃向上的感覺。（4）自由式結(jié)構(gòu)：看上去沒有明顯的矩形分割痕跡，給予設(shè)計

14、者一個自由、開放的設(shè)計空間，設(shè)計者的創(chuàng)意能夠得到充分的發(fā)揮和表現(xiàn)，能夠設(shè)計出更高藝術(shù)水平的頁面。大多用于網(wǎng)站的導入頁，或者首頁。但自由版式的頁面布局要復雜一些，需要利用表格中大小不等的矩形單元格來進行無縫拼貼，才能形成一個完整的自由圖形。同字形結(jié)構(gòu)自由版式三、定位網(wǎng)站CI形象CI形象是借用的廣告術(shù)語。(CI是英文corporate identity的縮寫)，意思是通過視覺來統(tǒng)一企業(yè)的形象。企業(yè)一般都要通過CI形象的策劃來提高知名度，它是一種營銷戰(zhàn)略。一個網(wǎng)站，和實體公司一樣，也需要整體的形象包裝和定位準確的、有創(chuàng)意的CI 設(shè)計，這樣對網(wǎng)站 的宣傳推廣有事半功倍的效果。網(wǎng)站主題和名稱定下來之后，

15、需要思考的就是網(wǎng)站的CI形象設(shè)計。網(wǎng)站的CI形象設(shè)計和企 業(yè)的CI形象設(shè)計的內(nèi)容相似，主要包括：1、網(wǎng)站logo設(shè)計即網(wǎng)標。和商品的商標、企業(yè)的標志一樣，網(wǎng)標是站點特色和內(nèi)涵的集中體現(xiàn)，看見它就讓人聯(lián)想到它所代表的站點。如新浪網(wǎng)的網(wǎng)標就體現(xiàn)出新浪網(wǎng)的快捷、準確、精華的特色。 標志圖形可以只由中文、英文字母構(gòu)成，也可以只由符號、圖案（動物、植物、人物、幾何）構(gòu)成，還可以由文字和圖形構(gòu)成。如：新浪用字母sina和眼睛作為標志。標志的設(shè)計創(chuàng)意來自網(wǎng)站的名稱和內(nèi)容。設(shè)計方法：1）以用與網(wǎng)站名稱相關(guān)的人物，動物，花草等作為設(shè)計的主體對象，通過抽象、概括、變形等手法，使之藝術(shù)化、標志化，如迪斯尼的米老鼠、

16、搜狐的卡通狐貍等。2）專業(yè)性較強的網(wǎng)站，可以以本專業(yè)有代表的物品作為設(shè)計的主體對象。如中國銀行的古錢標志、奔馳汽車的方向盤標志等。3) 最常用和最簡單的方式，是用網(wǎng)站的英文名稱的字體作為設(shè)計的主體對象，用不同的字體、字母的變形及字母的組合，使之藝術(shù)化、標志化。用網(wǎng)站的英文名稱的字體作為設(shè)計的主體對象，用不同的字體、字母的變形及字母的組合，使之藝術(shù)化、標志化運動2. 設(shè)計網(wǎng)站的標準色彩網(wǎng)站給人的第一印象來自視覺的沖擊感，確定網(wǎng)站的標準色彩是相當重要的一步。不同的色彩搭配會產(chǎn)生不同的效果，并可能影響到訪問者的情緒?！皹藴噬省笔侵改荏w現(xiàn)網(wǎng)站形象和延伸內(nèi)涵的色彩。如：IBM的深藍色、肯德基的紅色條型

17、、Windows視窗標志上的紅、藍、黃、綠色等。一般來說，一個網(wǎng)站的標準色彩不宜超過三種，太多會使人眼花繚亂。標準色彩要用于網(wǎng)站的標志、標題、主菜單和主色塊，給人以整體統(tǒng)一的感覺。標準色之外的其它色彩也可以使用，只是作為點綴和襯托，不能大面積使用，以免影響整體感。網(wǎng)頁色彩搭配的技巧（1） 采用一種顏色。這里是指先選定一種顏色，然后調(diào)整透明度或者飽和度，(即將色彩變淡或加深)，產(chǎn)生新的色彩，用于網(wǎng)頁。這樣的頁面看起來色彩統(tǒng)一，有層次感。（2） 選用兩種顏色。即先選定一種顏色，然后選擇它的同類色(在色相環(huán)里鄰近的色)。這樣的搭配，使整個頁面色彩豐富，但不會顯花亂。（3） 選用一類色。就是用一個感覺

18、的色彩，例如淡藍、淡黃、淡綠；或者土黃、土灰、土藍。這樣，使人有一個整體感。（4） 用黑色和一種彩色。比如大紅的字體配黑色的邊框感覺就會很醒目。3. 設(shè)計網(wǎng)站的標準字體 和標準色彩一樣，標準字體是指用于標志、標題、主菜單的特有字體。網(wǎng)頁默認的字體是宋體。為了體現(xiàn)站點的特有風格，可以根據(jù)需要選擇一些特殊的字體。如，為了體現(xiàn)專業(yè)性，可以使用粗仿宋體；體現(xiàn)藝術(shù)性可以用廣告體；體現(xiàn)親切隨意可以用手寫體等。也可以根據(jù)網(wǎng)站所表達的內(nèi)涵，選擇更貼切的字體。目前常見的中文字體有二三十種，常見的英文字體有近百種，網(wǎng)絡(luò)上還有許多專用的藝術(shù)字體下載，但要找到一種和網(wǎng)頁內(nèi)容相符的字體，也不是一件容易的事。嚴格的講，標

19、準字體是要經(jīng)過設(shè)計加工的字體，是獨一無二的字體，是不能從任何字庫里直接任意選用的字體，所以，標準字體最好是根據(jù)網(wǎng)站的內(nèi)容專門設(shè)計的字體，這種字體最好用圖片的形式在網(wǎng)頁上出現(xiàn)。 4. 設(shè)計網(wǎng)站的宣傳標語 網(wǎng)站的宣傳標語，就是把網(wǎng)站的精神、目標用一句話或一個詞來高度概括。類似生活中的廣告語。如鵲巢的“味道好極了”、麥斯威爾的“好東西和好朋友一起分享”、Intel的“給你一個奔騰的心”等。 網(wǎng)站的標志、色彩、字體和標語，是一個網(wǎng)站樹立CI形象的關(guān)鍵，也是一個網(wǎng)站檔次高低的直接體現(xiàn)，所以，定位網(wǎng)站的CI形象，最好要有藝術(shù)設(shè)計人員參與。四、規(guī)劃網(wǎng)站1、版塊（頻道）劃分2、欄目確定4、目錄結(jié)構(gòu)和鏈接關(guān)系3

20、、網(wǎng)站的層次結(jié)構(gòu)設(shè)計1、版塊（頻道）劃分把網(wǎng)站的內(nèi)容按照一定的邏輯關(guān)系分類，形成網(wǎng)站的內(nèi)容版塊。可按照內(nèi)容的屬性、內(nèi)容的媒體形式、等進行分類，分類的依據(jù)和邏輯關(guān)系要讓瀏覽者一目了然，這樣瀏覽者根據(jù)版塊結(jié)構(gòu)就知道網(wǎng)站整體內(nèi)容結(jié)構(gòu)，明白了是否有他需要的信息以及應該在哪個版塊去瀏覽他需要的信息。返回版塊劃分應該注意的問題： （1）版塊的數(shù)目不宜太多 網(wǎng)站的版塊并非越多、分得越細就越好，只要分類明確，應該盡可能少一些。一方面分得過細顯得結(jié)構(gòu)不緊湊，另一方面通常版塊信息要帶到它的下級的各個欄目中，要占掉非常寶貴的屏幕空間。 （2）給版塊起一個好的名稱 版塊的名稱是該版塊內(nèi)容的綜合體現(xiàn)，一要看它是否能體現(xiàn)

21、出版塊內(nèi)容；二是準確沒有歧義；三是字數(shù)要少，要簡練，并且各版塊名稱的字數(shù)最好一致；四要通俗易懂。 （3）版塊要獨立 版塊間沒有包容關(guān)系；版塊間沒有交叉關(guān)系（例如：娛樂和觀看電影包容關(guān)系 美女和影星交叉關(guān)系）返回2、欄目確定網(wǎng)站內(nèi)容在版塊之下再分欄目，如果內(nèi)容很多，還可以在一級欄目之下再分二級欄目，就像書的章下面分節(jié)，節(jié)下面再分點一樣。欄目的級數(shù)不宜太多，一般不超過三級。欄目級數(shù)越多，網(wǎng)站的結(jié)構(gòu)就越深，瀏覽者要通過多次點擊才能看到，這是瀏覽者不愿意的。欄目是版塊內(nèi)容和功能的具體體現(xiàn)，除信息內(nèi)容欄目外，還有一些功能欄目，如“在線留言、下載專區(qū)等“一般的個人站點內(nèi)容少，只有主欄目(主菜單)就夠了，不

22、需要設(shè)置版塊。如果你覺得的確有必要設(shè)置版塊的，應該注意1.各版塊要有相對獨立性。2.各版塊要有相互關(guān)聯(lián)。3.版塊的內(nèi)容要圍繞站點主題。關(guān)于版塊方面，主要是門戶站點等較大網(wǎng)站需要考慮的問題返回一般的網(wǎng)站欄目安排要注意以下幾方面:(1).一定記住要緊扣你的主題!一般的做法是:將你的主題按一定的方法分類并將它們作為網(wǎng)站的主欄目。例如制作一個發(fā)布動畫的網(wǎng)站，可以將欄目分為動物動畫，標志動畫，三維動畫，卡通動畫等，在首頁上標明最近更新的動畫。記住:主題欄目個數(shù)在總欄目中要占絕對優(yōu)勢，這樣的網(wǎng)站顯的專業(yè)，主題突出，容易給人留下深刻印象。 (2).設(shè)一個最近更新或網(wǎng)站指南欄目如果你的首頁沒有安排版面放置最近

23、更新內(nèi)容信息，就有必要設(shè)立一個“最近更新”的欄目。這樣做是為了照顧常來的訪客，讓你的主頁更有人性化。如果你的主頁內(nèi)容龐大(超過15MB)，層次較多，而又沒有站內(nèi)的搜索引擎，建議您設(shè)置“本站指南”欄目?？梢詭椭踉L者快速找到他們想要的內(nèi)容。(3).設(shè)定一個可以雙向交流的欄目不需要很多，但一定要有。比如論壇，留言本，郵件列表等，可以讓瀏覽者留下他們的信息。有調(diào)查表明，提供雙向交流的站點比簡單的留一個Email me的站點更具有親和力。(4).設(shè)一個下載或常見問題回答欄目網(wǎng)絡(luò)的特點是信息共享。如果你看到一個站點有大量的優(yōu)秀的有價值的資料，你肯定希望能一次性下載，而不是一頁一頁瀏覽存盤?！皩⑿谋刃摹痹?/p>

24、你自己的主頁上設(shè)置一個資料下載欄目，會得到大家的喜歡。有些站點為了廣告顯示量，一篇文章還要分幾頁顯示，我覺得遲早會因訪問量下降而淘汰(個人意見:)。另外，如果您的站點經(jīng)常收到網(wǎng)友關(guān)于某方面的問題來信，你最好設(shè)立一個常見問題回答的欄目，既方便了網(wǎng)友，也可以節(jié)約自己更多時間用以學習。至于其他的輔助內(nèi)容，如關(guān)于本站，版權(quán)信息等可以不放在主欄目里，以免沖淡主題?？偨Y(jié)以上幾點，我們得出劃分欄目需要注意的是:盡可能刪除與主題無關(guān)的欄目盡可能將網(wǎng)站最有價值的內(nèi)容列在欄目上盡可能方便訪問者的瀏覽和查詢返回搜狐網(wǎng)站的頻道與位置頁面底欄信息內(nèi)容網(wǎng)頁中不同的信息欄目第一級欄目第二級欄目第三級欄目欄目的級數(shù)不宜太多，

25、一般不要超過3級。點擊第二個版塊“吃喝”返回首頁企業(yè)情報版塊企業(yè)情報版塊關(guān)于麥當勞返回3、網(wǎng)站的層次結(jié)構(gòu)設(shè)計返回4、目錄結(jié)構(gòu)和鏈接關(guān)系(1).網(wǎng)站的目錄結(jié)構(gòu)網(wǎng)站的目錄是指在建立網(wǎng)站定義站點時創(chuàng)建的目錄，如有類似“myweb”的根目錄和“myhome”的子目錄。目錄的結(jié)構(gòu)是一個很容易忽略的問題，目錄結(jié)構(gòu)的好壞，對瀏覽者來說并沒有什么太大的感覺，但是對于站點本身的上傳維護、內(nèi)容未來的擴充和移植有著重要的影響。如建立E:/mywebmyhomefonts、images等較清晰的目錄，就便于網(wǎng)站的管理和維護。建立目錄結(jié)構(gòu)的一些建議： 不要將所有文件都存放在根目錄下有學生為了方便，將所有文件都放在根目錄

26、下。這樣做造成的不利影響在于： 1.文件管理混亂。你常常搞不清哪些文件需要編輯和更新，哪些無用的文件可以刪除， 哪些是相關(guān)聯(lián)的文件，影響工作效率。 2.上傳速度慢。服務器一般都會為根目錄建立一個文件索引。當您將所有文件都放在 根目錄下，那么即使你只上傳更新一個文件，服務器也需要將所有文件再檢索一遍，建立新 的索引文件。很明顯，文件量越大，等待的時間也將越長。 所以，給您的建議是：盡可能減少根目錄的文件存放數(shù)。 按欄目內(nèi)容建立子目錄。 子目錄的建立，首先按主菜單欄目建立。例如:網(wǎng)頁教程類站點可以根據(jù)技術(shù)類別分別建立相應的目錄，象Flash,Dhtml,javascript等；企業(yè)站點可以按公司簡

27、介，產(chǎn)品介紹，價格， 在線定單，反饋聯(lián)系等建立相應目錄。 其他的次要欄目，類似whats new，友情連接內(nèi)容較多，需要經(jīng)常更新的可以建立獨立的 子目錄。而一些相關(guān)性強，不需要經(jīng)常更新的欄目，例如：關(guān)于本站，關(guān)于站長，站點經(jīng)歷等 可以合并放在一個統(tǒng)一目錄下。 所有程序一般都存放在特定目錄。例如：CGI程序放在cgi-bin目錄。便于維護管理。所有 需要下載的內(nèi)容也最好放在一個目錄下。 在每個主目錄下都建立獨立的images目錄。默認的，一個站點根目錄下都有一個images目錄。剛開始學習主頁制作時，習慣將所有圖片都存放在這個目錄里?？墒呛髞戆l(fā)現(xiàn)很不方便，當我需要將某個主欄目打包供網(wǎng)友下載，或

28、者將某個欄目刪除時，圖片的管理相當麻煩。經(jīng)過實踐發(fā)現(xiàn)：為每個主欄目建立一個獨立的 images目錄是最方便管理的。而根目錄下的images目錄只是用來放首頁和一些次要欄目的圖片。 目錄的層次不要太深目錄的層次建議不要超過3層。原因很簡單，維護管理方便。 其它需要注意的還有： 1.不要使用中文目錄；網(wǎng)絡(luò)無國界，使用中文目錄可能對網(wǎng)址的正確顯示造成困難。 2.不要使用過長的目錄；盡管服務器支持長文件名，但是太長的目錄名不便于記憶。 3.盡量使用意義明確的目錄；上面的例子中，你可以用Flash,Dhtml,javascript來建立目錄， 也可以用1，2，3建立目錄，但是哪一個更明確，更便于記憶和管理呢？顯然是前者！ 隨著網(wǎng)頁技術(shù)的不斷發(fā)展，利用數(shù)據(jù)庫或者其他后臺程序自動生成網(wǎng)頁越來越普遍，網(wǎng)站的 目錄結(jié)構(gòu)也必將飛躍