網(wǎng)站設(shè)計與實現(xiàn)畢業(yè)設(shè)計報告

1、<p>　　瀘 州 職 業(yè) 技 術(shù) 學 院</p><p><b>　　畢業(yè)設(shè)計報告</b></p><p>　　瀘州職業(yè)技術(shù)學院紀檢監(jiān)審部網(wǎng)站設(shè)計與實現(xiàn)</p><p>　　2012年11月20日</p><p>　學生姓名翟佳佳</p><p>　所 在 系信息工程系</p&g

2、t;<p>　班 級10計應(yīng)1班</p><p>　專 業(yè)計算機應(yīng)用技術(shù)</p><p>　指導(dǎo)教師陳長憶 副教授</p><p><b>　　摘 要</b></p><p>　　隨著經(jīng)濟社會的發(fā)展，計算機已被應(yīng)用到社會生活的各個領(lǐng)域。與此同時，互聯(lián)網(wǎng)作為信息技術(shù)的通信橋梁連接著全球的計算機，

3、而網(wǎng)站作為網(wǎng)絡(luò)信息主要的表現(xiàn)形式而且還是互聯(lián)網(wǎng)信息的主要承載者，在Internet上表現(xiàn)出重要的地位，并發(fā)揮著極其重要的作用。無論是在國內(nèi)還是國外都得以迅速的發(fā)展和壯大，并被人們重視和關(guān)注?；ヂ?lián)網(wǎng)已經(jīng)徹底的改變了世界，互聯(lián)網(wǎng)的世界里蘊藏著無限的可能，在這種情況下，各行各業(yè)及其個人、單位、工廠、企事業(yè)等等在網(wǎng)上構(gòu)筑屬于自己的網(wǎng)絡(luò)信息平臺，保護自己的網(wǎng)絡(luò)資源并在互聯(lián)網(wǎng)上開辟自己的市場和消費群體，以及構(gòu)造自己的數(shù)字化世界和加強全球范圍內(nèi)不同地

4、域的人們聯(lián)系交流等等活動也就顯的日益重要。于是各種各樣的網(wǎng)站便如雨后春筍般地出現(xiàn)魚龍混雜且良莠不齊。Internet的日益興起和以網(wǎng)頁為載體的網(wǎng)絡(luò)信息的廣泛傳播和應(yīng)用，使得網(wǎng)站的建設(shè)及網(wǎng)頁制作得到發(fā)展的空間，大至大型企業(yè)的產(chǎn)品推銷、售后服務(wù)、解決方案，小至個人Web頁面開發(fā)，形形色色，五彩繽紛，網(wǎng)站建設(shè)和網(wǎng)頁制作也成為計算機網(wǎng)絡(luò)領(lǐng)域最熱門的話題。</p><p>　　本論文主要針對紀檢監(jiān)審處網(wǎng)站的設(shè)計以及實現(xiàn)作了

5、詳細的論述。為了使學院部門網(wǎng)站得到全面改制，更加能夠展示學院部門風采、優(yōu)點與特色，從而增加人們對學院紀檢監(jiān)審處的了解，首先，我去了學院紀檢監(jiān)審部，根據(jù)紀檢監(jiān)審部老師的要求以及所提供的有關(guān)信息，建構(gòu)了紀檢監(jiān)審部網(wǎng)站。</p><p>　　關(guān)鍵詞：Internet 網(wǎng)站建設(shè) 紀檢監(jiān)審部網(wǎng)站</p><p><b>　　目 錄</b></p>

6、<p><b>　　第一章緒論1</b></p><p>　　第二章需求分析2</p><p>　　2.1 可行性分析2</p><p>　　2.1.1經(jīng)濟可行性2</p><p>　　2.1.2 操作可行性2</p><p>　　2.2 網(wǎng)站針對人群的需求分析2<

7、;/p><p>　　第三章網(wǎng)站設(shè)計4</p><p>　　3.1 開發(fā)工具Site Server CMS介紹4</p><p>　　3.2 本網(wǎng)站主要工具的使用5</p><p>　　3.2.1 Flash 動畫制作工具5</p><p>　　3.2.2 Dreamweaver 網(wǎng)頁設(shè)計工具5</p>

8、;<p>　　3.2.3 Photoshop 圖像設(shè)計軟件6</p><p>　　3.3 網(wǎng)站基本結(jié)構(gòu)圖7</p><p>　　3.4 網(wǎng)站導(dǎo)航欄的設(shè)計7</p><p>　　第四章網(wǎng)站實現(xiàn)9</p><p>　　4.1 網(wǎng)站首頁的實現(xiàn)9</p><p>　　4.1.1 公告通知9</

9、p><p>　　4.1.2 部門新聞10</p><p>　　4.1.3 圖片新聞12</p><p>　　4.1.4 友情鏈接14</p><p>　　4.1.5 站內(nèi)搜索15</p><p>　　4.2 網(wǎng)站頭部的實現(xiàn)17</p><p>　　4.2.1 顯示當日時間的主要代碼17&

10、lt;/p><p>　　4.2.2 設(shè)為首頁和加入收藏的主要代碼18</p><p>　　4.3 網(wǎng)站尾部實現(xiàn)18</p><p>　　4.4 網(wǎng)站導(dǎo)航欄目的實現(xiàn)19</p><p>　　4.5 留言板的實現(xiàn)20</p><p>　　第五章網(wǎng)站測試21</p><p>　　5.1 測試目

11、的21</p><p>　　5.2 測試環(huán)境21</p><p>　　5.3 測試內(nèi)容21</p><p>　　5.3.1 網(wǎng)站測試的主要內(nèi)容21</p><p>　　5.3.2 網(wǎng)站系統(tǒng)測試的內(nèi)容22</p><p>　　5.4 測試結(jié)果22</p><p>　　第六章網(wǎng)站發(fā)布與

12、維護23</p><p>　　6.1 申請域名23</p><p>　　6.2 空間的申請25</p><p>　　6.3 域名備案27</p><p>　　6.4 上傳網(wǎng)站27</p><p>　　6.5 網(wǎng)站維護28</p><p>　　6.5.1 網(wǎng)站后臺維護28</p

13、><p>　　6.5.2 網(wǎng)站內(nèi)容更新29</p><p>　　總 結(jié) 30</p><p>　　致 謝 31</p><p><b>　　參考文獻 32</b></p><p><b>　　緒論</b></p><p><b&g

14、t;　　前言</b></p><p>　　在信息技術(shù)飛速發(fā)展的今天，人們獲取信息的方式更多是來源于互聯(lián)網(wǎng)。而吸引瀏覽用戶的則是視覺效果出色、信息量豐富、使用起來便捷的網(wǎng)頁，所以網(wǎng)頁設(shè)計尤為重要。 互聯(lián)網(wǎng)成為人們快速獲取、發(fā)布和傳遞信息的重要渠道，它在人們政治、經(jīng)濟、生活等各個方面發(fā)揮著重要的作用。網(wǎng)頁設(shè)計伴隨著網(wǎng)絡(luò)的快速發(fā)展而快速興起，作為上網(wǎng)的主要依托，由于人們使用網(wǎng)絡(luò)的頻繁而變得非常的重要。網(wǎng)頁講

15、究的是排版布局，其功能主要就是提供一種形式給每個上網(wǎng)者，讓他們能夠了解網(wǎng)站提供的信息。</p><p><b>　　選題依據(jù)</b></p><p>　　Internet是目前世界上最大的計算機互聯(lián)網(wǎng)絡(luò)，它遍布全球，將世界各地各種規(guī)模的網(wǎng)絡(luò)連接成一個整體。作為Internet上一種先進的，易于被人們所接受的信息檢索手段，World Wide Web(簡稱WWW)發(fā)展十

16、分迅速，成為目前世界上最大的信息資源寶庫。近年來，隨著網(wǎng)絡(luò)用戶要求的不斷提高及計算機科學的迅速發(fā)展，特別是數(shù)據(jù)庫技術(shù)在Internet中的廣泛應(yīng)用，Web站點向用戶提供的服務(wù)將越來越豐富，越來越人性化。因此網(wǎng)站建設(shè)在Internet應(yīng)用上的地位顯而易見，它已成為政府、企事業(yè)單位信息化建設(shè)中的重要組成部分，從而倍受人們的重視。</p><p>　　為了使瀘州職業(yè)技術(shù)學院紀檢監(jiān)審部網(wǎng)站得到全面改制，更加能夠展示學院部

17、門風采、優(yōu)點與特色，從而增加人們對學院紀檢監(jiān)審部的了解。經(jīng)過調(diào)查，紀檢監(jiān)審部原來有本部門的網(wǎng)站，由于以前的網(wǎng)站頁面過于單一，內(nèi)容更新速度慢，所以根據(jù)紀檢監(jiān)審處老師的要求和所搜集的資料構(gòu)建一個新的網(wǎng)站。此網(wǎng)站頁面美觀，內(nèi)容更新速度快，也增加了許多新的功能。通過此網(wǎng)站可以讓用戶更快的了解瀘州職業(yè)技術(shù)學院紀檢監(jiān)審部，以及能夠在此網(wǎng)站下載有助于自己學習或工作的資料。</p><p><b>　　需求分析<

18、/b></p><p><b>　　2.1 可行性分析</b></p><p>　　2.1.1經(jīng)濟可行性</p><p>　　對整個網(wǎng)站的開發(fā)而言，采用的所有開發(fā)工具都是完全免費的，對于網(wǎng)站的后期維護，只需專人對網(wǎng)站欄目內(nèi)容的錄入與發(fā)布即可，無需太多花費。因此，對本站而言，在經(jīng)濟上是完全可行的。</p><p>　

19、　2.1.2 操作可行性</p><p>　　紀檢監(jiān)審部網(wǎng)站是基于Site Server CMS的網(wǎng)站建設(shè)，需掌握模板開發(fā)相關(guān)知識以及DIV+CSS的知識。如今網(wǎng)上有很多相關(guān)開發(fā)的資料可看，因此不管學習還是開發(fā)，都比較簡單，對于網(wǎng)站維護人員來說，Site Server CMS后臺操作也是比較簡單。因此，在操作這一點也是可行的。</p><p>　　2.2 網(wǎng)站針對人群的需求分析</p

20、><p>　　紀檢監(jiān)審處網(wǎng)站主要針對的是學院，教師和學生進行分析。</p><p><b>　　學院的需求分析：</b></p><p>　　學院各個部門的實際情況各不相同。學院的紀檢監(jiān)審部網(wǎng)站也不一樣。紀檢監(jiān)審部網(wǎng)站的建設(shè)目標是通過網(wǎng)站來展現(xiàn)部門的風采并發(fā)揮其在管理的積極作用。</p><p>　　(1)紀檢監(jiān)審部網(wǎng)站的設(shè)

21、計根據(jù)紀檢部的特色來決定的，要體現(xiàn)紀檢監(jiān)審部在學院的重要性。在網(wǎng)站設(shè)計的時候，要研究這些方面，來確定網(wǎng)站的整體風格。</p><p>　　(2)紀檢監(jiān)審部網(wǎng)站應(yīng)該在突出紀檢部特色的同時更注重網(wǎng)站的實用性。網(wǎng)站建設(shè)的目的之一就是為紀檢監(jiān)審部的管理服務(wù)，所以一個實用的，可操作性的和功能多的網(wǎng)站才是最重要的，紀檢監(jiān)審部網(wǎng)站應(yīng)該緊緊圍繞。</p><p><b>　　教師的需求分析：&l

22、t;/b></p><p>　　對老師來說，長時間的講課不利于學生的對知識的吸收，但是由于學生在吸收的知識的程度有很大的差別，就很難以照顧到所有同學都對知識全部理解與吸收，這樣就需要花費許多單獨時間來輔導(dǎo)學生但這樣未必效果明顯，網(wǎng)站的建設(shè)有利于老師上傳試題的詳細講解、相關(guān)教學視頻等。再者老師們需要互相借鑒別人的教學方法和展示自己的教研成果等來加強自己的知識量，同時老師們還需要一個課外交流平臺與學生進行交流，

23、所以網(wǎng)站的建設(shè)有利于老師與老師、老師與學生的交流。</p><p><b>　　學生的需求分析：</b></p><p>　　隨著網(wǎng)絡(luò)信息的飛速發(fā)展，為了能跟上時代的腳步，課堂上老師所講的知識已經(jīng)不能滿足學生了。網(wǎng)站的建設(shè)，可以讓學生在網(wǎng)上搜索和下載更多的知識，從而增加學生的知識面。更能幫助學生了解紀檢監(jiān)審出的最新動態(tài)。</p><p><

24、;b>　　網(wǎng)站設(shè)計</b></p><p>　　3.1 開發(fā)工具Site Server CMS介紹</p><p>　　CMS是Content Management System的縮寫，意思就是“內(nèi)容管理系統(tǒng)”。是一種位于WEB前端（Web 服務(wù)器）和后端辦公系統(tǒng)或流程（內(nèi)容創(chuàng)作、編輯）之間的軟件系統(tǒng)。</p><p><b>　　CMS

25、的優(yōu)勢</b></p><p>　　網(wǎng)站內(nèi)容的管理是CMS最大的優(yōu)勢，它流程完善、功能豐富，可把稿件分門別類并授權(quán)給合法用戶編輯管理，而不需要用戶去理會那些難懂的SQL語法。</p><p>　　CMS具有許多基于模板的優(yōu)秀設(shè)計，可以加快網(wǎng)站開發(fā)的速度和減少開發(fā)的成本。它的功能并不只限于文本處理，它也可以處理圖片、Flash動畫、聲像流、圖像甚至電子郵件檔案。</p>

26、;<p><b>　　CMS的特點</b></p><p>　　1、可以針對各種內(nèi)容進行分類和發(fā)布管理。</p><p>　　2、可以針對不同類型的用戶發(fā)布不同的內(nèi)容，可以將各種內(nèi)容進行分類。</p><p>　　3、可以任意定義內(nèi)容類型與多媒體支持。</p><p>　　4、用戶接口可編輯性強，可以根據(jù)客

27、戶要求訂做用戶接口和風格模塊。</p><p>　　5、可分布式管理。站點管理和維護人員無須集中在同一個辦公室。</p><p>　　6、可開發(fā)性強，可以針對不同的需求進行專門的開發(fā)。</p><p><b>　　7、容易使用。</b></p><p>　　CMS的用途及應(yīng)用領(lǐng)域</p><p>

28、　　CMS的用途在于方便一些對于各種網(wǎng)絡(luò)編程語言并不是很熟悉的用戶用一種比較簡單的方式來管理自己的網(wǎng)站。利用CMS，不需要學習復(fù)雜的建站技術(shù)和太多復(fù)雜的HTML語言，就能夠構(gòu)建出一個風格統(tǒng)一功能強大的專業(yè)網(wǎng)站。</p><p>　　CMS所管理的內(nèi)容中，可以包括文章，圖片，投票，廣告，下載，多媒體文件，甚至可以嵌入論壇，留言板。</p><p>　　CMS的應(yīng)用領(lǐng)域是各種涉及到文章發(fā)布和需

29、要管理的網(wǎng)站建設(shè)當中。如：政府部門、學校、商業(yè)門戶、信息港、地方門戶網(wǎng)等。</p><p><b>　　CMS的分類</b></p><p>　　根據(jù)其平臺腳本種類分為：ASP CMS、JSP CMS、PHP CMS、ASP.NET CMS。</p><p>　　根據(jù)應(yīng)用層面分為：重視后臺管理的CMS、重視風格設(shè)計的CMS和重視前臺發(fā)布的CMS

30、。</p><p>　　3.2 本網(wǎng)站主要工具的使用</p><p>　　3.2.1 Flash 動畫制作工具</p><p>　　Flash，是一種創(chuàng)作工具，設(shè)計人員和開發(fā)人員可使用它來創(chuàng)建演示文稿、應(yīng)用程序和其它允許用戶交互的內(nèi)容。Flash可以包含簡單的動畫、視頻內(nèi)容、復(fù)雜演示文稿和應(yīng)用程序以及介于它們之間的任何內(nèi)容。通常，使用Flash創(chuàng)作的各個內(nèi)容單元稱為

31、應(yīng)用程序，即使它們可能只是很簡單的動畫。您也可以通過添加圖片、聲音、視頻和特殊效果，構(gòu)建包含豐富媒體的Flash應(yīng)用程序。 </p><p>　　Flash特別適用于創(chuàng)建通過Internet提供的內(nèi)容，因為它的文件非常小。Flash是通過廣泛使用矢量圖形做到這一點的。與位圖圖形相比，矢量圖形需要的內(nèi)存和存儲空間小很多，因為它們是以數(shù)學公式而不是大型數(shù)據(jù)集來表示的。位圖圖形之所以更大，是因為圖像中的每個像素都需要一

32、組單獨的數(shù)據(jù)來表示。 </p><p>　　3.2.2 Dreamweaver 網(wǎng)頁設(shè)計工具</p><p>　　一個可視化的網(wǎng)頁設(shè)計和網(wǎng)站管理工具，支持最新的Web技術(shù)，包含HTML檢查、HTML格式控制、HTML格式化選項、可視化網(wǎng)頁設(shè)計、圖像編輯、全局查找替換、全FTP 功能、處理Flash和Shockwave等富媒體格式和動態(tài)HTML、基于團隊的Web創(chuàng)作。在編輯上你可以選擇可視化

33、方式或者你喜歡的源碼編輯方式。 </p><p>　　Dreamweaver的幾大新特性：</p><p>　　1.動態(tài)跨瀏覽器驗證：自動檢測標簽和CSS規(guī)則來適應(yīng)所有主流瀏覽器！</p><p>　　2.更強大的CSS支持！</p><p>　　3.內(nèi)建的圖形編輯引擎:修剪,改變大小,尺寸，旋轉(zhuǎn)角度,調(diào)節(jié)明暗度都不需要離開Dreamweav

34、er環(huán)境，因為它本身集成了FW的基本圖形編輯技術(shù).(這一點有模仿FrontPage的嫌疑！但這個功能確實很實用)！</p><p>　　4.無縫整合外部文件和代碼：直接將Word和Excel文檔復(fù)制和粘貼到Dreamweaver中，會保留字體，顏色，CSS樣式表信息。使用系統(tǒng)支持的編碼保存任何字體,包括雙字節(jié)字符集。</p><p>　　5.緊密整合MM的其他工具：加強了和MM其他幾款產(chǎn)品

35、的協(xié)同工作能力.例如:你可以通過DW直接設(shè)置Flash組件的參數(shù)。</p><p>　　3.2.3 Photoshop 圖像設(shè)計軟件</p><p>　　Photoshop是Adobe公司旗下最為出名的圖像處理軟件之一，集圖像掃描、編輯修改、圖像制作、廣告創(chuàng)意，圖像輸入與輸出于一體的圖形圖像處理軟件，深受廣大平面設(shè)計人員和電腦美術(shù)愛好者的喜愛。</p><p>　　

36、Photoshop界面圖像編輯是圖像處理的基礎(chǔ)，可以對圖像做各種變換如放大、縮小、旋轉(zhuǎn)、傾斜、鏡像、透視等。也可進行復(fù)制、去除斑點、修補、修飾圖像的殘損等。這在婚紗攝影、人像處理制作中有非常大的用場，去除人像上不滿意的部分，進行美化加工，得到讓人非常滿意的效果。</p><p>　　圖像合成則是將幾幅圖像通過圖層操作、工具應(yīng)用合成完整的、傳達明確意義的圖像，這是美術(shù)設(shè)計的必經(jīng)之路。Photoshop提供的繪圖工具

37、讓外來圖像與創(chuàng)意很好地融合，成為可能使圖像的合成天衣無縫。</p><p>　　3.3 網(wǎng)站基本結(jié)構(gòu)圖</p><p>　　圖3-1 網(wǎng)站基本結(jié)構(gòu)</p><p>　　3.4 網(wǎng)站導(dǎo)航欄的設(shè)計</p><p><b>　　網(wǎng)站首頁</b></p><p>　　網(wǎng)站首頁主要包括公告通知，部門新聞，圖

38、片新聞，站內(nèi)搜索和友情鏈接等五個欄目組成。讓老師和同學能夠更加清楚了解紀檢監(jiān)審部的最新動態(tài)。首頁設(shè)計如下圖所示：</p><p><b>　　圖3-2 網(wǎng)站首頁</b></p><p><b>　　部門簡介</b></p><p>　　本頁面主要通過工作職責來介紹了紀檢監(jiān)審部。紀檢監(jiān)審處的工作職責主要介紹了紀檢監(jiān)審部在學院

39、的工作及職責。為大家更加了解紀檢監(jiān)審部提供了方便。</p><p><b>　　廉政教育</b></p><p>　　本頁面主要通過廉政論壇，警鐘長鳴，廉政文苑和廉政講堂幾個方面來說明廉政教育的重要性。</p><p><b>　　規(guī)章制度</b></p><p>　　本頁面主要介紹學院的規(guī)章制度，

40、以及告誡同學們要遵守學院的制度。</p><p><b>　　政策法規(guī)</b></p><p>　　本頁面主要介紹了政策法規(guī)的重要性，并舉例說明。</p><p><b>　　信訪舉報</b></p><p>　　本頁面主要通過舉報指南，網(wǎng)上舉報，信函舉報和電話舉報幾種舉報方式做了相關(guān)說明。<

41、/p><p>　　舉報指南：本頁面對怎樣舉報作了詳細的指導(dǎo)。</p><p>　　信函舉報：本頁面主要內(nèi)容是舉報的郵編地址。</p><p>　　電話舉報：本頁面只要內(nèi)容是舉報的電話。</p><p>　　網(wǎng)上舉報：本頁面主要內(nèi)容是舉報的網(wǎng)址。</p><p><b>　　資料下載</b></p

42、><p>　　本頁面主要提供對用戶的資料下載。實現(xiàn)如下圖所示：</p><p><b>　　圖3-3 資料上傳</b></p><p><b>　　留言板的設(shè)計</b></p><p>　　留言板設(shè)計有利于收集網(wǎng)站瀏覽者的留言信息，管理員可查看留言，并對留言做出回復(fù)。如下圖所示：</p>

43、<p>　　圖3-4 留言板設(shè)計</p><p><b>　　網(wǎng)站實現(xiàn)</b></p><p>　　4.1 網(wǎng)站首頁的實現(xiàn)</p><p>　　網(wǎng)站首頁主要有公告通知，部門新聞，圖片新聞，站內(nèi)搜索和友情鏈接幾個欄目組成。</p><p>　　4.1.1 公告通知</p><p>　　公告

44、通知主要內(nèi)容是展示紀檢監(jiān)審部最近通知動態(tài)，主要代碼如下：</p><p>　　<td width="738" height="426" valign="top"><br></p><p>　　<table width="725" cellpadding="0"

45、cellspacing="0"></p><p><b>　　<tr></b></p><p>　　<td width="367" valign="top"><table width="98%" cellspacing="0" cel

46、lpadding="0"></p><p><b>　　<tr></b></p><p>　　<td height="30" style="padding-left:10px; padding-right:10px; background:url(images/xx01.gif);"

47、><table width="95%"></p><p><b>　　<tr></b></p><p>　　<td width="8%" class="wenzi" >&nbsp;</td></p><p>　　<td

48、 width="54%" class="wenzi">公告通知 </td></p><p>　　<td width="38%" align="right" valign="bottom"><stl:a channelIndex="新聞動態(tài)" channelNa

49、me="公告通知"><img src="images/i_14.gif" border="0" width="44" height="13"></stl:a></td></p><p><b>　　</tr></b></p>

50、<p>　　</table></td></p><p><b>　　</tr></b></p><p><b>　　<tr></b></p><p>　　<td><stl:contents channelIndex="新聞動態(tài)"

51、 channelName="公告通知" totalNum="7"></p><p>　　<table width="95%"></p><p><b>　　<tr></b></p><p>　　<td valign="bottom"

52、; style="border-bottom:dashed 1px #666666;" height="25" width="75%"><stl:a><img src="images/yx_15.gif" border="0" width="4" height="4" /&

53、gt;&nbsp;<stl:content type="Title" wordNum="18"></stl:content></stl:a></td></p><p>　　<td align="right" style="border-bottom:dashed 1px #6666

54、66;" height="25" valign="bottom" width="25%"><stl:a><stl:content type="AddDate" formatString="yyyy-MM-dd"></stl:content></stl:a></td>

55、;</p><p><b>　　</tr></b></p><p><b>　　</table></b></p><p>　　</stl:contents></td></p><p><b>　　</tr></b>&l

56、t;/p><p>　　</table></td></p><p>　　<td width="369" align="right"><table width="98%" cellpadding="0" cellspacing="0"></p&g

57、t;<p>　　公告通知的實現(xiàn)如下圖所示：</p><p><b>　　圖4-1 公告通知</b></p><p>　　4.1.2 部門新聞</p><p>　　部門新聞主要內(nèi)容是展示紀檢監(jiān)審部最近新聞動態(tài)，主要代碼如下：</p><p><b>　　<tr></b><

58、;/p><p>　　<td height="30" style="padding-left:10px; padding-right:10px; background:url(images/xx01.gif);"><table width="100%"></p><p><b>　　<tr>

59、</b></p><p>　　<td width="8%" class="wenzi" >&nbsp;</td></p><p>　　<td width="61%" class="wenzi">部門新聞</td></p><

60、p>　　<td width="31%" align="right" valign="bottom"><stl:a channelIndex="部門新聞"><img src="images/i_14.gif" border="0" width="44" height

61、="13"></stl:a></td></p><p><b>　　</tr></b></p><p>　　</table></td></p><p><b>　　</tr></b></p><p>&

62、lt;b>　　<tr></b></p><p>　　<td><stl:contents channelIndex="新聞動態(tài)" channelName="部門新聞" totalNum="7"></p><p>　　<table width="95%"

63、></p><p><b>　　<tr></b></p><p>　　<td valign="bottom" style="border-bottom:dashed 1px #666666;" height="25" width="78%"><stl:

64、a><img src="images/yx_15.gif" border="0" width="4" height="4" />&nbsp;<stl:content type="Title" wordNum="18"></stl:content></stl:a&g

65、t;</td></p><p>　　<td align="right" style="border-bottom:dashed 1px #666666;" height="25" valign="bottom" width="25%"><stl:a><stl:conten

66、t type="AddDate" formatString="yyyy-MM-dd"></stl:content></stl:a></td></p><p><b>　　</tr></b></p><p><b>　　</table></b>

67、</p><p>　　</stl:contents></td></p><p><b>　　</tr></b></p><p><b>　　<tr></b></p><p><b>　　<td></td></b&

68、gt;</p><p><b>　　</tr></b></p><p>　　</table></td></p><p><b>　　</tr></b></p><p><b>　　<tr></b></p>

69、<p>　　部門新聞的實現(xiàn)如下圖所示：</p><p><b>　　圖4-2 部門新聞</b></p><p>　　4.1.3 圖片新聞</p><p>　　圖片新聞主要內(nèi)容通過圖片來展示，介紹部門的新聞動態(tài)，主要代碼如下：</p><p>　　<td colspan="2">

70、<table width="100%" cellpadding="0" cellspacing="0" ></p><p><b>　　<tr></b></p><p>　　<td><table width="100%" cellpadding=

71、"0" cellspacing="0" background="images/yx_20.gif"></p><p><b>　　<tr></b></p><p>　　<td width="4%" height="35">&nbsp

72、;<img src="images/yx_33.gif" width="27" height="22"></td></p><p>　　<td width="12%">&nbsp;圖片新聞</td></p><p>　　<td width="

73、;84%" align="right"><stl:a channelIndex="圖片新聞"><img src="images/i_14.gif" width="44" border="0" height="13"></stl:a></td></p&

74、gt;<p><b>　　</tr></b></p><p>　　</table></td></p><p><b>　　</tr></b></p><p><b>　　<tr></b></p><p>

75、　　<td><stl:marquee direction="Horizontal" width="725" scrollDelay="30"> <stl:contents channelIndex="圖片新聞" scope="All" totalNum="10" direction=&

76、quot;Horizontal" layout="Table"></p><p>　　<table width="70%" cellspacing="5"></p><p><b>　　<tr></b></p><p>　　<td>&

77、lt;stl:a target="_blank"><stl:image width='140' height='95' border='0'></stl:image></stl:a> </td></p><p><b>　　</tr></b></p>

78、;<p><b>　　<tr></b></p><p>　　<td align="center"><stl:content type="Title" wordNum="8"></stl:content> </td></p><p>&l

79、t;b>　　</tr></b></p><p><b>　　</table></b></p><p>　　</stl:contents></stl:marquee></td></p><p><b>　　</tr></b></p

80、><p>　　</table></td></p><p><b>　　</tr></b></p><p><b>　　</table></b></p><p>　　<td width="190" valign="top&

81、quot;>&nbsp;<br></p><p>　　<table width="100%" bgcolor="ffffff" cellpadding="0" cellspacing="1"></p><p><b>　　<tr></b>&

82、lt;/p><p>　　<td height="44" style="background:url(images/m_11.gif) no-repeat; padding-left:10px; " align="right">&nbsp;</td></p><p><b>　　</t

83、r></b></p><p><b>　　</table></b></p><p>　　<table width="175" style="background:url(images/yx_11.gif) no-repeat; height:80px;" cellpadding="0

84、" cellspacing="0"></p><p><b>　　<tr></b></p><p>　　<td width="172" style="padding-left:0px;"><table width="100%"><

85、/p><p>　　圖片新聞的實現(xiàn)如下圖所示：</p><p><b>　　圖4-3 圖片新聞</b></p><p>　　4.1.4 友情鏈接</p><p>　　網(wǎng)站友情鏈接功能的實現(xiàn)，方便了用戶對其他有關(guān)網(wǎng)站的訪問。下面是友情鏈接實現(xiàn)的主要代碼：</p><p>　　<td class=&q

86、uot;bs">&nbsp友情鏈接</td></p><p><b>　　</tr></b></p><p><b>　　</table></b></p><p>　　<p><a href="http://www.icac.org.hk

87、/">&nbsp&nbsp香港廉政公署</a></p></p><p>　　<p><a href="http://www.scjc.gov.cn/index.jsp">&nbsp&nbsp國家監(jiān)察廳</a></p></p><p>　　<p>

88、;<a href="http://www.moe.edu.cn/">&nbsp&nbsp國家教育網(wǎng)</a></p></p><p>　　<p><a href="http://www.scedu.net/structure/index.htm">&nbsp&nbsp四川教育廳</

89、a></p></p><p>　　<p><a href="http://www.lzy.edu.cn/jsc/jsc_index.htm">&nbsp&nbsp國家檢察部</a></p></p><p>　　<p><a href="http://www.yfw.

90、com.cn/index.asp">&nbsp&nbsp中國職務(wù)犯罪預(yù)防網(wǎng)</a></p></p><p><b>　　</td></b></p><p><b>　　</tr></b></p><p>　　</table> &

91、lt;/td></p><p>　　網(wǎng)站友情鏈接的實現(xiàn)如下圖所示：</p><p>　　圖4-4 網(wǎng)站友情鏈接</p><p>　　4.1.5 站內(nèi)搜索</p><p>　　網(wǎng)站站內(nèi)搜索的實現(xiàn)提供用戶對站內(nèi)信息的快速訪問，以便提供對信息訪問效率。下面是站內(nèi)搜索實現(xiàn)的主要代碼：</p><p>　　<tabl

92、e width="100%" border="0" cellspacing="5"> </p><p><b>　　<tr></b></p><p>　　<td height="33" bgcolor="d1d1d1" style="p

93、adding-right:10px;"></p><p>　　<table height="33" width="100%" cellpadding="0" cellspacing="0" style="background:url(../images/yx_077.gif) no-repeat&quo

94、t;></p><p><b>　　<tr></b></p><p>　　<td width="6%"> </td></p><p>　　<td width="94%" class="lm">站內(nèi)搜索</td></

95、p><p><b>　　</tr></b></p><p>　　</table></td></p><p><b>　　</tr></b></p><p><b>　　<tr></b></p><p&g

96、t;　　<td style="padding:10px;"><table width="100%" border="0" cellspacing="5"></p><p><b>　　<tr></b></p><p><b>　　<td

97、></b></p><p>　　<form id="form_{StyleID}" method="get" action="/jjjsg/utils/search.html" target="_blank"></p><p>　　<table><tr>&l

98、t;td></p><p>　　關(guān)鍵字：&nbsp;<input style="border: #ccc 1px solid;width:300px" name="word" />&nbsp;</td></p><p>　　<td><INPUT type="button&quo

99、t; onClick="document.getElementById('form_{StyleID}').submit();return false;" value=" 搜 索 " /></p><p>　　</td></tr></table></p><p>　　</form>

100、</td></p><p><b>　　</tr></b></p><p><b>　　<tr></b></p><p>　　<td align="center"></p><p>　　<div id="ajaxEl

101、ement_1" style="width:100%"><img src="/sitefiles/bairong/icons/loading.gif" /></div></p><p>　　<script type="text/javascript" language="javascript&quo

102、t;></p><p>　　function stlUpdateajaxElement_1(pageIndex)</p><p><b>　　{</b></p><p>　　var url = '/SiteFiles/Inner/search/output.aspx?publishmentSystemID=2';</

103、p><p>　　var queryString = document.location.search;</p><p>　　var queryString2 = '';</p><p>　　if (queryString == null || queryString.length <= 1){queryString = '';}el

104、se{</p><p>　　queryString = queryString.substring(1);</p><p>　　var arr = queryString.split('&');</p><p>　　for(var i=0; i < arr.length; i++) {</p><p>　　var

105、 item = arr[i];</p><p>　　var arr2 = item.split('=');</p><p>　　if (arr2 && arr2.length == 2){</p><p>　　queryString2 += '&' + arr2[0] + '=' + encod

106、eURIComponent(arr2[1]);</p><p>　　}else{queryString2 += '&' + item}</p><p><b>　　}</b></p><p>　　queryString = queryString2;</p><p><b>　　}<

107、;/b></p><p>　　function stlJumpajaxElement_1(selObj)</p><p><b>　　{</b></p><p>　　stlUpdateajaxElement_1(selObj.options[selObj.selectedIndex].value);</p><p>

108、;<b>　　}</b></p><p>　　stlUpdateajaxElement_1(0);</p><p><b>　　</script></b></p><p><b>　　</td></b></p><p><b>　　</t

109、r></b></p><p>　　</table></td></p><p><b>　　</tr></b></p><p>　　</table></td></p><p><b>　　</tr></b><

110、;/p><p>　　</table></td></p><p><b>　　</tr></b></p><p><b>　　</table></b></p><p>　　站內(nèi)搜索的實現(xiàn)如下圖所示：</p><p><b>

111、　　圖4-5 站內(nèi)搜索</b></p><p>　　4.2 網(wǎng)站頭部的實現(xiàn)</p><p>　　網(wǎng)站頭部主要由當日時間，設(shè)為首頁和加入收藏這幾個功能組成。下面是其主要代碼。</p><p>　　4.2.1 顯示當日時間的主要代碼</p><p>　　<td valign="middle" align=&q

112、uot;left" height="50" style="padding-left: 15px; color: #666666"><span class="STYLE3">歡迎光臨，今天是：</p><p>　　<stl:value type="DateOfTraditional"></s

113、tl:value></p><p>　　</span></td></p><p>　　網(wǎng)站當日時間功能的實現(xiàn)如下圖所示：</p><p>　　圖4-6 網(wǎng)站日期顯示</p><p>　　4.2.2 設(shè)為首頁和加入收藏的主要代碼</p><p>　　<p><span cla

114、ss="STYLE1"><a href ="javascript:void(0)" onclick ="setHomepage()"><strong>設(shè)為首頁</strong>&nbsp&nbsp</a><a href="javascript:void(0)" onclick =&q

115、uot;addFav()"><strong> 加入收藏</strong></a></span></p></p><p>　　網(wǎng)站中設(shè)為首頁和加入收藏功能的實現(xiàn)如下圖所示：</p><p>　　圖4-7 網(wǎng)站設(shè)為首頁和加入收藏</p><p>　　4.3 網(wǎng)站尾部實現(xiàn)</p>&

116、lt;p>　　紀檢監(jiān)審部網(wǎng)站尾部內(nèi)容主要有技術(shù)支持和網(wǎng)站制作人。</p><p>　　下面是網(wǎng)站尾部實現(xiàn)的主要代碼：</p><p>　　<table width="930" border="0" align="center" cellpadding="0" cellspacing="0

117、" id="__01"></p><p><b>　　<tr></b></p><p>　　<td width="909" class="dh1" align="center" height="50" bgcolor="#f

118、b7500">技術(shù)支持：<a href="http://www.siteserver.cn" target="_blank">SiteServer CMS</a> Copyright 2011 <br></p><p>　　制作人：翟佳佳 </td></p><p><b>

119、　　</tr></b></p><p><b>　　</table></b></p><p>　　網(wǎng)站尾部的實現(xiàn)如下圖所示：</p><p><b>　　圖4-8 網(wǎng)站尾部</b></p><p>　　4.4 網(wǎng)站導(dǎo)航欄目的實現(xiàn)</p><p&

120、gt;　　網(wǎng)站導(dǎo)航欄目主要由網(wǎng)站首頁，部門簡介，廉政教育，規(guī)章制度，政策法規(guī)，普法教育，信訪舉報，資料下載和留言本九個欄目組成。</p><p>　　下面是網(wǎng)站導(dǎo)航欄實現(xiàn)的主要代碼：</p><p>　　<table cellpadding="0" cellspacing="0" background="/xxgc/images/y

121、x_04.gif" align="center" width="100%"></p><p><b>　　<tr></b></p><p>　　<td height="36"></p><p>　　<table align="c

122、enter" cellpadding="0" width="930" cellspacing="0" border="0" height="27"></p><p><b>　　<tr></b></p><p>　　<td class=

123、"dh" align="center" ><a href="/xxgc/index.htm">網(wǎng)站首頁</a></td></p><p>　　<td align="center" width="7"><img src="/xxgc/images

124、/xian.gif" width="2" height="36" border="0" /></td></p><p>　　<td class="dh" align="center"><span name="mm_link_1" id="m

125、m_link_1" onMouseOver="MM_showMenu(window.mm_menu_1,-10,20,null,'mm_link_1');" onMouseOut="MM_startTimeout();"><a href="/xxgc/channels/1.html">部門簡介</a></span&g

126、t;</td></p><p>　　<td width="7" align="center"><img src="/xxgc/images/xian.gif" width="2" height="36" border="0" /></td><

127、/p><p>　　<td class="dh" align="center"><span name="mm_link_2" id="mm_link_2" onMouseOver="MM_showMenu(window.mm_menu_2,-10,20,null,'mm_link_2');&quo

128、t; onMouseOut="MM_startTimeout();"><a href="/xxgc/channels/4.html">廉政教育</a></span></td></p><p>　　<td width="7" align="center"><img

129、src="/xxgc/images/xian.gif" width="2" height="36" border="0" /></td></p><p>　　<td class="dh" align="center"><a href="/xxgc/c

130、hannels/1747.html">規(guī)章制度</a></td><td width="7" align="center"><img src="/xxgc/images/xian.gif" width="2" height="36" border="0" />

131、;</td></p><p>　　<td class="dh" align="center"><a href="/xxgc/channels/1752.html">政策法規(guī)</a></td><td width="7" align="center"&g

132、t;<img src="/xxgc/images/xian.gif" width="2" height="36" border="0" /></td></p><p>　　<td class="dh" align="center"><span name=

133、"mm_link_5" id="mm_link_5" onMouseOver="MM_showMenu(window.mm_menu_5,-10,20,null,'mm_link_5');" onMouseOut="MM_startTimeout();"><a href="/xxgc/channels/1753.html

134、">信訪舉報</a></span></td><td width="7" align="center"><img src="/xxgc/images/xian.gif" width="2" height="36" border="0" /><

135、;/td></p><p>　　<td class="dh" align="center"><a href="/xxgc/channels/1764.html">資料下載</a></td></p><p><b>　　</tr></b><

136、/p><p><b>　　</table></b></p><p>　　網(wǎng)站導(dǎo)航欄目的實現(xiàn)如下圖所示：</p><p>　　圖4-9 網(wǎng)站導(dǎo)航欄</p><p>　　4.5 留言板的實現(xiàn)</p><p>　　留言板的實現(xiàn)有利于收集網(wǎng)站瀏覽者的留言信息，管理員可以查看留言，并對留言做出回復(fù)。

137、留言板的實現(xiàn)如下圖所示：</p><p>　　圖4-10 用戶登錄留言板界面</p><p>　　圖4-11 管理員登錄留言板界面</p><p><b>　　網(wǎng)站測試</b></p><p><b>　　5.1 測試目的</b></p><p>　　網(wǎng)站測試的目的是在最少的

138、時間內(nèi)找出系統(tǒng)中潛在的各種錯誤和缺陷，同時通過測試證明系統(tǒng)的性能和功能是否滿足系統(tǒng)需求，建設(shè)的網(wǎng)站是否實現(xiàn)了規(guī)劃的預(yù)期目標，界面是否符合美觀、大方的要求，操作是否簡單方便，輸入的數(shù)據(jù)信息是否流暢，下載功能是否實現(xiàn)等問題。</p><p><b>　　5.2 測試環(huán)境</b></p><p>　　網(wǎng)站是在www服務(wù)器環(huán)境下運行的，www服務(wù)器是目前應(yīng)用最為廣泛的Inte

139、rnet服務(wù)器之一，用戶只要通過“瀏覽器”就可以非常方便地訪問Internet，獲得所需的信息。www的組成如圖所示：</p><p>　　圖5-1 www網(wǎng)站示意圖</p><p>　　瀏覽器和服務(wù)器之間的信息交換使用超文本傳輸協(xié)議（Hypertext Transfer Protocol，HTTP）?；贖TTP協(xié)議的萬維網(wǎng)實際上是一個大規(guī)模的、在線式的信息倉庫，是一個支持交互式訪問的分

140、布式超媒體系統(tǒng)。</p><p><b>　　5.3 測試內(nèi)容</b></p><p>　　5.3.1 網(wǎng)站測試的主要內(nèi)容</p><p>　　1.運行速度：檢查網(wǎng)站運行速度是否正常。</p><p>　　2.搜索功能：有搜索功能的地方輸入系統(tǒng)存在和不存在的內(nèi)容,看搜索結(jié)果是否正確.如果可以輸入多個搜索條件,可以同時添加

141、合理和不合理的條件,看系統(tǒng)處理是否正確。</p><p>　　3.鏈接正確性：檢查每一個鏈接是否都能跳轉(zhuǎn)到相對于的頁面。</p><p>　　4.下載功能：檢測下載資料的功能是否實現(xiàn)。</p><p>　　5.3.2 網(wǎng)站系統(tǒng)測試的內(nèi)容</p><p>　　1.網(wǎng)站硬件，網(wǎng)絡(luò)連接的測試</p><p>　　2.網(wǎng)站功能

142、的測試：網(wǎng)頁測試：測試網(wǎng)頁能否正常運行。內(nèi)容測試：測試網(wǎng)站里內(nèi)容能否正常顯示。</p><p><b>　　5.4 測試結(jié)果</b></p><p>　　網(wǎng)站建設(shè)完成后，通過測試，本網(wǎng)站頁面美觀大方，網(wǎng)站能夠正常運行，網(wǎng)站的搜索功能可以實現(xiàn)站內(nèi)搜索，網(wǎng)站的鏈接能夠正常鏈接并且跳轉(zhuǎn)到相對應(yīng)的頁面，網(wǎng)站的下載功能能夠正常下載資料。</p><p>

143、<b>　　網(wǎng)站發(fā)布與維護</b></p><p><b>　　6.1 申請域名</b></p><p>　　站點中的網(wǎng)頁制作好后，就需要把它放到萬維網(wǎng)(www)上，讓全世界的網(wǎng)絡(luò)瀏覽者都有機會參觀該站點。下面是域名申請的步驟：</p><p>　　1. 首先請登錄會員,如果您還沒有申請會員,登陸網(wǎng)站www.cnyiche

144、ng.com點擊網(wǎng)頁上方的"注冊"這個按鈕進入注冊頁面。如下圖所示：</p><p><b>　　圖6-1 注冊頁面</b></p><p>　　2.填入注冊資料,然后點擊"注冊",即可完成。注冊完成后系統(tǒng)自動登錄。如下圖所示：</p><p><b>　　圖6-2 注冊頁面</b>