1 引言隨著Internet 的誕生和發(fā)展，許多人不再僅僅局限于網(wǎng)上沖浪，而是參與到網(wǎng)站建設(shè)中。企業(yè)建站相當(dāng)于在網(wǎng)上建立一個(gè)家，你就可以在這里向客戶介紹你的企業(yè)，展示你的實(shí)力，推銷你的產(chǎn)品，網(wǎng)頁(yè)制作作

1 引言隨著Internet 的誕生和發(fā)展，許多人不再僅僅局限于網(wǎng)上沖浪，而是參與到網(wǎng)站建設(shè)中。企業(yè)建站相當(dāng)于在網(wǎng)上建立一個(gè)家，你就可以在這里向客戶介紹你的企業(yè)，展示你的實(shí)力，推銷你的產(chǎn)品，網(wǎng)頁(yè)制作作為網(wǎng)站制作中一個(gè)重要的環(huán)節(jié)，相對(duì)于傳統(tǒng)的平面設(shè)計(jì)而言，網(wǎng)頁(yè)設(shè)計(jì)具有更多的新穎性，更多可以表現(xiàn)的手法。結(jié)合本人的實(shí)習(xí)過(guò)程，現(xiàn)就網(wǎng)站建設(shè)與管理過(guò)程中，網(wǎng)頁(yè)設(shè)計(jì)與制作的具體經(jīng)歷，包括：網(wǎng)頁(yè)設(shè)計(jì)與制作過(guò)程中的網(wǎng)頁(yè)布局、色彩構(gòu)置，框架結(jié)構(gòu)等相關(guān)事項(xiàng)做以下論述。長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 2 第一章需求分析 1.1 性能需求 Dreamweaver8.0 要求的運(yùn)行環(huán)境 1． CPU P3-800 2．內(nèi)存256MB 3．硬盤剩余空間1.8GB 4．顯示器分辨率1024×768 5．16 位視頻卡。 6．軟件WINDOWS2000/XP 當(dāng)前的開發(fā)環(huán)境（硬件、軟件） 1．CPU AMD Arhlon(tm) 64 ×2 dual Core Processor TK-57 2．內(nèi)存1GB 3．硬盤剩余空間20GB 4．顯示器分辨率1280×800 5．顯示卡 ATI Redeon X1250 7．軟件WINDOWS XP 1.2 開發(fā)工具的介紹 1.2.1 夢(mèng)幻網(wǎng)頁(yè)的編織者------Dreamweaver8.0 Dreamweaver 是創(chuàng)建和管理網(wǎng)頁(yè)的專業(yè)化可視編輯器。使用Dreamweaver 可以輕松創(chuàng)建跨平臺(tái)、跨瀏覽器的頁(yè)面。Macromedia 的Roundtrip HTML 技術(shù)允許用戶隨意導(dǎo)入 HTML 文檔而無(wú)需重新設(shè)置代碼格式。 Dreamweaver 可以為用戶做到：使用動(dòng)態(tài)HTML 功能（例如具有動(dòng)態(tài)效果的層和行為）而不用寫一行代碼。它甚至還可以檢查用戶的工作成果在所有流行的平臺(tái)和瀏覽器中可能發(fā)生的錯(cuò)誤。長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 3 Dreamweaver 還是一個(gè)可以完全自定義的應(yīng)用程序。用戶可以創(chuàng)建自己的對(duì)象和命令修改菜單和快捷鍵，甚至編寫JavaScript 代碼擴(kuò)展Dreamweaver 的行為和屬性檢查器。至于Dreamweaver 工作區(qū)是非常靈活的，因此它可以適應(yīng)各種不同的工作風(fēng)格和使用水平。常用的Dreamweaver 工作區(qū)組件有以下若干種： (1) 文檔窗口可顯示當(dāng)前文檔，文檔的外觀和瀏覽器中看到的非常相似。 (2) 裝載器中包含一些打開和關(guān)閉常用檢查器和模板的按鈕。 (3) 對(duì)象工具欄包含創(chuàng)建不同類型的對(duì)象（例如圖象、表格和層等）

的按鈕。 (4) 屬性檢查器顯示選定對(duì)象的屬性。 (5) 快捷菜單可以使用戶對(duì)當(dāng)前選擇或區(qū)域快速執(zhí)行某些命令。 (6) 可固定的浮動(dòng)工具欄允許用戶將浮動(dòng)窗口、檢查器和工具欄組合在一個(gè)或多個(gè)選擇窗口中 1.2.2 網(wǎng)頁(yè)動(dòng)畫的制作軟件----Micromedia Flash 8.0 Micromedia Flash 8.0 用于web 站點(diǎn)的交互式的矢量圖形和動(dòng)畫的制作，它可制作出用于瀏覽時(shí)的導(dǎo)航控制、制作動(dòng)畫圖標(biāo)、帶同步聲音的大段的動(dòng)畫，創(chuàng)建出生動(dòng)的富于表現(xiàn)力的網(wǎng)頁(yè)。Flash 中的圖形都是矢量的，占據(jù)存儲(chǔ)空間較少，因而下載時(shí)間短，且能很好地適應(yīng)瀏覽者不同尺寸的屏幕。 Flash 的交互性的大部分設(shè)置就在 Action 和 Fs Command 里，通過(guò)對(duì) Action 和 Fs Command 的設(shè)置，你可以隨意的設(shè)置各事件發(fā)生的效果，還有對(duì)變量及函數(shù)的設(shè)置。

1.2.3 JavaScript JavaSript 是一種基于對(duì)象(Object)和事件驅(qū)動(dòng)(Event Driven) 并具有安全性能的腳本語(yǔ)言。使用它的目的是與HTML 超文本標(biāo)記語(yǔ)言、Java 腳本語(yǔ)言（Java 小程序）一起實(shí)現(xiàn)在一個(gè)Web 頁(yè)面中鏈接多個(gè)對(duì)象，與Web 客戶交互作用。從而可以開發(fā)客戶端的應(yīng)用程序等。它是通過(guò)嵌入或調(diào)入在標(biāo)準(zhǔn)的HTML 語(yǔ)言中實(shí)現(xiàn)的。它的出現(xiàn)彌補(bǔ)了HTML 語(yǔ)言的缺陷，它是Java 與HTML 折衷的選擇。 1.2.4 影像與動(dòng)畫的制作軟件—Adobe Photoshop8.0 Photoshop 8.0 是目前最流行的圖形、圖像編輯設(shè)計(jì)軟件，在數(shù)碼影像處理、圖像編輯合成、廣告設(shè)計(jì)、封面設(shè)計(jì)、美術(shù)繪畫、網(wǎng)頁(yè)設(shè)計(jì)等領(lǐng)域都被廣泛地應(yīng)用。 (1) 文字處理更加方便 (2) 增加的圖層集使圖層管理更有序。 (3) 新增圖像功能：圖像的剪切和剪裁更加方便。長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 4 (4) 將所有工具的選項(xiàng)板改進(jìn)為工具選項(xiàng)欄放置在工作區(qū)頂部，方便先項(xiàng)參數(shù)的設(shè)置。 (5) 為了更方便地用路徑繪畫，改進(jìn)增加了幾何形狀工具，通過(guò)選擇工具的不同工作模式，可創(chuàng)建路徑、幾何形狀或幾何填充區(qū)，使得矢量繪圖功能得到了加強(qiáng)。 1.3 網(wǎng)站設(shè)計(jì)的步驟 1．規(guī)劃網(wǎng)站； 2．建立站點(diǎn)及制作頁(yè)面； 3．注冊(cè)域名、租用空間； 4．上傳；推廣及維護(hù) 1.4 網(wǎng)站總體結(jié)構(gòu)設(shè)計(jì)功能模塊圖（層次圖）個(gè)人主頁(yè)主頁(yè)日志相冊(cè)音樂(lè)欣賞小游戲長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì)

5 第二章個(gè)人網(wǎng)站設(shè)計(jì)分析 2.1 相關(guān)術(shù)語(yǔ)及解析 2.1.1 相關(guān)術(shù)語(yǔ)及解釋 1、Internet Internet(英特網(wǎng)) 誕生于上世紀(jì)60 年代，發(fā)展非常慢，到90 年代才開始迅速發(fā)展。現(xiàn)在英特網(wǎng)已經(jīng)是世界上最大的網(wǎng)絡(luò)的，聯(lián)在英特網(wǎng)上的電腦有數(shù)億臺(tái)。上面的資料、信息數(shù)不勝數(shù)，所以有人把英特網(wǎng)叫成是信息的海洋、知識(shí)的海洋。 2、站點(diǎn)所謂站點(diǎn)，就是將網(wǎng)頁(yè)文件和素材文件，有條理地放置站點(diǎn)文件夾里，這些文件與文件夾就構(gòu)成了網(wǎng)站的實(shí)質(zhì)內(nèi)容。站點(diǎn)文件夾里除了網(wǎng)頁(yè)文件還有素材文件，所謂素材就是網(wǎng)頁(yè)中所用到的圖像、聲音、視頻等，這些內(nèi)容是以單獨(dú)文件的形式存在。 3、超鏈接我們?cè)跒g覽網(wǎng)頁(yè)時(shí)，當(dāng)鼠標(biāo)指針指向某段文本或是某個(gè)圖像，鼠標(biāo)指針變成小手狀，單擊鼠標(biāo)可以打開其他的網(wǎng)頁(yè)或是跳轉(zhuǎn)到其他的網(wǎng)站，這就是超鏈接。采用超鏈接技術(shù)可以將不同的網(wǎng)站、網(wǎng)站中的不同網(wǎng)頁(yè)、網(wǎng)頁(yè)中的不同位置彼此串在一起，實(shí)現(xiàn)相互間的跳轉(zhuǎn)，方便信息的瀏覽和查找。人們通過(guò)超鏈接可以很方便很迅速地訪問(wèn)分布于全球計(jì)算機(jī)上的海量資源，實(shí)現(xiàn)在互聯(lián)網(wǎng)中的漫游。超鏈接能使Web 服務(wù)存在廣泛和持久的生命力，超鏈接可以說(shuō)是Web 的靈魂。 4、URL URL（Uniform Resource Locator 的縮寫），統(tǒng)一資源定位器?；ヂ?lián)網(wǎng)中某種信息資源以某種方式存儲(chǔ)在網(wǎng)絡(luò)中的某處，必須用一個(gè)惟一的URL 來(lái)進(jìn)行標(biāo)識(shí)，這樣才能方便查找。對(duì)于Web 來(lái)說(shuō)，可以簡(jiǎn)單并通俗把URL 理解為網(wǎng)址。每個(gè)Web 網(wǎng)頁(yè)都有自己的網(wǎng)址，在瀏覽器地址欄里輸入網(wǎng)頁(yè)的URL ，就可以訪問(wèn)這個(gè)網(wǎng)頁(yè)。例如， http://www.sina.com/index.html，其意思就是采用http 超文本傳輸協(xié)議訪問(wèn)新浪網(wǎng)的首頁(yè)，由于網(wǎng)頁(yè)均是通過(guò)http 超文本傳輸協(xié)議進(jìn)行訪問(wèn)，默認(rèn)下，“http://”可以省略不輸。 5、IP 地址為了使互聯(lián)網(wǎng)上的電腦主機(jī)在通信時(shí)能夠相互識(shí)別，每臺(tái)主機(jī)都分配一個(gè)能表示其位置的IP （Internet Protocol）地址，這如同公用電話網(wǎng)中電話的號(hào)碼一樣。IP 地址是由專門的互聯(lián)網(wǎng)機(jī)構(gòu)來(lái)分配。IP 地址具有惟一性，是由32 位二進(jìn)制數(shù)組成，分為四組，每組8 位，每組之間用小數(shù)點(diǎn)分隔，在實(shí)際之中常轉(zhuǎn)換成十進(jìn)制數(shù)表示。長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 6 2.1.2 個(gè)人網(wǎng)站的由來(lái)和發(fā)展互聯(lián)網(wǎng)

在中國(guó)的出現(xiàn)只有短短七年時(shí)間，1994 年中國(guó)科學(xué)院高能物理研究所設(shè)立了國(guó)內(nèi)第一個(gè)Web 服務(wù)器，推出一個(gè)叫做“中國(guó)之窗”的網(wǎng)頁(yè)，這可能是國(guó)內(nèi)Internet 上出現(xiàn)的第一個(gè)Web 網(wǎng)頁(yè)，1995 年開始，中國(guó)教育科研網(wǎng)，中國(guó)科技網(wǎng)，中國(guó)公用計(jì)算機(jī)互聯(lián)網(wǎng)以及中國(guó)金橋網(wǎng)這構(gòu)成中國(guó)數(shù)字神經(jīng)系統(tǒng)的四大互聯(lián)網(wǎng)絡(luò)相繼建成，使互聯(lián)網(wǎng)在中國(guó)開始真正進(jìn)入社會(huì)生活之中。這時(shí)期，個(gè)人網(wǎng)站出現(xiàn)的條件還很不成熟，國(guó)內(nèi)上網(wǎng)的人數(shù)很少，也缺乏支持個(gè)人建站的環(huán)境，用戶很難找到理想的個(gè)人主頁(yè)存放地。個(gè)人網(wǎng)站發(fā)展的第二階段是從1997 年初到1998 年，這段時(shí)間，中國(guó)網(wǎng)民數(shù)量飛速增長(zhǎng)，個(gè)人網(wǎng)站日漸繁榮，個(gè)人主頁(yè)的數(shù)量急劇增加。同時(shí)，越來(lái)越多的商業(yè)網(wǎng)站開始免費(fèi)提供個(gè)人主頁(yè)空間，這些良好的外部極大地促進(jìn)了個(gè)人網(wǎng)站的發(fā)展，涌現(xiàn)了一批很著名的個(gè)人網(wǎng)頁(yè)，從1998 年下半年開始，隨著互聯(lián)網(wǎng)應(yīng)用的深入的普及，隨著眾多主頁(yè)制作工具的出現(xiàn)，使得建站成為一件非常容易的事，創(chuàng)建一個(gè)能充分體現(xiàn)自我風(fēng)格和特色的個(gè)人網(wǎng)站已經(jīng)成為互聯(lián)網(wǎng)用戶的新追求。長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 7 第三章、站點(diǎn)的建立及頁(yè)面制作 3.1 站點(diǎn)建立（1）打開：“窗口”下的“新建站點(diǎn)”（2）按“下一步（3）單擊“下一步”（4）單擊“下一步”（出現(xiàn)“你如何連接到遠(yuǎn)程服務(wù)器”時(shí)選擇“無(wú)”）（5）單擊完成⑴⑵⑶⑷長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 8 ⑸ 3.2 各個(gè)頁(yè)面的制作頁(yè)面圖 3.2.1 首頁(yè)的頁(yè)面：本頁(yè)有滾動(dòng)字幕及背景音樂(lè)。滾動(dòng)字幕的制作：使用“標(biāo)簽選擇器”插入marquee 標(biāo)簽 1. 把光標(biāo)插入點(diǎn)放在需要插入滾動(dòng)字幕的地方。 2. 點(diǎn)擊插入面板的“標(biāo)簽選擇器”長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 9 3. 選擇 marquee 標(biāo)簽，點(diǎn)擊“插入”按鈕。使用“標(biāo)簽檢查器”設(shè)置marquee 標(biāo)簽的屬性 4. 轉(zhuǎn)換到代碼視圖。把光標(biāo)插入點(diǎn)放在 marquee 標(biāo)簽內(nèi)。長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 10 5. 選擇“窗口”>“標(biāo)簽檢查器”。可以在“標(biāo)簽檢查器”設(shè)置標(biāo)簽的各種用法。設(shè)置marquee 標(biāo)簽的主要用法 6. 點(diǎn)擊behavior 設(shè)置項(xiàng)右邊的下拉箭頭，選擇滾動(dòng)字幕內(nèi)容的運(yùn)動(dòng)方式。 7.direction 屬性設(shè)置字幕內(nèi)容的滾動(dòng)方向。長(zhǎng)治職業(yè)技術(shù)學(xué)院信息

工程系畢業(yè)設(shè)計(jì) 11 8.scrollamount 屬性設(shè)置字幕滾動(dòng)的速度。 9.scrolldelay 屬性設(shè)置字幕內(nèi)容滾動(dòng)時(shí)停頓的時(shí)間，單位為毫秒。如果要讓滾動(dòng)看起來(lái)流暢，數(shù)值應(yīng)該盡量小。實(shí)例中設(shè)置為1 毫秒。如果要有步進(jìn)的感覺(jué)，就設(shè)置時(shí)間長(zhǎng)一點(diǎn)吧。 10.width 屬性設(shè)置滾動(dòng)字幕的寬度。長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 12 11.onMouseOver 事件設(shè)置鼠標(biāo)移動(dòng)到滾動(dòng)字幕時(shí)的動(dòng)作，常設(shè)置為停止?jié)L動(dòng)。 onMouseOut 事件設(shè)置鼠標(biāo)離開滾動(dòng)字幕時(shí)的動(dòng)作，常設(shè)置為開始滾動(dòng)。 12.style 屬性設(shè)置字幕內(nèi)容的樣式。實(shí)例中設(shè)置字幕文字大小，輸入了“font:12px;”。 13.loop 屬性設(shè)置字幕內(nèi)容滾動(dòng)次數(shù)，默認(rèn)值為無(wú)限。“-1”也為無(wú)限。長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 13 背景音樂(lè)的添加： 1．打開行為面板，點(diǎn)擊“＋”按鈕添加行為。 2．選擇“播放聲音”。 3. 選擇聲音文件。一個(gè)網(wǎng)頁(yè)的背景音樂(lè)就添加好了。如果要修改背景音樂(lè)屬性 1. 在文檔中選擇背景音樂(lè)的圖標(biāo)。 2. 在屬性檢查器中，點(diǎn)擊“參數(shù)”按鈕。 3. 修改參數(shù)。長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 14 3.2.2 日志的頁(yè)面：制作過(guò)程：本頁(yè)只是簡(jiǎn)單的超鏈接與文本編輯，無(wú)特殊效果。 3.2.3 相冊(cè)的頁(yè)面：制作過(guò)程：本頁(yè)有flash 相冊(cè)。長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 15 flash 相冊(cè)的制作： 2、插入 Flash 。在工具欄中轉(zhuǎn)到“ Flash 元素”工具條，插入 Flash 元素并保存文件，如下圖所示。 3、保存Flash 文件，然后可以在屬性面板中修改Flash 的長(zhǎng)和寬要和預(yù)先準(zhǔn)備的圖片的長(zhǎng)和寬一樣??！接著設(shè)置 Flash 元素的參數(shù)，如下圖所示。長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 16 4、保存文件，完成操作。 3.2.4 音樂(lè)欣賞頁(yè)面：制作過(guò)程：音樂(lè)播放器插入以下代碼：長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 17 長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 18 } } 3.2.5 小游戲頁(yè)面：長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 19 制作過(guò)程：插入flash 動(dòng)畫：選擇“插入”>“媒體”>“flash 視頻”。在“插入 Flash 視頻”對(duì)話框中，從“視頻類型”彈出式菜單中選擇“漸進(jìn)式下載視頻”。關(guān)于Flash 視頻使用 Dreamweaver 中的“插入 Flash 視頻”命令，可將 Flash 視頻內(nèi)容插入 Web 頁(yè)面，而無(wú)需使用 Flash 創(chuàng)

作工具。該命令可以插入 Flash 組件；當(dāng)您在瀏覽器中查看它時(shí)，它顯示您選擇的 Flash 視頻內(nèi)容以及一組播放控件?！安迦?Flash 視頻”命令提供以下選項(xiàng)，用于將視頻內(nèi)容發(fā)送給站點(diǎn)訪問(wèn)者：累進(jìn)式下載視頻將 Flash 視頻 (FLV) 文件下載到站點(diǎn)訪問(wèn)者的硬盤上，然后播放。但是，與傳統(tǒng)的“下載并播放”視頻傳送方法不同，累進(jìn)式下載答應(yīng)在下載完成之前就開始播放視頻文件。流視頻將 Flash 視頻內(nèi)容進(jìn)行流處理并立即在 Web 頁(yè)面中播放。若要在 Web 頁(yè)長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 20 面中啟用流視頻，您必須具有對(duì) Macromedia Flash Communication Server 的訪問(wèn)權(quán)限，這是唯一可對(duì) Flash 視頻內(nèi)容進(jìn)行流處理的服務(wù)器。在 URL 文本框中，指定 cafe_townsend_home.flv 文件的相對(duì)路徑，方法是單擊“瀏覽”，瀏覽至 cafe_townsend_home.flv 文件（位于站點(diǎn)的 cafe_townsend 根文件夾中），并選擇該 FLV 文件。從“外觀”彈出式菜單中選擇 Halo Skin 2。所選外觀的預(yù)覽會(huì)出現(xiàn)在“外觀”彈出式菜單下方。“外觀”選項(xiàng)指定將包含 Flash 視頻內(nèi)容的 Flash 視頻組件的外觀。在“寬度”和“高度”文本框中，執(zhí)行以下操作：在“寬度”文本框中，鍵入 180。在“高度”文本框中，鍵入 135 ，然后按 Enter 鍵。長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 21 第四章注冊(cè)域名、租用免費(fèi)空間 4.1 搜索可以免費(fèi)申請(qǐng)空間的網(wǎng)站 4.2 注冊(cè)會(huì)員，申請(qǐng)成功長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 22 第五章上傳發(fā)布虛擬主機(jī)上傳網(wǎng)頁(yè)常用的FTP 軟件有CuteFTP 、LeapFTP 、FlashFXP 等等， Dreamweaver 、以及FrontPage 也有發(fā)布網(wǎng)頁(yè)的功能。 CuteFTP 是一款非常受歡迎的FTP 工具，界面簡(jiǎn)潔，并具有支持上、下載斷點(diǎn)續(xù)傳，操作簡(jiǎn)單方便等特征，使其在眾多的FTP 軟件中脫穎而出，無(wú)論是下載軟件還是更新主頁(yè)， CuteFTP 都是一款不可多得的好工具。 CuteFTP 上傳操作說(shuō)明（1）啟動(dòng)CuteFtp （2）打開“文件”－＞“站點(diǎn)管理器”（3）定義站點(diǎn)：點(diǎn)擊“新建”建立FTP 站，然后定義站點(diǎn)標(biāo)簽，可任意填寫?！癋TP 主機(jī)地址”中填入您的IP 地址或您的域名都可，如：210.192.102.112 ，“站點(diǎn)用戶長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 23 名”中填寫您的用

戶名（管理員用戶名），“站點(diǎn)密碼”中填寫您的密碼。輸入密碼時(shí)，框中只有*字，防止被別人看到。FTP 連接端口為默認(rèn)的“21”，登錄類型請(qǐng)選擇“普通”。（4）接遠(yuǎn)程站點(diǎn)：點(diǎn)擊“連接”，即可連接至虛擬主機(jī)目錄我們可以看到現(xiàn)在我們所看到的界面分為以下四部分：上部：命令區(qū)域（工具欄和菜單）中間:（分左右兩邊）左邊：本地區(qū)域，即本地硬盤，上面兩個(gè)小框可以選擇驅(qū)動(dòng)器和路徑。右邊：遠(yuǎn)程區(qū)域，即遠(yuǎn)端服務(wù)器，雙擊目錄圖標(biāo)可進(jìn)入相關(guān)目錄。下部：記錄區(qū)域，從此區(qū)域可以看出進(jìn)程，程序已進(jìn)行到哪一步。長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 24 （5）上傳網(wǎng)頁(yè)：從本地區(qū)域選定要上傳的網(wǎng)頁(yè)或文件，雙擊或用鼠標(biāo)拖至遠(yuǎn)程區(qū)即可完成上傳工作。（6）相關(guān)操作：連接至遠(yuǎn)程服務(wù)器后可利用鼠標(biāo)右鍵中的常用選項(xiàng)對(duì)遠(yuǎn)端文件和目錄進(jìn)行操作，如刪除、重命名、移動(dòng)、修改屬性、建立目錄等。（7）經(jīng)過(guò)以上操作就可以將您的網(wǎng)頁(yè)順利上傳至虛擬主機(jī)。長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 25 參考文獻(xiàn) [1]鄧文淵. 網(wǎng)頁(yè)制作高手[M].北京：人民郵電大學(xué)出版，2007，6 [2]李憲廣. 網(wǎng)頁(yè)制作邊學(xué)邊用[M].北京：清華大學(xué)出版社， 2009，3 [3]網(wǎng)頁(yè)設(shè)計(jì)入門

[EB/OL].http://www.xue8.com/sale/view.asp?Article ID=288 [4]許凌云，柳勇良. 網(wǎng)頁(yè)設(shè)計(jì)全方位學(xué)習(xí)[M].北京：清華大學(xué)出版社，2008，11 [5]陳琳.photoshop cs3 入門實(shí)戰(zhàn)與提高[M].北京：電子工業(yè)出版社，2008，11 [6]焦慧. 網(wǎng)頁(yè)制作基礎(chǔ)與典型范例[M].北京：電子工業(yè)出版社，2008，7 [7]戎馬工作室.Dreamweaver 8 與asp 動(dòng)態(tài)網(wǎng)站開發(fā)[M].北京：機(jī)械工業(yè)出版社， 2006，5 [8]戴一波.Dreamweaver CS3 網(wǎng)站制作炫例精講[M].北京：電子工業(yè)出版社， 2008， 1 [9]何秀芳. 網(wǎng)頁(yè)制作與網(wǎng)站建設(shè)課堂實(shí)錄[M].北京：人民郵電出版社. 2009，3 [10]孫連三. 新編網(wǎng)頁(yè)制作與網(wǎng)站建設(shè)入門與提高[M].北京：人民郵電出版社. 2008，9 [11]鄧文淵. 網(wǎng)頁(yè)制作高手FLASH 8[M].北京：人民郵電出版社， 2007，6 [12]胡崧. 超夢(mèng)幻勁爆網(wǎng)頁(yè)[M].中國(guó)青年出版社.2008，7 [13]Scot Johson etal.using Active Server Page[J].Que 2007 [14]卓越科技.PHOTOSHOP CS3 美工廣告設(shè)計(jì)百煉成精[M].電子科技出版社， 2009， 3 [15]David Hunter

etal ，Beginning XML[J].Wrox Press Ltd，2005 [16]楊大勇，李金江.ASP 網(wǎng)絡(luò)開發(fā)自學(xué)導(dǎo)航[M].北京：機(jī)械工業(yè)出版社，2007，6 [17]卓越科技.SQL SERVER 數(shù)據(jù)庫(kù)開發(fā)培訓(xùn)教程[M].北京：電子工業(yè)出版社， 2009， 4 [18]李曦琳.WEB 導(dǎo)航設(shè)計(jì)[M].北京：電子工業(yè)出版社，2009，3 [19]力誠(chéng)教育.ACCESS 2007 完全自學(xué)手冊(cè)[M].成都：四川出版集團(tuán)，2009，3 [20]叢書編委會(huì).ASP 動(dòng)態(tài)網(wǎng)頁(yè)編輯[M].北京：清華大學(xué)出版社，2006，10 [21]陳剛. 商業(yè)網(wǎng)站開發(fā)從入門到精通[M].科學(xué)出版社，2008，2 長(zhǎng)治職業(yè)技術(shù)學(xué)院信息工程系畢業(yè)設(shè)計(jì) 26 結(jié)束語(yǔ)不知不覺(jué)中網(wǎng)頁(yè)設(shè)計(jì)與制作的畢業(yè)設(shè)計(jì)將要結(jié)束了，這門課程所包含內(nèi)容的豐富是我從沒(méi)有想到的。在整個(gè)學(xué)習(xí)過(guò)程中，我接觸了Flash 、Dreamweaver 、等重要工具，我很慶幸我能夠?qū)W到這么多的內(nèi)容。網(wǎng)頁(yè)設(shè)計(jì)與制作畢業(yè)設(shè)計(jì)是在宋麗芳老師的悉心指導(dǎo)下獨(dú)立完成的。雖然整個(gè)內(nèi)容還有很多不足，但是我的確能夠感到在我制作過(guò)程中技能的提高。在今后的學(xué)習(xí)生活中，我將不斷提高自己網(wǎng)頁(yè)設(shè)計(jì)與制作的能力和水平，從而彌補(bǔ)在本次畢業(yè)設(shè)計(jì)中的不足。在此我要感謝在畢業(yè)設(shè)計(jì)期間給予我?guī)椭脑S多人。首先，我要特別感謝的是我的指導(dǎo)老師宋麗芳老師。因?yàn)槭撬麨槲姨峁┝艘粋€(gè)正確的方向，才使我完成了畢業(yè)設(shè)計(jì)。在設(shè)計(jì)期間他也給予我無(wú)私的幫助，在此表示深深的謝意。