四川理工學(xué)院成都新華學(xué)院十周年校慶網(wǎng)站設(shè)計畢業(yè)論文

1、 畢業(yè)論文（設(shè)計）課題名稱：四川理工學(xué)院成都新華學(xué)院十周年校慶網(wǎng)站設(shè)計年級專業(yè)： 2009級計算機網(wǎng)絡(luò)技術(shù) 學(xué) 號： 姓 名： 指導(dǎo)教師： 2012年 4 月10 日畢 業(yè) 論 文（設(shè)計）任 務(wù) 書姓 名 學(xué) 號 2009年級計算機網(wǎng)絡(luò)技術(shù) 專業(yè)題 目四川理工學(xué)院成都新華學(xué)院十周年校慶設(shè)計任務(wù)1、 設(shè)計一個校慶網(wǎng)站，包括首頁、用戶登錄、校慶新聞報道、圖片展、十大成就評選、嘉賓在線與網(wǎng)友互動以及留言板。2、 能夠在線進行用戶的注冊。3、 以上幾個欄目有不同分類的子欄目。4、 圖片展具有圖片幻燈片片功能，并允許普通用戶上傳，允許注冊用戶評論。5、 能對十大成就進行投票評選。6、 能夠?qū)崿F(xiàn)嘉賓在線與

2、網(wǎng)友互動7、 用戶能夠就行在線留言，并且管理員能對留言就行敏感詞匯的過濾。時間進度2011年11月20日教師和同學(xué)雙向選定畢業(yè)設(shè)計題目，教師進行選題指導(dǎo)，學(xué)生獨立進行課題論證，完成畢業(yè)論文（設(shè)計）任務(wù)書2011年12月20日完成畢業(yè)論文（設(shè)計）初步構(gòu)想框架 2012年3月10日自己獨立完善課題的基本內(nèi)容及電子文檔的編寫，完成畢業(yè)論文（設(shè)計）初稿2012年4月15日自己獨立完善課題的基本內(nèi)容及電子文檔的編寫，完成畢業(yè)論文（設(shè)計）終稿主要參考文獻 和原始資料(1) 主編 白萍 清華大學(xué)出版實用軟件工程與實訓(xùn) (2) 主編 張曉明 中國鐵道出版計算機網(wǎng)絡(luò)編程技術(shù) (3) 主編 楊選輝 清華大學(xué)出版網(wǎng)

3、頁設(shè)計與制作教程 (4) 主編 賀平 清華大學(xué)出版flash動畫設(shè)計與制作(5) 主編 劉枝盛 高等教育出版web編程實用技術(shù)教程(6) 主編 徐磊 清華大學(xué)出版網(wǎng)頁制作與網(wǎng)站建設(shè)技術(shù)大全(7) 主編 王萍萍 清華大學(xué)出版asp+dreamweaver動態(tài)網(wǎng)站開發(fā) 指導(dǎo)教師： 摘要 四川理工學(xué)院成都新華學(xué)院坐落于成都市郫縣犀浦鎮(zhèn)，毗鄰國家級高新技術(shù)產(chǎn)業(yè)工發(fā)區(qū)成都市高新西區(qū)。隨著時間的推移，四川理工學(xué)院成都新華學(xué)院不知不覺已在成都立足了十年之久，為回顧學(xué)校歷史，展示辦學(xué)成就，展望美好未來，激勵師生、校友愛校興校的精神，增強社會各界關(guān)心、支持我校辦學(xué)的熱情，凝聚個方力量，推動學(xué)校全面、快速、可持續(xù)

4、發(fā)展，特籌備十周年校慶。本文就校慶網(wǎng)站的規(guī)劃與建設(shè)，以軟件工程的方法對全過程進行了分析與研究。本文的主要工作集中在：1、 對網(wǎng)站設(shè)計的思想進行概述，并對網(wǎng)站開發(fā)過程中使用的開發(fā)工具和技術(shù)作了簡單的介紹。2、 對網(wǎng)站設(shè)計進行總體分析與設(shè)計。3、 使用dreamweaver+iis+sql技術(shù)對校慶網(wǎng)站進行詳細設(shè)計，并實現(xiàn)網(wǎng)站的各個功能。4、 校慶網(wǎng)站設(shè)計完成后進行發(fā)布與后期維護。關(guān)鍵詞：校慶、網(wǎng)站、dreamweaver、iis、access、維護【abstract】：sichuan university of xinhua college is located in chengdu xipuz

5、hen chengdu pi county recently, adjacent to national high and new technology industry industrial development zone-chengdu city west high. with the passage of time, the sichuan university of chengdu xinhua college before you know it has set up a file in the chengdu based on the 10 years, to review th

6、e school history, running the show achievement, look to the bright future, motivate the teachers and students, alumni and the spirit of the love school, enhance the social from all walks of life who care about and support the enthusiasm of our school, gathered a party push school comprehensive, rapi

7、d and sustainable development, especially for the tenth anniversary celebration.【keywords】：anniversary, a web site, dreamweaver, iis, access, maintenance目 錄第1章 概論11.1、設(shè)計思想11.2、網(wǎng)站功能要求21.3 開發(fā)工具的選用及介紹21.3.1、什么是dreamweaver21.3.2、macromedia dreamweaver mx 2004 介紹：21.4 關(guān)系型數(shù)據(jù)庫的選擇31.4.1 access31.4.2 sql ser

8、ver3第2章 網(wǎng)站總體分析與設(shè)計42.1 網(wǎng)站系統(tǒng)分析42.2 網(wǎng)站的創(chuàng)建42.2.1 創(chuàng)建站點42.2.2 創(chuàng)建網(wǎng)頁文件42.3 數(shù)據(jù)庫的鏈接52.4 數(shù)據(jù)庫設(shè)計6第3章 詳細設(shè)計83.1 校慶首頁83.1.1 功能93.1.2 組成構(gòu)造93.2 系統(tǒng)數(shù)據(jù)庫113.2.1 數(shù)據(jù)庫的分析113.2.2 數(shù)據(jù)表的結(jié)構(gòu)12第四章 網(wǎng)站的具體實現(xiàn)144.1 網(wǎng)站的開發(fā)基本步驟144.2具體實現(xiàn)14第五章總結(jié)16致謝21參考文獻22引 言 在internet飛速發(fā)展的今天，互聯(lián)網(wǎng)成為人們快速獲取、發(fā)布和傳遞信息的重要渠道，它在人們政治、經(jīng)濟、生活等各個方面發(fā)揮著重要的作用。internet上發(fā)布信息

9、主要是通過網(wǎng)站來實現(xiàn)的，獲取信息也是要在internet“海洋”中按照一定的檢索方式將所需要的信息從網(wǎng)站上下載下來。因此網(wǎng)站建設(shè)在internet應(yīng)用上的地位顯而易見，它已成為政府、企事業(yè)單位信息化建設(shè)中的重要組成部分，從而倍受人們的重視。為了更好的辦學(xué)，慶祝學(xué)校建校十周年，提高學(xué)校知名度，特構(gòu)四川理工學(xué)院成都新華學(xué)院學(xué)校網(wǎng)站。建立學(xué)院網(wǎng)站有以下作用： (1) 學(xué)院網(wǎng)站是學(xué)院的“商標(biāo)”。在這個高度信息化的社會里，建立學(xué)院自己的網(wǎng)站是最直接的宣傳手段。網(wǎng)站的超時空特性，不僅能讓本地區(qū)的人們了解學(xué)院，更可讓世界了解學(xué)院。 (2) 學(xué)院有巨大的教育資源，網(wǎng)站是實現(xiàn)教育資源分配的橋梁，它使每一位教師和

10、學(xué)生都能均等的得到培訓(xùn)和受教育的機會，能極大的提高教學(xué)效率。 (3) 學(xué)院網(wǎng)站能提供教學(xué)互動的全新方式，學(xué)院網(wǎng)站使得教師與教師、教師與學(xué)生、學(xué)生與學(xué)生之間的交流有了全新的方式，它不再受到傳統(tǒng)課堂的制約。它可以使不同的學(xué)院同處一室，共同討論，共同提高。地理上的界限在這里模糊和消失了，學(xué)院網(wǎng)站是真正沒有圍墻的學(xué)院。 (4) 學(xué)院網(wǎng)站能夠提供個性化的學(xué)習(xí)平臺，不同的學(xué)生理解世界的方式各不相同，認(rèn)知世界有諸多方式。網(wǎng)絡(luò)提供的豐富資源可以使學(xué)生尋覓不同的教育方式，各取所需。學(xué)院網(wǎng)站允許不同的學(xué)生沿著自己的途徑，按自己的速度接受教育與學(xué)習(xí)，學(xué)生將有機會享受最佳的教育機會，充分發(fā)掘自己的內(nèi)在潛力，培植獨特的

11、個性和人格。 (5) 學(xué)院網(wǎng)站是最佳的教學(xué)研究室，學(xué)院網(wǎng)站與教育類專門網(wǎng)站的有效鏈接，給學(xué)院教學(xué)研究帶來了一片新天地，各種優(yōu)秀教案、專家論壇、網(wǎng)絡(luò)觀摩課、各科素材、多媒體課件制作等內(nèi)容為教師教研提供了極佳的平臺。有效地降低教研成本、提高效率。 第1章 概論在已跨入21世紀(jì)的今天，計算機網(wǎng)絡(luò)的應(yīng)用越來越普及，人類使用和學(xué)習(xí)信息的方式以及信息的包裝方式正在進行著不可阻擋的革命，這次革命將比印刷術(shù)的出現(xiàn)所產(chǎn)生的影響以及對社會發(fā)展的推動遠為復(fù)雜而巨大。目前，我國上網(wǎng)的人口已達一億，成為世界上網(wǎng)民最多的國家，許多人在需要查詢信息，首先想到的就是上網(wǎng)。網(wǎng)站的迷人之處在于綜合使用文本、圖形、圖像、聲音、動畫

12、以及視頻的信息和內(nèi)容，具有豐富的多媒體表現(xiàn)與互動特點，無可置疑，網(wǎng)站已成為最吸引人的，也最有效的信息傳遞手段和方式。因此，網(wǎng)站建設(shè)在internet應(yīng)用上的地位顯而易見，它已成為政府、企事業(yè)單位信息化建設(shè)中得最重要的組成部分，從而倍受人們的重視，在未來的發(fā)展中占據(jù)著不可磨滅的地位，是人們生活中不可缺少的部分。1.1、設(shè)計思想通過學(xué)校校慶網(wǎng)站，全面宣傳，展示校園風(fēng)采、優(yōu)點與特色，以及獨特的一面。發(fā)布學(xué)校的重大新聞，增強同學(xué)之間的相互聯(lián)系，提高辦事效率。網(wǎng)站結(jié)構(gòu)示意圖：1.2、網(wǎng)站功能要求設(shè)計一套基于數(shù)據(jù)庫的信息即使發(fā)布系統(tǒng)，可用于各類信息的實時發(fā)布，前臺用戶可通過頁面瀏覽查詢，用戶可以自己上傳圖

13、片，但是通過管理員審核，后臺可以動態(tài)管理圖片、文字等多類信息、用戶管理等，可以通過后臺管理實現(xiàn)網(wǎng)站實時的更新，讓外界更多的了解四川理工學(xué)院成都新華學(xué)院十周年校慶網(wǎng)站。1.3 開發(fā)工具的選用及介紹1.3.1、什么是dreamweaver dreamweaver是美國macromedia公司開發(fā)的集web頁制作和管理網(wǎng)站于一身的所見即所得web頁編輯器，它是第一套針對專業(yè)web頁設(shè)計師的視覺化web頁開發(fā)工具，利用它可以輕而易舉地制作出跨越平臺限制和跨越瀏覽器限制的充滿動感的web頁。 說到macromedia公司大家不會感到陌生，著名的多媒體開發(fā)工具authorware和director均出自該

14、公司的旗下，以及目前在互聯(lián)網(wǎng)(internet)上越來越流行的網(wǎng)絡(luò)多媒體開發(fā)工具flash也是出自該公司的旗下。而dreamweaver則是macromedia公司繼flash以后向互聯(lián)網(wǎng)(internet)推出的又一夢幻工具。dreamweaver、flash以及在dreamweaver推出的針對專業(yè)web頁圖像設(shè)計的fireworks，三者被macromedia公司稱為“網(wǎng)絡(luò)三劍客”，足見市場的反響和macromedia公司對它們的自信。1.3.2、macromedia dreamweaver mx 2004 介紹： 一個可視化的網(wǎng)頁設(shè)計和網(wǎng)站管理工具，支持最新的web技術(shù)，包含html檢

15、查、html格式控制、html格式化選項、homesite/bbedit捆綁、可視化網(wǎng)頁設(shè)計、圖像編輯、全局查找替換、全ftp 功能、處理flash和shockwave等富媒體格式和動態(tài)html、基于團隊的web創(chuàng)作。在編輯上你可以選擇可視化方式或者你喜歡的源碼編輯方式。 dreamweaver mx 2004 的十大新特性: 1.動態(tài)跨瀏覽器驗證:自動檢測標(biāo)簽和css規(guī)則來適應(yīng)所有主流瀏覽器! 2.更強大的css支持! 3.內(nèi)建的圖形編輯引擎:修剪,改變大小,尺寸,旋轉(zhuǎn)角度,調(diào)節(jié)明暗度都不需要離開dreamweaver環(huán)境,因為它本身集成了fw的基本圖形編輯技術(shù).(這一點有模仿frontpa

16、ge的嫌疑,但這個功能確實很實用)! 4.安全ftp:完全加密傳輸保證文件和帳號信息的安全!5.增強對當(dāng)今技術(shù)的支持:支持當(dāng)今主流的開放環(huán)境:coldfusion,j2ee,php,.net,和其他主流的服務(wù)器技術(shù).dreamweaver現(xiàn)在加入了xml命名空間支持,asp.net表單控件對象,新的參考書內(nèi)容和新的php服務(wù)器端行為! 6.無縫整合外部文件和代碼:直接將word和excel文檔復(fù)制和粘貼到dreamweaver中,會保留字體,顏色,css樣式表信息.使用,使用系統(tǒng)支持的編碼保存任何字體,包括雙字節(jié)字符集. 7.緊密整合mm的其他工具:加強了和mm其他幾款產(chǎn)品的協(xié)同工作能力.例如

17、:你可以通過dw直接設(shè)置flash組件的參數(shù). 8.基本支持改良:插入條,表格工具都有改進! 9.增強代碼編寫工具:編輯代碼更省時,例如右鍵編寫代碼工具,增強的查找和替換,高效的屬性面板. 10.改進的設(shè)計開放環(huán)境:一個改良的用戶界面,更高的實用性,非常親切和有邏輯,讓你快速找到你想要的東西,一個新的開始屏幕讓你快速訪問最近的文件和教程資源.1.4 關(guān)系型數(shù)據(jù)庫的選擇1.4.1 accessmicrosoft access是一種桌面數(shù)據(jù)庫，存儲方式簡單，易于維護管理，只適合數(shù)據(jù)量少的應(yīng)用，在處理少量數(shù)據(jù)和單機訪問的數(shù)據(jù)庫時是很好的，效率也很高；界面友好、易操作，集成環(huán)境、處理多種數(shù)據(jù)信息，支持

18、廣泛，易于擴展，彈性較大。但是它的同時訪問客戶端不能多于4個。microsoft access數(shù)據(jù)庫有一定的極限，如果數(shù)據(jù)達到100m左右，很容易造成服務(wù)器iis假死，或者消耗掉服務(wù)器的內(nèi)存導(dǎo)致服務(wù)器崩潰。第2章 網(wǎng)站總體分析與設(shè)計2.1 網(wǎng)站系統(tǒng)分析根據(jù)前面的設(shè)計思想進行分析，按照系統(tǒng)開發(fā)的基本觀點進行對網(wǎng)站進行分解，從內(nèi)容上可對網(wǎng)站作如下劃分： 校慶首頁 學(xué)校介紹 校慶新聞報道 學(xué)校圖片展 學(xué)校十大成就評選 嘉賓在線與網(wǎng)友互動 留言板2.2 網(wǎng)站的創(chuàng)建2.2.1 創(chuàng)建站點創(chuàng)建站點的具體步驟如下: 首先在本地硬盤上建立一個文件夾，用來存放將要制作的站點。 運行dreamweaver mx 2

19、004，選擇“站點”|“管理站點”菜單命令，彈出“管理站點”對話框，在對話框中單擊“新建”|“站點”選項 在彈出的對話框中輸入新建站點的名字“四川理工學(xué)院成都新華學(xué)院十周年校慶”，再單擊“下一步”按鈕。 在彈出的對話框中選擇“是，我想使用服務(wù)器技術(shù)?！眴螕簟跋乱徊健卑粹o。 在彈出的對話框中選擇“編輯我的計算機上的本地副本，完成后再上傳到服務(wù)器（推薦）”單選按鈕，然后在下面的文本框中選擇“c:documents and settingsadministrator桌面四川理工成都新華學(xué)院十周年校慶”文件夾下，單擊“下一步”按鈕。 在彈出的對話框中選擇“無”選項，單擊“下一步”按鈕。 在彈出的對話框

20、中認(rèn)真閱讀設(shè)置好的信息，確認(rèn)無誤后單擊“完成”按鈕。 出現(xiàn)“管理站點”對話框，其中顯示了新建的站點，單擊“完成”按鈕。2.2.2 創(chuàng)建網(wǎng)頁文件選擇“文件”|“新建”菜單命令，彈出“新建文檔”對話框，從各種預(yù)先設(shè)計好的頁面類別中選擇“基本頁”|“html”，然后單擊“創(chuàng)建”按鈕即可。2.3 數(shù)據(jù)庫的鏈接 1：鏈接用戶數(shù)據(jù)源，如下圖： 2：選擇數(shù)據(jù)庫的路徑，如下圖： 3：選擇數(shù)據(jù)庫的驅(qū)動程序，如下圖： 4：鏈接建立并測試，如下圖：2.4 數(shù)據(jù)庫設(shè)計采用的數(shù)據(jù)庫是microsoft access ，擬建立db2.mdb庫文件，如：用戶登錄信息表，注冊表，投票表計數(shù)等二十張表。如下圖：第3章 詳細設(shè)計

21、3.1 校慶首頁網(wǎng)站主頁采用靜、動相結(jié)合的方式，即靜態(tài)的主畫面和動態(tài)的圖片相結(jié)合，體現(xiàn)學(xué)校的勃勃生氣，動靜相結(jié)合的主頁方式介紹學(xué)校風(fēng)采、優(yōu)點特色、信息發(fā)布，校務(wù)活動，展現(xiàn)出了校慶網(wǎng)站的總體結(jié)構(gòu)和思想。利用asp與數(shù)據(jù)庫結(jié)合的技術(shù)建立數(shù)據(jù)庫查詢管理系統(tǒng)，采用交互式的動態(tài)的web畫面來實現(xiàn)，使得網(wǎng)站主頁主題鮮明、內(nèi)容豐富，大家能更快的了解到校慶活動的動態(tài)信息，方便大家產(chǎn)于其中，突出活動主題。設(shè)計效果圖如下：3.1.1 功能 用戶注冊，用戶登錄，對校園成就進行投票，校園圖片展，校園新聞，留言板，在線搜索。3.1.2 組成構(gòu)造共分成8大部分： 1：用戶可以自己注冊，登錄并獲得不同的瀏覽權(quán)限。如下圖：2

22、. 對學(xué)校的各類成就進行投票，評選出優(yōu)秀的。如下圖：3. 瀏覽圖片展可以清晰的看出每個角落的精彩畫面。如下圖：4. 滾動播放出各個方面的即時新聞，如下圖：5. 可以在線搜尋你想了解的新聞，成就等，如下圖：6. 在線留言，如下圖：7. 版權(quán)所有，如下圖：8. 友情鏈接，如下圖：3.2 系統(tǒng)數(shù)據(jù)庫 3.2.1 數(shù)據(jù)庫的分析 web應(yīng)用跟著我的管理用戶狀態(tài)行為主要有兩種措施：一是使用session或cookies保存用戶活躍期間的信息，但是這些信息在會話結(jié)束將不再存在。對于那些需要永久保存的信息，如：用戶的注冊資料等信息由于數(shù)據(jù)量較大必須通過數(shù)據(jù)庫進行存儲。并提供良好的方式進行查詢，插入，修改和刪除

23、。 3.2.2 系統(tǒng)構(gòu)思 校園的前臺包括首頁、學(xué)校概況、新聞、圖片展、十大成就評選、留言板、在線搜索、網(wǎng)站版權(quán)等模塊。如下圖：首頁學(xué)校概況校園新聞圖片展成就評選管理系統(tǒng)留言板模塊管理信息管理在線搜索3.2.2 數(shù)據(jù)表的結(jié)構(gòu) 校園網(wǎng)站數(shù)據(jù)表如下：第四章 網(wǎng)站的具體實現(xiàn) 4.1 網(wǎng)站的開發(fā)基本步驟 創(chuàng)建頁面和使用asp.net應(yīng)用程序大致可分為4個步驟：（1） 收集材料；（2） 建立網(wǎng)站； （3） 設(shè)置屬性；（4） 布局、加載代碼和素材；（5） 保存并運行；4.2具體實現(xiàn) 本校慶網(wǎng)站采用div+css布局，布局新穎，打破了以往的傳統(tǒng)靜態(tài)網(wǎng)頁結(jié)構(gòu)，以紅色為主色調(diào)，象征著青春活力，充滿著勃勃生機，充分

24、的渲染了校慶活動的主題。 首頁名為：index，首頁界面如下圖：第五章 總結(jié) 此次畢業(yè)設(shè)計，從選題到實現(xiàn)，一開始是茫然，然后慢慢進入狀態(tài)，從最初到整個網(wǎng)站的設(shè)計，到代碼的編輯，然后到思路逐步清晰，整個過程難以表達。在此過程中我用到了軟件工具主要有photoshop、flash、dreamweaver、access等，運用asp.net語言，開發(fā)了該校慶網(wǎng)站。在系統(tǒng)的開發(fā)過程中，多門以前抽象的課程都得到了實際應(yīng)用，再次感覺到這幾門理論課程在實踐中的重要性。在這次設(shè)計中，我更加的熟悉了實用div+css布局，div+css布局使得頁面載入更快，在修改設(shè)計時更有效率，幫助整個站點保持良好的視覺效果。在與指導(dǎo)老師的緊張交流討論中讓我對這次的任務(wù)充滿了信心，為了使我的論文做到完整精確，我在學(xué)校圖書館以及網(wǎng)上收集了大量的資料，這樣也更有利于畢業(yè)論文的撰寫，然后就將收集的資料進行仔細分類，及時拿給老師進行溝通。雖然有時候感覺很累，但是覺得過得很充實。 在本次設(shè)計過程中，我深刻感受到動手能力