關(guān)于計(jì)算機(jī)畢業(yè)論文（ 2012 — 2013 學(xué)年）論文（設(shè)計(jì)）題目_____________________________________ 院 系 名 稱(chēng)_____________

關(guān)于計(jì)算機(jī)畢業(yè)論文

（ 2012 — 2013 學(xué)年）

論文（設(shè)計(jì)）題目_____________________________________ 院 系 名 稱(chēng)___________________________________ 專(zhuān) 業(yè) 班 級(jí)______________________________________ 學(xué) 生 姓 名______________________________________ 學(xué) 號(hào)______________________________________ 指 導(dǎo) 教 師______________________________________

日期 2013年 月 日

目 錄

摘 要.............................................................. 3

引 言.............................................................. 4

第一章 網(wǎng)站制作的基礎(chǔ)知識(shí)........................................... 5

1.1建站工具..................................................... 5

1.2網(wǎng)站建設(shè)的三個(gè)階段........................................... 5

1.3網(wǎng)站設(shè)計(jì)步驟................................................. 5

第二章 制作網(wǎng)頁(yè).................................................... 7

2.1 建立站點(diǎn) .................................................... 7

2.2 制作首頁(yè) .................................................... 7

2.2.1 頁(yè)面設(shè)置............................................... 7

2.2.2 網(wǎng)頁(yè)布局............................................... 8

2.2.3 插入圖像............................................... 9

2.2.4 插入多媒體............................................. 9

2.2.5插入文本 .............................................. 10

2.3 建立子網(wǎng)頁(yè) ................................................. 10

第三章 網(wǎng)頁(yè)鏈接................................................... 11

3.1文本鏈接.................................................... 11

3.2圖像鏈接.................................................... 12

3.3郵件鏈接.................................................... 12

3.4錨點(diǎn)鏈接.................................................... 13

第四章 HTML語(yǔ)言 .................................................. 14

4.1HTML 語(yǔ)言結(jié)構(gòu)................................................ 14

4.2 網(wǎng)頁(yè)的基本代碼 ............................................. 14

4.3表格的基本語(yǔ)法.............................................. 15

4.4超鏈接代碼.................................................. 15

第五章 網(wǎng)站維護(hù)和測(cè)試............................................. 16

總 結(jié)............................................................. 17

參考文獻(xiàn)........................................................... 18

2

摘 要

隨著經(jīng)濟(jì)社會(huì)的發(fā)展，計(jì)算機(jī)已被應(yīng)用到社會(huì)生活的各個(gè)領(lǐng)域。與此同時(shí)，互聯(lián)網(wǎng)作為信息技術(shù)的通信橋梁連接著全球的計(jì)算機(jī)，而網(wǎng)站作為網(wǎng)絡(luò)信息主要的表現(xiàn)形式而且還是互聯(lián)網(wǎng)信息的主要承載者，在Internet 上表現(xiàn)出其及其重要的地位，并發(fā)揮著其及其重要的作用。無(wú)論是在國(guó)內(nèi)還是國(guó)外都得以迅速的發(fā)展和壯大，并被人們重視和關(guān)注。互聯(lián)網(wǎng)已經(jīng)徹底的改變了世界，互聯(lián)網(wǎng)的世界里蘊(yùn)藏著無(wú)限的可能，在這種情況下，各行各業(yè)及其個(gè)人、單位、工廠、企事業(yè)等等在網(wǎng)上構(gòu)筑屬于自己的網(wǎng)絡(luò)信息平臺(tái)，保護(hù)自己的網(wǎng)絡(luò)資源并在互聯(lián)網(wǎng)上開(kāi)辟自己的市場(chǎng)和消費(fèi)群體，以及構(gòu)造自己的數(shù)字化世界和加強(qiáng)全球范圍內(nèi)不同地域的人們聯(lián)系交流等等活動(dòng)也就顯的日益重要。于是各種各樣的網(wǎng)站便如雨后春筍般地出現(xiàn)魚(yú)龍混雜且良莠不齊。Internet 的日益興起和以網(wǎng)頁(yè)為載體的網(wǎng)絡(luò)信息的廣泛傳播和應(yīng)用，使得網(wǎng)站的建設(shè)及網(wǎng)頁(yè)制作得到發(fā)展的空間，大至大型企業(yè)的產(chǎn)品推銷(xiāo)、售后服務(wù)、解決方案，小至個(gè)人Web 頁(yè)面開(kāi)發(fā)，形形色色，五彩繽紛，網(wǎng)站建設(shè)和網(wǎng)頁(yè)制作也成為計(jì)算機(jī)網(wǎng)絡(luò)領(lǐng)域最熱門(mén)的話(huà)題。

基于如今社會(huì)的需要，本論文主要介紹怎樣制作一個(gè)靜態(tài)的個(gè)人網(wǎng)站。并且在建立個(gè)人網(wǎng)站的過(guò)程中逐漸理解和加強(qiáng)大學(xué)這幾年所學(xué)習(xí)的關(guān)于制作網(wǎng)站的各種知識(shí)點(diǎn)。在我個(gè)人的理解中，制作一個(gè)具有特色的個(gè)人網(wǎng)站，能夠有自己的個(gè)性和特點(diǎn)。這樣才能吸引人。只有一個(gè)目標(biāo)，那就是做好自己。

關(guān)鍵詞： 個(gè)人 設(shè)計(jì) 網(wǎng)站

3

引 言

人類(lèi)已進(jìn)入21世紀(jì), 科學(xué)技術(shù)突飛猛進(jìn), 經(jīng)濟(jì)知識(shí)和信息產(chǎn)業(yè)初見(jiàn)端倪, 特別是信息技術(shù)和網(wǎng)絡(luò)技術(shù)的訊速發(fā)展和廣泛應(yīng)用, 對(duì)社會(huì)的政治, 經(jīng)濟(jì), 軍事, 文化等領(lǐng)域產(chǎn)生越來(lái)越深刻的影響, 也正在改變?nèi)藗兊墓ぷ? 生活學(xué)習(xí), 交流方式。信息的獲取, 處理, 交流和應(yīng)用能力, 已經(jīng)成為人們最重要的能力之一。

在不久的將來(lái)知識(shí)經(jīng)濟(jì)將占世界經(jīng)濟(jì)發(fā)展的主導(dǎo)地位, 國(guó)家綜合國(guó)力和國(guó)際競(jìng)爭(zhēng)能力越來(lái)越取決于教育發(fā)展, 科學(xué)技術(shù)和知識(shí)創(chuàng)新的水平, 教育在經(jīng)濟(jì)和社會(huì)發(fā)展過(guò)程中將呈現(xiàn)出越來(lái)越突出的重要作用。

隨著Internet 的出現(xiàn)，網(wǎng)絡(luò)正在改變整個(gè)世界，由于Internet 具有傳播信息容量極大、形態(tài)多樣、迅速方便、全球覆蓋、自由和交互的特點(diǎn)，已經(jīng)發(fā)展成為新的傳播媒體，而將教育和網(wǎng)絡(luò)相結(jié)合，將會(huì)更好的推動(dòng)教育的發(fā)展?，F(xiàn)在不僅很多大學(xué)和眾多企業(yè)部門(mén)都已經(jīng)建立了自己的網(wǎng)站，而且個(gè)人網(wǎng)站也如雨后春筍般大量的出現(xiàn)，通過(guò)計(jì)算機(jī)網(wǎng)絡(luò)實(shí)現(xiàn)宣傳、交流及資源的整合

4

第一章 網(wǎng)站制作的基礎(chǔ)知識(shí)

1.1建站工具

編輯網(wǎng)頁(yè)的工具有很多，但是我們一般用的是Macromedia 公司的網(wǎng)頁(yè)制作三劍客來(lái)制作網(wǎng)頁(yè)。三劍客分別為Dreamweaver CS3、fireworks 、flash 。

1.2網(wǎng)站建設(shè)的三個(gè)階段

（1）、網(wǎng)站的定位 即網(wǎng)站設(shè)計(jì)的最終目標(biāo)及指導(dǎo)方針。確立網(wǎng)站的主題，解決為誰(shuí)設(shè)計(jì)、吸引誰(shuí)，交流什么。

（2）、制作網(wǎng)頁(yè) 通過(guò)網(wǎng)頁(yè)設(shè)計(jì)體現(xiàn)網(wǎng)站整體協(xié)調(diào)一致的風(fēng)格。網(wǎng)站的色彩基調(diào)、配色方案、頁(yè)面色彩的格調(diào)、頁(yè)面構(gòu)圖及圖片、動(dòng)畫(huà)的處理等都要反復(fù)研究。方便的導(dǎo)航設(shè)計(jì)使用戶(hù)易于訪問(wèn)站點(diǎn)中的資源。

（3）、網(wǎng)站的發(fā)布與維護(hù) 完成對(duì)網(wǎng)站所有文件的測(cè)試并上傳到服務(wù)器，進(jìn)行網(wǎng)站的推廣和宣傳，建立信息的收集反饋系統(tǒng)，及時(shí)更新網(wǎng)頁(yè)。

1.3網(wǎng)站設(shè)計(jì)步驟

（1）、設(shè)定網(wǎng)站主題并搜集資料 分析網(wǎng)站的訪問(wèn)對(duì)象是什么樣的群體，確定網(wǎng)站要為訪問(wèn)者提供什么樣的服務(wù)。圍繞網(wǎng)站設(shè)計(jì)要達(dá)到的目標(biāo)，進(jìn)一步?jīng)Q定網(wǎng)站展示的內(nèi)容和網(wǎng)站要實(shí)現(xiàn)的功能。

（2）、建立站點(diǎn)的目錄結(jié)構(gòu) 用來(lái)分類(lèi)保存網(wǎng)站中的不同的資源，精心設(shè)計(jì)的網(wǎng)站目錄結(jié)構(gòu)有利于網(wǎng)站類(lèi)容的擴(kuò)充和移植需要。很多初學(xué)者往往不注意建立站點(diǎn)的目錄結(jié)構(gòu)，所有的文件都保存在一個(gè)目錄中，這給今后的網(wǎng)站維護(hù)和擴(kuò)充帶來(lái)了很大的困難。例如，files 保存非index 之外是文件，images 保存圖片文件，sounds 保存聲音文件等等。

（3）、建立網(wǎng)頁(yè)的鏈接關(guān)系 網(wǎng)頁(yè)的鏈接結(jié)構(gòu)要層次清晰、訪問(wèn)方便快捷，就要設(shè)計(jì)網(wǎng)站中網(wǎng)頁(yè)的鏈接關(guān)系。用最少的點(diǎn)擊打開(kāi)網(wǎng)站內(nèi)的任何一個(gè)網(wǎng)頁(yè)，為用戶(hù)提供最便捷的服務(wù)。

5

（4）、頁(yè)面設(shè)計(jì)與網(wǎng)頁(yè)制作 網(wǎng)站圖標(biāo)、網(wǎng)頁(yè)標(biāo)題、導(dǎo)航欄設(shè)計(jì)、各頁(yè)風(fēng)格、頁(yè)面規(guī)劃、便捷的鏈接、合理使用框架、巧用背景色、合適的圖片、網(wǎng)頁(yè)空白。

（5）、網(wǎng)站測(cè)試 已經(jīng)建好的一個(gè)設(shè)計(jì)精美的網(wǎng)站在發(fā)布之前要進(jìn)行嚴(yán)格的測(cè)試。如果在測(cè)試過(guò)程中發(fā)現(xiàn)了錯(cuò)誤，就要及時(shí)修改，在準(zhǔn)確無(wú)誤后，可正式在Internet 上發(fā)布。

（6）、網(wǎng)站發(fā)布 把制作好的網(wǎng)站發(fā)布到自己的服務(wù)器系統(tǒng)上，也可以使用上傳工具把網(wǎng)站發(fā)布到ISP 提供的虛擬主機(jī)上。在國(guó)外或國(guó)內(nèi)網(wǎng)站提供免費(fèi)的主頁(yè)空間和域名，上傳后就可以使用瀏覽器訪問(wèn)自己的網(wǎng)站了

（7）、推廣宣傳與后期維護(hù) 網(wǎng)頁(yè)上傳后，及時(shí)更新網(wǎng)站內(nèi)容，為瀏覽者提供豐富、及時(shí)的信息。網(wǎng)頁(yè)的更新速度是衡量一個(gè)網(wǎng)站的主要目標(biāo)。同時(shí)為了增加網(wǎng)站的訪問(wèn)量，要采用各種方法加以推廣。例如在搜索引擎上注冊(cè)，發(fā)布網(wǎng)絡(luò)廣告提供免費(fèi)服務(wù)或者使用傳統(tǒng)的促銷(xiāo)媒介等等方式來(lái)推廣網(wǎng)站。

6

第二章 制作網(wǎng)頁(yè)

2.1 建立站點(diǎn)

選擇“站點(diǎn)”，單擊“管理站點(diǎn)”，單擊“新建”，選擇站點(diǎn)。如圖（2—1）：

圖2—1

在按上圖完成所填部分，在面板組就會(huì)出現(xiàn)站點(diǎn)等文件夾了。在右邊的面板組中選擇“站點(diǎn)”文件名，右擊“新建文件”，命名為“index ”，完成首頁(yè)的命名。

2.2 制作首頁(yè)

2.2.1 頁(yè)面設(shè)置

首先雙擊“index.html ”, 進(jìn)入頁(yè)面的編輯窗口。右健單擊空白區(qū)域，在菜單中選擇“頁(yè)面屬性”，之后彈出“頁(yè)面屬性”對(duì)話(huà)框，若選擇主菜單“修改/頁(yè)面屬性”項(xiàng)，也可以把打開(kāi)該對(duì)話(huà)框。在“頁(yè)面屬性”對(duì)話(huà)框中，左側(cè)窗口顯示“分類(lèi)”，其中包括了“外觀”、“鏈接”、“標(biāo)題”、“標(biāo)題/編碼”、“跟蹤圖像”5項(xiàng)，右側(cè)區(qū)域則顯示各類(lèi)中可以設(shè)置的項(xiàng)目。首頁(yè)設(shè)置的屬性如圖（2—2）所示：

7

圖2—2

2.2.2 網(wǎng)頁(yè)布局

在網(wǎng)頁(yè)布局中一般采用表格來(lái)進(jìn)行布局。下面簡(jiǎn)單介紹下表格的布局方式。通過(guò)單擊“插入”面板中的“常用”選項(xiàng)中的“表格”來(lái)打開(kāi)“表格”對(duì)話(huà)框，對(duì)話(huà)框可分為“表格大小”、“頁(yè)眉”、“輔助功能”三部分。對(duì)表格的各項(xiàng)屬性設(shè)置如圖（2—3）所示：

圖2—3

8

2.2.3 插入圖像

圖像是網(wǎng)頁(yè)中不可或缺的組成成份，恰當(dāng)?shù)厥褂脠D像，可以使網(wǎng)站充滿(mǎn)生活生命力與說(shuō)服力，吸引更多的瀏覽者，加深他們欣賞你網(wǎng)站的意愿。首先將游標(biāo)停留在要插入圖像的位置，通過(guò)單擊“常用”欄中的“圖像”的下拉按鈕，單擊第一個(gè)“圖像”按鈕，隨即彈出“選擇圖像源文件”對(duì)話(huà)框。從計(jì)算機(jī)磁盤(pán)中選擇想要插入的圖像文件。如圖（2—4）所示：

圖2—4

2.2.4 插入多媒體

將光標(biāo)移到要插入Flash 動(dòng)畫(huà)的位置，選擇“插入”面板中的“常用”選項(xiàng)卡單擊“媒體”右側(cè)的命令，再單擊第一個(gè)“Flash ”選項(xiàng)。再?gòu)拇蜷_(kāi)選擇文件對(duì)話(huà)框中選擇你所需要的Flash 動(dòng)畫(huà)（*.swf），調(diào)整Flash 動(dòng)畫(huà)的大小，既可以手動(dòng)調(diào)整，也可以在下面的屬性里添上我自己事先設(shè)置好的大小，如圖（2—5）所示, 在瀏覽器中，F(xiàn)lash 動(dòng)畫(huà)才可以被看到，要想看看效果的話(huà)，只有按F12預(yù)覽下。

9

圖2—5

2.2.5插入文本

文字是人類(lèi)語(yǔ)言最基本的表達(dá)方式，在網(wǎng)頁(yè)中，文本內(nèi)容也可以說(shuō)是重要的組成部分，它是最關(guān)鍵的因素。插入文本的兩種方式：一種是在網(wǎng)頁(yè)編輯窗口中直接用鍵盤(pán)敲入文本；另一種是復(fù)制文本的方式。直接使用Dreamweaver 的文本復(fù)制功能，將大段的文本內(nèi)容拷貝到網(wǎng)頁(yè)的編輯窗口來(lái)進(jìn)行排版的工作，具體步驟如下：打開(kāi)文本編輯軟件（如Microsoft Word ），選中要復(fù)制的文本，執(zhí)行菜單“編輯/復(fù)制”命令或直接用快捷鍵Ctrl C，之后切換回Dreamweaver, 將游標(biāo)停留在插入文本的位置，執(zhí)行主菜單“編輯/粘貼”命令或直接使用快捷鍵Ctrl v,即可將大段的文本快速粘貼到網(wǎng)頁(yè)中。

2.3 建立子網(wǎng)頁(yè)

制作子網(wǎng)頁(yè)的一般步驟和首頁(yè)的步驟差不多。如果說(shuō)你的首頁(yè)中有標(biāo)題的話(huà)，那么在子網(wǎng)頁(yè)中也一定要和首頁(yè)的位置是一樣的。在子網(wǎng)頁(yè)中一般需要大量的文字?jǐn)⑹龌蛘邎D片，這就需要做好細(xì)節(jié)工作了。

10