【導(dǎo)讀】本文的敘述圍繞著如何實(shí)現(xiàn)一個(gè)功能完善的網(wǎng)站進(jìn)行展開。分析了設(shè)計(jì)一個(gè)網(wǎng)站所用的編輯工具和編程語言及網(wǎng)站的軟硬件開發(fā)環(huán)境。上調(diào)查，圖片等功能。頁面的組織主要是設(shè)計(jì)網(wǎng)頁之間的聯(lián)系，同時(shí)根據(jù)這些聯(lián)系實(shí)現(xiàn)網(wǎng)頁基。根據(jù)網(wǎng)頁的程序界面，表單，需要。的數(shù)據(jù)等，寫出實(shí)際的程序代碼。由于本次設(shè)計(jì)的頁面比較多，不可能盡數(shù)地寫。出全部程序的代碼，因此，主要解釋了用到的頁面設(shè)計(jì)技術(shù)。

　　

【正文】 Infor_Content39。)大 /a a href=javascript:FontZoom(39。14px39。,39。28px39。,39。Infor_Content39。)中 /a a href=javascript:FontZoom(39。12px39。,39。25px39。,39。Infor_Content39。)小 /a】 /div div id=Infor_Content {dede:} 湖南科技大學(xué)本科畢業(yè)設(shè)計(jì)（論文） 19 /divbrul class=uc_lanmu_pn li class=uc_lanmu_prevtitle style=display:{dede:prenext get=39。pre39。/} /lili class=uc_lanmu_nexttitle style=display: {dede:prenext get=39。next39。/}/li/ul 湖南科技大學(xué)本科畢業(yè)設(shè)計(jì)（論文） 20 第 六 章 測試與分析 網(wǎng)站 測試目的是驗(yàn)證 網(wǎng)站 是否滿足了需求規(guī)格的定義，找出與需求規(guī)格不符或與之矛盾的地方，從而提出更加完善的方案 。 測試方法 由于本網(wǎng)站是基于 DedeCMS 的開發(fā)，而 DedeCMS 已相當(dāng)?shù)某墒?，因此，對于網(wǎng)站的后臺，我們無需測試。對于本網(wǎng)站而言，需要測試 的主要有一下兩點(diǎn)： （ 1）瀏覽器兼容性 瀏覽器最重要或者說核心的部分是 “Rendering Engine”，可大概譯為 “解釋引擎 ”，不過我們一般習(xí)慣將之稱為 “瀏覽器內(nèi)核 ”。負(fù)責(zé)對網(wǎng)頁語法的解釋（如 HTML、 JavaScript）并渲染（顯示）網(wǎng)頁。 所以，通常所謂的瀏覽器內(nèi)核也就是瀏覽器所采用的渲染引擎，渲染引擎決定了瀏覽器如何顯示網(wǎng)頁的內(nèi)容以及頁面的格式信息。不同的瀏覽器內(nèi)核對網(wǎng)頁編寫語法的解釋也有不同，因此同一網(wǎng)頁在不同的內(nèi)核的瀏覽器里的渲染（顯示）效果也可能不同，這也是網(wǎng)頁編寫者需要在不同內(nèi)核的瀏覽 器中測試網(wǎng)頁顯示效果的原因。 目前，瀏覽器的內(nèi)核有很多，但比較常見的只有四種： Trident、 Gecko、 Presto 和Webkit，其代表性瀏覽器分別是： IE、 FireFox、 Opera 和 Safari。因此，網(wǎng)站的兼容性在上述四款瀏覽器中測試即可。其中，對于 IE 的測試，是通過 IETester 軟件模擬測試的。 IETester 是一款 IE 網(wǎng)頁兼容性測試工具，這款軟件可以測試網(wǎng)頁在 、 IE IE7和 IE8 中的顯示情況。 （ 2）網(wǎng)站的訪問速度 對于一個(gè)網(wǎng)站來說，提高用戶體驗(yàn)最主要的一點(diǎn)就是網(wǎng)頁的打開速度。 事實(shí)證明，一個(gè)反應(yīng)緩慢的網(wǎng)站是不會受用戶欣賞的。網(wǎng)站的網(wǎng)速可以通過網(wǎng)速測試服務(wù)網(wǎng)站和網(wǎng)站載入速度測試工具進(jìn)行測試，本網(wǎng)站通過這兩種方式共同測試。 網(wǎng)速測試服務(wù)網(wǎng)站選用的是卡卡網(wǎng)： 網(wǎng)站，其 提供對網(wǎng)速測試網(wǎng)速檢測網(wǎng)站速度測試的詳細(xì)測速統(tǒng)計(jì)報(bào)告 ， 卡卡網(wǎng)目前在全國 15 個(gè)省市、美國、澳大利亞、日本、英國等 8 個(gè)國家均設(shè)有網(wǎng)速測試點(diǎn)， 可以對 網(wǎng)站在國內(nèi)及國外訪問速度 進(jìn)行測試。 網(wǎng) 站載入速度測試工具選用的是 Fiddler。 Fiddler 是一個(gè) 調(diào)試代理，它能夠記錄所有的你電腦和互聯(lián)網(wǎng)之間的 通訊， Fiddler 可以也可以讓你檢查所有的 通訊，設(shè)置斷點(diǎn)，以及 Fiddler 所有的 “進(jìn)出 ”的數(shù)據(jù)（指 cookie,html,js,css 等文件） ，同時(shí)也可獲得頁面加載所消耗的時(shí)間，也可對網(wǎng)站進(jìn)行全球網(wǎng)站性能分析。 湖南科技大學(xué)本科畢業(yè)設(shè)計(jì)（論文） 21 測試環(huán)境 網(wǎng)站是在 服務(wù)器環(huán)境下運(yùn)行的， 服務(wù)器是目前應(yīng)用最為廣泛的 Inter服務(wù)器之一，用戶只要通過“瀏覽器”就可以非常方便地訪問 Inter，獲得所需的信息。 的組成如圖所示： 圖 41 網(wǎng)示意圖 瀏覽器和服務(wù)器之間的信息交換使用超文本傳輸協(xié)議（ HyperText Transfer Protocol，HTTP）。基于 HTTP 協(xié)議的萬維網(wǎng)實(shí)際上是一個(gè)大規(guī)模的、在線式的信息倉庫，是一個(gè)支持交互式訪問的分布式超媒體系統(tǒng)。 測試結(jié)果 （ 1） 兼容性測試 主要針對 IE、 FireFox、 Opera 和 Safari 這四 款 主流 瀏覽器對網(wǎng)站進(jìn)行兼容性測試，測試內(nèi)容主要包括網(wǎng)站主頁、列表頁和 內(nèi)容頁的排版、布局和腳本的運(yùn)行情況。 測試結(jié)果如表 所示。 WEB 服務(wù)器 域名服務(wù)器 客戶瀏覽器 Browser 因特網(wǎng) HTTPD DNS 湖南科技大學(xué)本科畢業(yè)設(shè)計(jì)（論文） 22 表 兼容性測試結(jié)果表 布局 腳本運(yùn)行情況 主頁 IE6 正常 正常 IE7 正常 正常 IE8 正常 正常 FireFox 正常 正常 Opera 正常 正常 Safari 正常 正常 列表頁 IE6 正常 正常 IE7 正常 正常 IE8 正常 正常 FireFox 正常 正常 Opera 正常 正常 Safari 正常 正常 列表頁 IE6 正常 正常 IE7 正常 正常 IE8 正常 正常 FireFox 正常 正常 Opera 正常 正常 Safari 正常 正常 下載頁 IE6 正常 正常 IE7 正常 正常 IE8 正常 正常 FireFox 正常 正常 Opera 正常 正常 Safari 正常 正常 （ 2） 訪問速度測試 1） 卡卡網(wǎng)測試結(jié)果 國內(nèi)檢測點(diǎn)測試 結(jié)果 如圖 、 所示 ： 圖 國內(nèi)檢測點(diǎn) 檢測結(jié)果 圖 湖南科技大學(xué)本科畢業(yè)設(shè)計(jì)（論文） 23 圖 國內(nèi)檢各測點(diǎn)測試結(jié)果圖 港臺及 國外測試點(diǎn)測試結(jié)果 如圖 、 所示 ： 圖 港臺及國 外測試點(diǎn) 檢測結(jié)果 圖 湖南科技大學(xué)本科畢業(yè)設(shè)計(jì)（論文） 24 圖 港臺及國外各測試點(diǎn)測試結(jié)果圖 2） Fiddler 測試結(jié)果 實(shí)際性能： Aggregate Session time: 00:00:01:1875s Sequence (clock) time: 00:00: DNS Lookup time: 47ms 全球網(wǎng)站性能估計(jì) 如表 所示。 表 全球網(wǎng)站性能估計(jì)表 Round trip cost Elapsed time 美國西海岸（ modem6kb/sec） 日本、北歐（ modem） 中國（ modem） 美國西海岸（ DSL 30kb/sec） 日本、北歐（ DSL） 中國（ DSL） 運(yùn)行效果 圖 網(wǎng)站主頁效果圖如 所示 湖南科技大學(xué)本科畢業(yè)設(shè)計(jì)（論文） 25 圖 主頁 效果 圖 列表頁效果圖如圖 所示 湖南科技大學(xué)本科畢業(yè)設(shè)計(jì)（論文） 26 圖 列表頁 效果 圖 內(nèi)容頁效果圖如圖 所示 圖 內(nèi)容頁 效果 圖 下載列表效果圖如圖 所示。 湖南科技大學(xué)本科畢業(yè)設(shè)計(jì)（論文） 27 圖 下載列表 效果 圖 后臺管理頁面如圖 所示 。 圖 后臺 效果 圖 湖南科技大學(xué)本科畢業(yè)設(shè)計(jì)（論文） 28 測試結(jié)果 通過網(wǎng)站的兼容性測試和網(wǎng)站的訪問速度測試，可以看出，網(wǎng)站在目前主流瀏覽器中的瀏覽效果是一致的，并且網(wǎng)站的瀏覽 加載 速度較快 ，達(dá)到了預(yù)期的網(wǎng)站要求。 湖南科技大學(xué)本科畢業(yè)設(shè)計(jì)（論文） 29 總 結(jié) 以前從未想過畢業(yè)設(shè)計(jì)是怎樣的一件工作，怎樣去想辦法做好，時(shí)間過得很快，畢業(yè)設(shè)計(jì)就要接近尾聲了，我是抱著以前學(xué)過網(wǎng)頁制作這門課和個(gè)人對網(wǎng)頁制作的喜愛來選的，因?yàn)橛X得還有所熟悉。在大三的上半學(xué)期我學(xué)習(xí)了Dreamweaver CS3 網(wǎng)頁設(shè)計(jì)，我曾做過一個(gè)個(gè)人網(wǎng)站，那時(shí)是根據(jù)課本和當(dāng)時(shí)所學(xué)知識來按部就班的 做， 初次接觸網(wǎng)站設(shè)計(jì)，認(rèn)識的到網(wǎng)站設(shè)計(jì)是一門很有意思的設(shè)計(jì)題目，所以我的選題是正確的?？梢允刮彝段宜?，揚(yáng)我所長。 畢業(yè)設(shè)計(jì)不同于實(shí)訓(xùn)設(shè)計(jì)，也不同于平常的大型作業(yè)，要有重視的態(tài)度，這樣才可以順利完成。在制作網(wǎng)頁過程中我有很深的體會。 以前所學(xué)知識不夠牢固，而掌握牢固的不能更好更靈活的運(yùn)用。 理論基礎(chǔ)知識掌握不夠深刻，在網(wǎng)站的運(yùn)行環(huán)境分析時(shí)感覺有點(diǎn)吃力，無從下手，只有把課本翻出來再看一遍。 最重要的是整個(gè)網(wǎng)站的構(gòu)思不夠獨(dú)特，沒有太深的創(chuàng)意，很多是根據(jù)其他學(xué)院的軟件學(xué)院的網(wǎng)站模板來做，吸取他人的 精華。 通過這次的畢業(yè)設(shè)計(jì)我深刻認(rèn)識到做每一件事都要有耐心，認(rèn)真的態(tài)度去對待，這樣才會實(shí)現(xiàn)自己心中所理想的效果。 在以后的學(xué)習(xí)和生活中要嚴(yán)格要求自己，基礎(chǔ)知識在掌握的基礎(chǔ)上要更好的去應(yīng)用。 湖南科技大學(xué)本科畢業(yè)設(shè)計(jì)（論文） 30 參考文獻(xiàn) [1] 三揚(yáng)科技 .PHP 開發(fā)入行真功夫 [M].電子工業(yè)出版社， [2]（美）迪布瓦 .MySQL Cookbook：第二版（中文版） [M].電子工業(yè)出版社， [3] 張海藩 .軟件工程 [M].清華大學(xué)出版社 ,2021 [4]（?。?. JQuery 攻略 [M].人 民郵電出版社， [5] Andy Budd， Simon Collision， Cameron CSS：高級 Web標(biāo)準(zhǔn)解決方案（第 2版） [M].人民郵電出版社， [6] . 湖南科技大學(xué)本科畢業(yè)設(shè)計(jì)（論文） 31 致 謝 回首既往，自己一生最寶貴的時(shí)光能于這樣的校園之中，能在眾多學(xué)富五車、才華橫溢 的老師們的熏陶下度過，實(shí)是榮幸之極。在這四年的時(shí)間里，我在學(xué)習(xí)上和思想上都受益非淺。這除了自身努力外，與各位老師、同學(xué)和朋友的關(guān)心、支持和鼓勵(lì)是分不開的 。 論文的寫作是枯燥艱辛而又富有挑戰(zhàn)的。 網(wǎng)站設(shè)計(jì) 是 網(wǎng)絡(luò)技術(shù)上 一直探討的熱門話題，老師的諄諄誘導(dǎo)、同學(xué)的出謀劃策及家長的支持鼓勵(lì)，是我堅(jiān)持完成論文的動(dòng)力源泉。在此，我特別要感謝我的導(dǎo)師 王宇棟 老師。從論文的選題、文獻(xiàn)的采集、框架的設(shè)計(jì)、結(jié)構(gòu)的布局到最終的論文定稿，從內(nèi)容到格式，從標(biāo)題到標(biāo)點(diǎn)， 他 都費(fèi)盡心血。沒有 袁 老師的辛勤栽培、孜孜教誨，就沒有我論文的順利完成。寫 作畢業(yè)論文是一次再系統(tǒng)學(xué)習(xí)的過程，畢業(yè)論文的完成，同樣也意味著新的學(xué)習(xí)生活的開始。 再次感謝學(xué)院的大力支持，指導(dǎo)老師的精心指導(dǎo)，為此表示衷心感謝！