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

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

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

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

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

5、詳細(xì)的論述。為了使學(xué)院部門網(wǎng)站得到全面改制，更加能夠展示學(xué)院部門風(fēng)采、優(yōu)點(diǎn)與特色，從而增加人們對(duì)學(xué)院紀(jì)檢監(jiān)審處的了解，首先，我去了學(xué)院紀(jì)檢監(jiān)審部，根據(jù)紀(jì)檢監(jiān)審部老師的要求以及所提供的有關(guān)信息，建構(gòu)了紀(jì)檢監(jiān)審部網(wǎng)站。</p><p>　　關(guān)鍵詞：Internet 網(wǎng)站建設(shè) 紀(jì)檢監(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)濟(jì)可行性2</p><p>　　2.1.2 操作可行性2</p><p>　　2.2 網(wǎng)站針對(duì)人群的需求分析2<

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

8、;<p>　　3.2.3 Photoshop 圖像設(shè)計(jì)軟件6</p><p>　　3.3 網(wǎng)站基本結(jié)構(gòu)圖7</p><p>　　3.4 網(wǎng)站導(dǎo)航欄的設(shè)計(jì)7</p><p>　　第四章網(wǎng)站實(shí)現(xiàn)9</p><p>　　4.1 網(wǎng)站首頁的實(shí)現(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)站頭部的實(shí)現(xiàn)17</p><p>　　4.2.1 顯示當(dāng)日時(shí)間的主要代碼17&

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

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

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

13、><p>　　6.5.2 網(wǎng)站內(nèi)容更新29</p><p>　　總 結(jié) 30</p><p>　　致 謝 31</p><p><b>　　參考文獻(xiàn) 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è)計(jì)尤為重要。 互聯(lián)網(wǎng)成為人們快速獲取、發(fā)布和傳遞信息的重要渠道，它在人們政治、經(jīng)濟(jì)、生活等各個(gè)方面發(fā)揮著重要的作用。網(wǎng)頁設(shè)計(jì)伴隨著網(wǎng)絡(luò)的快速發(fā)展而快速興起，作為上網(wǎng)的主要依托，由于人們使用網(wǎng)絡(luò)的頻繁而變得非常的重要。網(wǎng)頁講

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

36、Photoshop界面圖像編輯是圖像處理的基礎(chǔ)，可以對(duì)圖像做各種變換如放大、縮小、旋轉(zhuǎn)、傾斜、鏡像、透視等。也可進(jìn)行復(fù)制、去除斑點(diǎn)、修補(bǔ)、修飾圖像的殘損等。這在婚紗攝影、人像處理制作中有非常大的用場(chǎng)，去除人像上不滿意的部分，進(jìn)行美化加工，得到讓人非常滿意的效果。</p><p>　　圖像合成則是將幾幅圖像通過圖層操作、工具應(yīng)用合成完整的、傳達(dá)明確意義的圖像，這是美術(shù)設(shè)計(jì)的必經(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è)計(jì)</p><p><b>　　網(wǎng)站首頁</b></p><p>　　網(wǎng)站首頁主要包括公告通知，部門新聞，圖

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

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

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

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

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

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

44、通知主要內(nèi)容是展示紀(jì)檢監(jiān)審部最近通知?jiǎng)討B(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="新聞動(dòng)態(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="新聞動(dòng)態(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>　　公告通知的實(shí)現(xiàn)如下圖所示：</p><p><b>　　圖4-1 公告通知</b></p><p>　　4.1.2 部門新聞</p><p>　　部門新聞主要內(nèi)容是展示紀(jì)檢監(jiān)審部最近新聞動(dòng)態(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="新聞動(dòng)態(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>　　部門新聞的實(shí)現(xiàn)如下圖所示：</p><p><b>　　圖4-2 部門新聞</b></p><p>　　4.1.3 圖片新聞</p><p>　　圖片新聞主要內(nèi)容通過圖片來展示，介紹部門的新聞動(dòng)態(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>　　圖片新聞的實(shí)現(xiàn)如下圖所示：</p><p><b>　　圖4-3 圖片新聞</b></p><p>　　4.1.4 友情鏈接</p><p>　　網(wǎng)站友情鏈接功能的實(shí)現(xiàn)，方便了用戶對(duì)其他有關(guān)網(wǎng)站的訪問。下面是友情鏈接實(shí)現(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國(guó)家監(jiān)察廳</a></p></p><p>　　<p>

88、;<a href="http://www.moe.edu.cn/">&nbsp&nbsp國(guó)家教育網(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國(guó)家檢察部</a></p></p><p>　　<p><a href="http://www.yfw.

90、com.cn/index.asp">&nbsp&nbsp中國(guó)職務(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)站友情鏈接的實(shí)現(xiàn)如下圖所示：</p><p>　　圖4-4 網(wǎng)站友情鏈接</p><p>　　4.1.5 站內(nèi)搜索</p><p>　　網(wǎng)站站內(nèi)搜索的實(shí)現(xiàn)提供用戶對(duì)站內(nèi)信息的快速訪問，以便提供對(duì)信息訪問效率。下面是站內(nèi)搜索實(shí)現(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)搜索的實(shí)現(xiàn)如下圖所示：</p><p><b>

111、　　圖4-5 站內(nèi)搜索</b></p><p>　　4.2 網(wǎng)站頭部的實(shí)現(xiàn)</p><p>　　網(wǎng)站頭部主要由當(dāng)日時(shí)間，設(shè)為首頁和加入收藏這幾個(gè)功能組成。下面是其主要代碼。</p><p>　　4.2.1 顯示當(dāng)日時(shí)間的主要代碼</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)站當(dāng)日時(shí)間功能的實(shí)現(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è)為首頁和加入收藏功能的實(shí)現(xiàn)如下圖所示：</p><p>　　圖4-7 網(wǎng)站設(shè)為首頁和加入收藏</p><p>　　4.3 網(wǎng)站尾部實(shí)現(xiàn)</p>&

116、lt;p>　　紀(jì)檢監(jiān)審部網(wǎng)站尾部?jī)?nèi)容主要有技術(shù)支持和網(wǎng)站制作人。</p><p>　　下面是網(wǎng)站尾部實(shí)現(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)站尾部的實(shí)現(xiàn)如下圖所示：</p><p><b>　　圖4-8 網(wǎng)站尾部</b></p><p>　　4.4 網(wǎng)站導(dǎo)航欄目的實(shí)現(xiàn)</p><p&

120、gt;　　網(wǎng)站導(dǎo)航欄目主要由網(wǎng)站首頁，部門簡(jiǎn)介，廉政教育，規(guī)章制度，政策法規(guī)，普法教育，信訪舉報(bào)，資料下載和留言本九個(gè)欄目組成。</p><p>　　下面是網(wǎng)站導(dǎo)航欄實(shí)現(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">部門簡(jiǎn)介</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、">信訪舉報(bào)</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)航欄目的實(shí)現(xiàn)如下圖所示：</p><p>　　圖4-9 網(wǎng)站導(dǎo)航欄</p><p>　　4.5 留言板的實(shí)現(xiàn)</p><p>　　留言板的實(shí)現(xiàn)有利于收集網(wǎng)站瀏覽者的留言信息，管理員可以查看留言，并對(duì)留言做出回復(fù)。

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

138、時(shí)間內(nèi)找出系統(tǒng)中潛在的各種錯(cuò)誤和缺陷，同時(shí)通過測(cè)試證明系統(tǒng)的性能和功能是否滿足系統(tǒng)需求，建設(shè)的網(wǎng)站是否實(shí)現(xiàn)了規(guī)劃的預(yù)期目標(biāo)，界面是否符合美觀、大方的要求，操作是否簡(jiǎn)單方便，輸入的數(shù)據(jù)信息是否流暢，下載功能是否實(shí)現(xiàn)等問題。</p><p><b>　　5.2 測(cè)試環(huán)境</b></p><p>　　網(wǎng)站是在www服務(wù)器環(huán)境下運(yù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)實(shí)際上是一個(gè)大規(guī)模的、在線式的信息倉(cāng)庫(kù)，是一個(gè)支持交互式訪問的分

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

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

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

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

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