動態(tài)網頁制作——畢業(yè)論文

1、<p>　　J I A N G S U U N I V E R S I T Y</p><p>　　本 科 畢 業(yè) 論 文</p><p><b>　　動態(tài)網頁制作</b></p><p>　　Dynamic homepage manufacture</p><p>　　學院名稱：

2、 應用科學技術學院 </p><p>　　專業(yè)班級： 計算機科學與技術 </p><p>　　學生姓名： </p><p>　　指導教師姓名： </p><p>　　指導教師職稱：

3、 </p><p><b>　　年 月</b></p><p><b>　　動態(tài)網頁制作</b></p><p>　　摘要 在Internet飛速發(fā)展的今天，互聯網已成為人們快速獲取、發(fā)布和傳遞信息的重要渠道，正以一種前所未有的沖擊力影響著人類的活動。它在人們政治、經濟、生活等各個方面發(fā)揮

4、著重要的作用。因此網站建設在Internet應用上的地位顯而易見，它已成為政府、企事業(yè)單位信息化建設中的重要組成部分，從而倍受人們的重視。</p><p>　　這次所設計的課題正是互聯網與社會生活之間的緊密關系的體現，現今的社會，人們已經離不開了網絡，網絡已經成為人與人之間交流的一種形式，它能夠把事情的復雜化轉為簡單化，擺脫了時間和空間的限制。本論文是為消費者提供了一個網絡生活空間。通過該網頁展示了企業(yè)介紹、企業(yè)

5、榮譽、產品介紹、招商信息、加盟程序、留言等一系列內容的介紹。瀏覽者不僅可以利用留言板經濟而又快捷地與外界進行各種信息的溝通，也可以直接在網上申請加盟。本論文還介紹了網頁的結構分析和具體功能實現，網頁的界面和運作方式，盡力模擬近代網頁普遍性形式，成為一個完整的動態(tài)網站。</p><p>　　關鍵字： Dreamweaver，ASP， Access，動態(tài)網頁</p><p>　　Dynamic

6、 homepage manufacture</p><p>　　Abstract In Internet swift development's today, the Internet becomes the people to gain, the issue and the transmit message important channel fast, it in the people politic

7、s, the economy, the life and so on each aspect is playing the vital role. Therefore the website construction is obvious in the Internet application's status, it has become the government, in the Enterprises and insti

8、tutions informationization construction important component, thus time people's value.</p><p>　　This time designs the topic is precisely the Internet and between social life close relations manifestation

9、, nowadays's society, the people already could not leave the network, the network had already become one form which between the human and the human exchanges, it can transfer matter's complication the simplificat

10、ion. The present paper has provided a network life space for the consumer, had demonstrated through this homepage the enterprise said that the enterprise honor, the product introduc</p><p>　　Keywords Dreamw

11、eaver ASP Access Dynamic homepage</p><p><b>　　目 錄</b></p><p><b>　　第1章 引言1</b></p><p>　　第2章 網頁制作概述2</p><p>　　2.1網頁的類型2</p><p>

12、;　　2.1.1 靜態(tài)頁面2</p><p>　　2.1.2 動態(tài)頁面2</p><p>　　2.2網頁開發(fā)技術2</p><p><b>　　2.3網頁布局4</b></p><p>　　2.3.1網頁布局的基本概念4</p><p>　　2.3.2網頁布局方法5</p>

13、<p>　　2.3.3網頁布局技術5</p><p><b>　　2.4網頁配色6</b></p><p>　　2.5網頁設計流程7</p><p>　　第3章 動態(tài)網頁開發(fā)環(huán)境和技術9</p><p>　　3.3 ASP基礎知識12</p><p>　　第4章 設計及具體

14、代碼實現13</p><p>　　4.1網頁結構設計13</p><p>　　4.1.1 功能分析與設計13</p><p>　　4.1.2模塊實現13</p><p>　　4.2建立站點14</p><p>　　4.3 數據庫結構設計17</p><p>　　4.3.1 數據庫的創(chuàng)

15、建17</p><p>　　4.3.2 數據庫邏輯結構設計18</p><p>　　4.3.3連接數據庫20</p><p>　　4.4頁面設計21</p><p>　　4.5運行測試26</p><p><b>　　結論28</b></p><p><b

16、>　　致謝29</b></p><p><b>　　參考文獻30</b></p><p><b>　　第1章 引言</b></p><p>　　此次所設計的課題正是互聯網與社會生活之間的緊密關系的體現，現今的社會，人們已經離不開了網絡，網絡已經成為人與人之間交流的一種形式，它能夠把事情的復雜化轉為簡單

17、化。</p><p>　　胡老三蜂產品網頁的建立不僅能夠大大地提高了該企業(yè)工作人員的辦事效率，也增加了該企業(yè)的知名度，更重要的是為消費者提供了一個網絡生活空間，使他們對蜂產品知識進一步地了解。 通過該網站展示了首頁、企業(yè)介紹、企業(yè)榮譽、產品介紹、招商信息、購物流程、留言等系列內容的介紹。消費者可以利用留言板經濟而又快捷地與外界進行各種信息溝通，也可直接在網上申請加盟。</p><p&g

18、t;　　網頁是網站信息發(fā)布與表現的一種主要形式。因此要實現一個網站，必須了解網頁制作的相關知識。</p><p>　　開發(fā)工具：Dreamweaver+ASP+Access</p><p>　　Dreamweaver是建立Web站點和應用程序的專業(yè)工具，它將可視布局工具、應用程序開發(fā)功能和代碼編輯支持組合成一個功能強大的工具,可利用它快速創(chuàng)建界面及站點的應用程序。ASP因為語法簡單而且功能

19、強大，同時能與Windows的操作系統無縫結合，得到廣大用戶歡迎并迅速成為各類網站制作的主流開發(fā)環(huán)境。使用Access無須編寫任何代碼，只需通過直觀的可視化操作就可以完成大部分數據庫管理任務，是一個面向對象的、采用事件驅動機制的關系型數據庫管理系統。</p><p>　　第2章 網頁制作概述</p><p><b>　　2.1網頁的類型</b></p>

20、<p>　　2.1.1 靜態(tài)頁面</p><p>　　靜態(tài)頁面是網頁的代碼都在頁面中，不需要執(zhí)行asp,php,jsp,.net等程序生成客戶端網頁代碼的網頁。靜態(tài)頁面不能自主管理發(fā)布更新的頁面,如果想更新網頁內容,要通過FTP軟件把文件DOWN下來用網頁制作軟件修改（通過fso等技術例外）。但是靜態(tài)頁面最大的好處是下載速度快，因為不需要程序運算和數據庫連接。常見的靜態(tài)頁面以.html、.htm為擴展名

21、的。靜態(tài)頁面并非網站上沒有動畫的就是靜態(tài)頁面。</p><p>　　2.1.2 動態(tài)頁面</p><p>　　動態(tài)頁面是通過執(zhí)行asp、php、jsp、.net等程序生成客戶端網頁代碼的網頁。動態(tài)頁面通?？梢酝ㄟ^網站后臺管理系統對網站的內容進行更新管理。發(fā)布新聞，發(fā)布公司產品，交流互動，博客，網上調查等，這都是動態(tài)網站的一些功能，也是我們常見的。動態(tài)網頁是需要語言環(huán)境支持的，動態(tài)頁面常見的

22、擴展名有：.asp、 .php、 .jsp 、.cgi 等。動態(tài)頁面的“動態(tài)”是網站與客戶端用戶互動的意思，而非網頁上有動畫的就是動態(tài)頁面。</p><p><b>　　態(tài)圖片了。</b></p><p>　　動態(tài)網頁是最常用的網站建設的一種表達形式，其優(yōu)點在于可以根據先前所制定好的程序界面，根據用戶的不同請求返回相應的數據?？梢哉f是一對多的關系。從而達到資源的最大利

23、用和節(jié)省服務器上的物理資源。如果今后需要改變站點風格，只需要重新制作前臺所訪問的數據即可。只要數據庫結構不變，可以很快的進行改版的。</p><p><b>　　2.2網頁開發(fā)技術</b></p><p>　　動態(tài)網頁開發(fā)技術介紹——HTML、ASP、JSP、CGI、PHP。 </p><p>　　HTML（HyperTextMark-upLa

24、nguage）即超文本標記語言，是WWW的描述語言。嚴格的來講，HTML不能算做一門編程語言，因為它沒有自己的數據類型，也沒有分支、循環(huán)等控制結構。它的設計簡單，結構靈活，允許在Web瀏覽器及其它兼容的應用程序中顯示文本和圖像，并且文檔的某些部分可以成為超鏈接。完成后把這些文檔保存為*.html文件，然后用瀏覽器打開。    HTML是網絡的通用語言,一種簡單、通用的全置標記語言。它允許網頁制作人建立文本與圖片相結

25、合的復雜頁面，這些頁面可以被網上任何其他人瀏覽到，無論使用的是什么類型的電腦或瀏覽器。</p><p>　　在早期，動態(tài)網頁技術主要采用CGI技術，即Common Gateway Interface(公用網關接口)。在早期，你可以使用不同的程序編寫合適的CGI程序，如Visual Basic,Delphi或C/C++等。雖然CGI技術成熟而且功能強大，但由于編程困難，效率低下，修改復雜等缺陷，所以有逐漸被新技術取

26、代的趨勢。</p><p>　　ASP全名Active Server Pages，是一個WEB服務器端的開發(fā)環(huán)境，利用它可以產生和運行動態(tài)的、交互的、高性能的WEB服務應用程序。ASP采用腳本語言VB Script（Java script）作為自己的開發(fā)語言。 ASP更精確的說是一個中間件，這個中間件將Web上的請求轉入到一個解釋器中，在這個解釋器中將所有的ASP的Script進行分析，再進行執(zhí)行，而這時可以在這

27、個中間件中去創(chuàng)建一個 PHP是一種跨平臺的服務器端的嵌入式腳本語言. 它大量地借用C,Java和Perl語言的語法, 并耦合PHP自己的特性,使WEB開發(fā)者能夠快速地寫出動態(tài)生成頁面.它支持目前絕大多數數據庫。還有一點，PHP是完全免費的。</p><p>　　JSP 是Sun公司推出的新一代站點開發(fā)語言，他完全解決了目前ASP,PHP的一個通?。_本級執(zhí)行（據說PHP4 也已經在Zend 的支持下，實現

28、編譯運行）。Sun 公司借助自己在Java 上的不凡造詣，將Java 從Java 應用程序 和 Java Applet 之外，又有新的碩果，就是Jsp－－Java Server Page。Jsp 可以在Serverlet和JavaBean的支持下，完成功能強大的站點程序。</p><p><b>　　2.3網頁布局</b></p><p>　　2.3.1網頁布局的基本

29、概念</p><p>　　最開始網頁呈現在你面前的時侯，它就好像一張白紙，它需要任意揮灑設計才思。在開始的時侯，需要明白，雖然你能控制一切你所能控制的東西，但最好明白網頁布局的基本概念。</p><p><b>　　1.頁</b></p><p>　　的或是相似的。左中右結構也可以擴展成為四欄甚至是五欄。在多欄的布局中，可以使用一個大欄二到三個

30、同寬小欄的布局方式，這里的同寬小欄的總寬要可以比大欄的寬度大一點或是小一點，或是等寬。當然也會有一些其它的布局比例，可以在具體的形式可以在實踐中自行的調整看一下感覺。 上下或是上中下的比例就比較特別，與左右或是左中右的有很大的不同。 上下的比例需要考慮到第一屏的顯示效果問題，現在1024分辨率的普及使得網站的高度顯示被拉長。所以需要在第一屏顯示什么樣的內容?一般最重要，最想要瀏覽者注意的當然要在第一屏顯示出來。而一般來講上中下

31、的比例就是在這么長的屏</p><p><b>　　2.4網頁配色</b></p><p>　　互聯網充斥著枯燥的設計，惠普、IBM、戴爾、微軟，以及其他數不盡的網站（相似的布局，相似的配色）?？赡苡腥藭f通過這樣一種標準化的界面可以使瀏覽更方便，而事實上這些網站帶給用戶一種很世俗的體驗，并不能與訪客產生一種積極的聯系。</p><p>　　面

32、對這種單調的設計，有一種解決方法，就是使用顏色。可能沒有其他設計元素能像顏色一樣能影響人們對世界感受。顏色可以瞬間改變我們的情緒和意見。顏色會讓我們感覺到舒適、敬畏，或者激動。在界面設計中，顏色組合對設計非常有用?？梢詤^(qū)分設計讓用戶更加難忘、引導用戶使用戶專注于交互、吸引用戶使頁面布局更舒適，更有魅力。</p><p>　　一旦有機會可以讓網站更獨特，就不能放棄。如果你的網站很“跳”，那么用戶可能會花更多時間瀏覽

33、并且想是從哪里訪問過來的，他們有可能記住這個網站并且下次再訪問?？赡軟]有比顏色更好的元素可以達到這樣的效果了。人們會馬上對顏色產生感覺：激動、高興或者枯燥乏味。</p><p>　　當你試圖在一個充滿飽和色調的頁面上瀏覽信息時，你的眼睛會不斷地返回那些亮的顏色。最強的視覺元素是最重要的。我們趨向于忘記那些深藍、黃色和灰色，因為每天都看到。在那些用戶需要長時間在線使用的 Web 應用程序中，注意這一點尤為重要。不是

34、很強烈的配色可以使用戶專注于工作和接收重要信息。當然完美的 Web 體驗不能僅僅依靠顏色，結構、交互、布局等方面也必須協同工作，來創(chuàng)建可用、易用的網站和應用程序。但是顏色是平衡中的重要部分，不能忽略。</p><p><b>　　2.5網頁設計流程</b></p><p>　　網頁設計是一個互動的過程，不僅是設計師構思設計就可以完成的。從客戶提出需求到最終發(fā)布，期間需

35、要客戶與設計人員共同參與協商才可以，具體流程如下：</p><p><b>　　獲取客戶需求和資料</b></p><p>　　在設計網站頁面之前，設計師需要知道客戶的需求，從而確定客戶建立網站的目的?？蛻籼岢鼍W站需求是非常重要的一個環(huán)節(jié)。沒有詳細的需求，設計人員無法憑空進行設計制作。在這個步驟中，雙方的溝通與交流是非常重要的。</p><p>

36、;<b>　　確定網站內容</b></p><p>　　設計人員選擇適合自己的圖像編輯軟件、動畫制作軟件和網頁制作軟件進行網頁的初步設計，這中間可能還需要和客戶進行多次溝通才能達到客戶滿意的效果。在具體設計時，設計人員應該為網站定位一個主題，從而保證所有網頁都圍繞這個主題進行設計制作，保證風格的和諧統一。</p><p><b>　　申請域名和空間</

37、b></p><p>　　使用該方法能夠有效同步管理文件。還可以通過FTP軟件連接到服務器空間上，然后上傳發(fā)布文件。</p><p><b>　　后期維護</b></p><p>　　一般靜態(tài)網站上傳后，如果客戶方沒有專業(yè)人員維護，這樣就需要設計人員從客戶方獲取新資料進行定期或不定期的更新。如果是動態(tài)網站，設計人員需要負責培訓客戶方如何使

38、用后臺管理，這樣客戶就可以自己通過后臺管理添加信息，設計人員只要及時更正動態(tài)網站的錯誤即可。</p><p>　　第3章 動態(tài)網頁開發(fā)環(huán)境和技術</p><p>　　3.1認識了解Dreamweaver</p><p>　　Dreamweaver是美國MACROMEDIA公司開發(fā)的集網頁制作和管理網站于一身的所見即所得網頁編輯器，它是第一套針對專業(yè)網頁設計師特別發(fā)展

39、的視覺化網頁開發(fā)工具，利用它可以輕而易舉地制作出跨越平臺限制和跨越瀏覽器限制的充滿動感的網頁。 </p><p>　　Dreamweaver的特點：</p><p>　　最佳的制作效率：Dreamweaver可以用最快速的方式將Fireworks或Photoshop等檔案移至網頁上。Dremweaver能與您喜愛的設計工具，如Flash等和外掛模組等搭配，不需離開Dremweaver便可完

40、成，整體運用流程自然順暢。除此之外，只要單擊便可使Dreamweaver自動開啟Firework或Photoshop來進行編輯與設定圖檔的最佳化。</p><p>　　網站管理：使用網站地圖可以快速制作網站雛形，設計，更新和重組網頁。改變網頁位置或檔案名稱，Dreamweaver會自動更新所有連結。使用支援文字，HTML碼，HTML屬性標簽和一般語法的搜尋及置換功能使得復雜的網站更新變得迅速又簡單。</p&

41、gt;<p>　　無可比擬的控制能力：Dreamweaver是唯一提供Roundtrip HTML、視覺化編輯與原始碼編輯同步的設計工具。它包含HomeSite和BBEdit等主流文字編輯器。幀(frames)和表格的制作速度快的令您無法想像。進階表格編輯功能使您簡單的選擇單格、行、欄或作未連續(xù)之選取。甚至可以排序或格式化表格群組，Dreamweaver支援精準定位，利用可輕易轉換成表格的圖層以拖拉置放的方式進行版面配置。

42、</p><p>　　所見即所得：Dreamweaver成功整合動態(tài)式出版視覺編輯及電子商務功能，提供超強的支援能力給Third-party廠商，包含ASP， Apache，BroadVision， Cold Fusion，iCAT， Tango與自行發(fā)展的應用軟體。當您正使用Dreamweaver在設計動態(tài)網頁時，所見即所得的功能，讓您不需要透過瀏覽器就能預覽網頁。</p><p>　　

43、夢幻樣版和XML：Dreamweaver將內容與設計分開，應用於快速網頁更新和團隊合作網頁編輯。建立網頁外觀的樣版，指定可編輯或不可編輯的部份，內容提供者可直接編輯以樣式為主的內容卻不會不小心改變既定之樣式。您也可以使用樣版正確地匯入或輸出XML內容。</p><p>　　全方位的呈現：利用Dreamweaver設計的網頁，可以全方位的呈現在任何平臺的熱門瀏覽器上。對于動態(tài)HTML支援和鼠標換圖效果，聲音和動畫的

44、DHTML效果資料庫可在Netscape和Microsoft瀏覽器上執(zhí)行。使用不同瀏覽器檢示功能，Dreamweaver可以告知您在不同瀏覽器上執(zhí)行的成效如何。當有新的瀏覽器上市時，只要從Dreamweaver的網站在下載它的描述檔，便可得知詳盡的成效報告。 </p><p><b>　　3.2開發(fā)環(huán)境</b></p><p>　　3.2.1 安裝與配制服務器<

45、/p><p>　　如果僅僅需要編輯靜態(tài)的HTML網頁，那么安裝和配置服務器不是必需的，因為HTML頁面的運行無需服務器的支持，但是如果需要在本地測試ASP或者ASP.NET等動態(tài)網頁，那么服務器的支持是必不可少的。</p><p>　　IIS是支持網站創(chuàng)建、配置和管理以及其他Internet功能的軟件服務。只要安裝了IIS并且連接到了互聯網，那么計算機就可以配置為一個網站，供他人瀏</p

46、><p><b>　　結 論</b></p><p>　　本設計根據畢業(yè)設計任務書的要求制作，功能基本實現，可以完成管理登陸、加盟申請、留言、各產品展示等功能的實現。此次設計是查看了一些企業(yè)網站的結構然后進行設計的，雖然此次設計構造不能說是成熟，但也算是盡了力。</p><p>　　這是我首次運用Dreamweaver、ASP語言結合ACCE

47、SS數據庫系統開發(fā)工具進行動態(tài)網頁的制作，一切都是從零開始學習，所以制作的時候難免會過于簡單，考慮的也不是很周全。同時由于時間的倉促，有些功能的實現不是很完美。在設計過程中不可避免地遇到了各種各樣的問題，由于整個設計完全都是由個人設計的，有關Dreamweaver、ASP和數據庫連接等方面許多細節(jié)問題都要靠自己去摸索，加之本人水平有限，因此還存在著許多不足之處。</p><p>　　在以前的時間內我學習了許多專業(yè)

48、課程，比如C語言，VB語言，數據庫系統概論，FLASH等等，雖然通過學習對這些課程有所了解和掌握，但是始終處于理論知識的掌握階段，并沒有真正應用于實踐設計開發(fā)，所以對知識的掌握還不夠全面和熟練，并不能真正獨立的開發(fā)出一個完整的應用于實際的系統。通過這次畢業(yè)設計，使我學到了很多，對自身的能力有了很大的提高。此次設計是動態(tài)網頁制作，而不是簡單的靜態(tài)網頁，因此采用了在開發(fā)動態(tài)網頁方面比較先進的ASP語言作為開發(fā)語言。ASP是一種Web編程腳本

49、語言。當然在制作的過程中碰到過一些讓人頭痛的問題，我都一一解決了，直到設計全部完成，也讓我在解決問題方面的能力得到了提高。</p><p>　　整個開發(fā)的過程對我來說是一次將理論應用于實踐的過程，是將以前所學知識充分利用的過程，是一次真正的實踐過程。</p><p>　　總體說來，在這學期的畢業(yè)設計中，學到了一些在課堂內所學不到的知識，收獲很大。</p><p>&

50、lt;b>　　致 謝</b></p><p>　　首先感謝我的指導老師馬青老師，她在我的畢業(yè)設計過程中給了指導性的方案和架構，指引我閱讀相關的資料和書籍，使我能學習掌握知識并完成了畢業(yè)設計。 </p><p>　　感謝答辯組對此畢業(yè)設計的考核，如果可以得到答辯組各位老師的認可將對我的學習和工作給予極大的鼓勵。你們客觀的評價和建議我將牢記在心，在今后的發(fā)展中揚長避短，

51、更加努力的嚴格要求自己。 </p><p>　　感謝學校對我的培育，讓我從思想上、素質上和知識上得到很大的提高。在校學習的過程中的各科老師的悉心教導讓我掌握了更多的知識，對提高我的知識面有很大的幫助。 </p><p>　　最后要感謝我的同學在設計完成前后對我的幫助，沒有同學的共同學習進步也許就沒法完成設計，沒有同學的幫助，也許一些潛在的錯誤難以得到更正，在此一并表示感謝。</p&g

52、t;<p>　　在此祝愿學校領導、老師、同學工作順利，事業(yè)更上一層樓；同時也祝愿學校更加輝煌！</p><p><b>　　參考文獻</b></p><p>　　[1].李東生.深入精髓：Dreamweaver網頁設計與配色技術精粹.北京:清華大學出版社,2007.6</p><p>　　[2].呂洋波. Dreamweaver+

53、ASP動態(tài)網站開發(fā)從入門到精通.北京:清華大學出版社,2007.6</p><p>　　[3].黃雷 楊志 游坤.ASP+HTML+ Dreamweaver+Access開發(fā)動態(tài)網站實例薈萃.北京:機械工業(yè)出版社,2006.2</p><p>　　[4].鄭小玲.Access 2003中文版實用教程.北京:清華大學出版社,2004.8</p><p>　　[5].王

54、健南.ASP數據庫管理項目方案精解.北京:航空工業(yè)出版社,2006.10</p><p>　　[6].陸黎明. ASP+Access+Dreamweaver 動態(tài)網站開發(fā)從入門到實踐.北京:機械工業(yè)出版社,2007.9</p><p>　　[7]. 陳季.ASP快速建站全程實錄. 北京:電子工業(yè)出版社</p><p>　　[8].王志剛.Photoshop CS2