整理為word格式整理為word格式整理為word格式畢業(yè)設(shè)計(jì)題目個(gè)人網(wǎng)站的設(shè)計(jì)與制作姓名xxxx學(xué)號xxxxxxxxxx系（院）信息工程系班級xxxxxx指導(dǎo)教師________職稱__________201x年x月xx日整理為word格式整理為word格式整理為word格式摘要隨著經(jīng)濟(jì)社會的發(fā)展，Internet的日益興起和以網(wǎng)頁為載體的網(wǎng)絡(luò)信息的廣泛傳播和應(yīng)用，使得網(wǎng)站的建設(shè)及網(wǎng)頁制作得到發(fā)展的空間，網(wǎng)站建設(shè)和網(wǎng)頁制作也成為計(jì)算機(jī)網(wǎng)絡(luò)領(lǐng)域最熱門的話題。動態(tài)網(wǎng)站是當(dāng)前網(wǎng)站建設(shè)的趨勢。動態(tài)網(wǎng)站并不是指具有動畫功能的網(wǎng)站，而是指通過數(shù)據(jù)庫進(jìn)行架構(gòu)的網(wǎng)站，它除了要設(shè)計(jì)網(wǎng)頁外，還要通過數(shù)據(jù)庫和編程序來使網(wǎng)站具有更多自動的和高級的功能。動態(tài)網(wǎng)頁以數(shù)據(jù)庫技術(shù)為基礎(chǔ)，可以大大降低網(wǎng)站維護(hù)的工作量。采用動態(tài)網(wǎng)頁技術(shù)的網(wǎng)站可以實(shí)現(xiàn)更多的功能，如用戶注冊、用戶登錄等等，它實(shí)際上并不是獨(dú)立存在于服務(wù)器上的網(wǎng)頁文件，只有當(dāng)用戶請求時(shí)服務(wù)器才返回一個(gè)完整的網(wǎng)頁。本課題運(yùn)用我們所學(xué)的ASP與數(shù)據(jù)庫技術(shù)，通過Dreamweaver等相關(guān)軟件來創(chuàng)建了一個(gè)個(gè)人網(wǎng)站，網(wǎng)站主要有：主頁、個(gè)人簡介、圖片、日志、留言和管理幾個(gè)模塊。其中，個(gè)人簡介是以網(wǎng)頁的形式展示在瀏覽者面前的一個(gè)自我介紹，有與我相關(guān)的信息等。圖片則是用來展示我們平時(shí)收集的一些照片，喜歡的明星和唯美的圖片。日志是將最近網(wǎng)絡(luò)上流行的一些文字和發(fā)生的事件展示出來。留言則是瀏覽者用來彼此交流的地方，瀏覽者可以在這里發(fā)表留言，發(fā)表的信息將展示在留言板上。管理界面則是管理員通過登錄進(jìn)入的界面，里面可以對網(wǎng)站進(jìn)行管理，如：用戶管理、留言管理、文章管理等。通過設(shè)計(jì)這個(gè)個(gè)人網(wǎng)站，以達(dá)到個(gè)人推薦，展現(xiàn)自我的一個(gè)空間，以及為交流提供綜合的網(wǎng)絡(luò)環(huán)境，同時(shí)也為個(gè)人發(fā)展提供了一平臺。關(guān)鍵字：動態(tài)網(wǎng)站；asp；數(shù)據(jù)庫整理為word格式整理為word格式整理為word格式目錄TOC\o"1-3"\h\u16110第一章緒論 1210051.1本課題的背景及意義 174551.1.1課題的背景 155771.1.2課題的意義 1103951.2論文的結(jié)構(gòu) 26757第二章關(guān)鍵技術(shù)簡介 392752.1ASP的簡介 339162.2ACCESS的簡介 44592.3Dreamweaver的簡介 526344第三章后臺環(huán)境配置 6150303.1IIS安裝和配置 6192173.2設(shè)置數(shù)據(jù)源（ODBC） 7304953.3Dreamweaver開發(fā)站點(diǎn)環(huán)境 96723第四章系統(tǒng)分析與設(shè)計(jì) 13160874.1需求分析 13233754.2功能模塊設(shè)計(jì) 1327524.3確定網(wǎng)站風(fēng)格 14172964.3.1主頁版塊 146804.3.2網(wǎng)站字體 1530674.3.3網(wǎng)站版塊 15211524.4數(shù)據(jù)庫邏輯結(jié)構(gòu)設(shè)計(jì) 1629570第五章系統(tǒng)的實(shí)現(xiàn) 1872555.1留言板的實(shí)現(xiàn) 184095.1.1留言板的主界面 18276515.1.2留言板主界面的制作 18291555.1.3發(fā)表留言界面的制作 2155965.2后臺管理界面 23整理為word格式整理為word格式整理為word格式149315.2.1登錄界面 23184935.2.2管理員管理界面 24264335.2.3后臺管理模塊設(shè)計(jì) 2516348第六章網(wǎng)站的測試 329544結(jié)束語 3314013致謝 3420196參考文獻(xiàn) 35整理為word格式整理為word格式整理為word格式第一章緒論1.1本課題的背景及意義1.1.1課題的背景互聯(lián)網(wǎng)是社會發(fā)展的必然趨勢，很多人已經(jīng)意識到網(wǎng)絡(luò)的強(qiáng)大生命力和它在未來將處于的重要地位。他們鉆研并且努力進(jìn)入到這一個(gè)新的空間，新的領(lǐng)域。以個(gè)人為中心，淡化了傳統(tǒng)中心地位，使得我們的世界向多元化加速發(fā)展，人人都有話語權(quán)，人人都是中心。互聯(lián)網(wǎng)也是一個(gè)互動性極強(qiáng)的平臺，它自由、寬容、平等、共享，并使來自民間的聲音參與到了構(gòu)建主流話語的行動中來[1]。計(jì)算機(jī)技術(shù)的發(fā)展，特別是網(wǎng)絡(luò)技術(shù)的飛速發(fā)展，給文檔的保存和管理提供極大的方便。Internet飛速發(fā)展使得網(wǎng)站不再僅僅為企業(yè)或公司等大型結(jié)構(gòu)所擁有，互聯(lián)網(wǎng)也成為人們快速獲取、發(fā)布和傳遞信息的重要渠道，它在人們政治、經(jīng)濟(jì)、生活等各個(gè)方面發(fā)揮著重要的作用。因此網(wǎng)站建設(shè)在Internet應(yīng)用上的地位顯而易見，一個(gè)家庭甚至個(gè)人都可以擁有屬于自己的網(wǎng)站，而在這其中，個(gè)人網(wǎng)站已經(jīng)日漸普及，而且發(fā)展到今天，創(chuàng)建一個(gè)能充分體現(xiàn)自我風(fēng)格和特色的個(gè)人網(wǎng)站已經(jīng)成為互聯(lián)網(wǎng)用戶的新追求。1.1.2課題的意義隨著Internet的迅速普及，我們已經(jīng)不再滿足于僅僅瀏覽網(wǎng)頁，而是希望更深入地參預(yù)到網(wǎng)絡(luò)中去，Internet的開放性使個(gè)人建立自己的網(wǎng)站成為可能，擁有自己的網(wǎng)站也越來越成為一種時(shí)尚，同時(shí)創(chuàng)建一個(gè)能充分體現(xiàn)自我風(fēng)格和特色的個(gè)人網(wǎng)站已經(jīng)成為互聯(lián)網(wǎng)用戶的新追求?；谏鲜霰尘?，根據(jù)自己在大學(xué)所學(xué)的知識，構(gòu)建一個(gè)個(gè)人網(wǎng)站平臺[2]。從建站的實(shí)際情況出發(fā)，經(jīng)過對相關(guān)網(wǎng)站的一番考察和分析，確立了采用asp和access數(shù)據(jù)庫技術(shù)，以Dreamweaver作為開發(fā)環(huán)境，綜合運(yùn)用其他設(shè)計(jì)軟件，最終實(shí)現(xiàn)個(gè)人網(wǎng)站的主要功能。通過設(shè)計(jì)一個(gè)個(gè)人網(wǎng)站，已達(dá)到個(gè)人推薦，展現(xiàn)自我的一個(gè)空間，個(gè)人網(wǎng)站為交流提供綜合的網(wǎng)絡(luò)環(huán)境，同時(shí)也為個(gè)人宣傳，發(fā)展提供了一平臺[3]。網(wǎng)站主要有：主頁、個(gè)人簡介、圖片、日志、留言和管理幾個(gè)模塊。其中，個(gè)人簡介是自我介紹，有與我相關(guān)的信息。圖片則是用來展示我們平時(shí)收集的一些照片。日志是展示一些優(yōu)美的文章。留言則是瀏覽者用來彼此交流的地方，瀏覽者可以在這里發(fā)表留言。管理是管理員進(jìn)行登錄進(jìn)入的界面，可以對網(wǎng)站進(jìn)行相應(yīng)的管理等功能。真正的做到“學(xué)以致用”，“把理論與實(shí)踐相結(jié)合”。整理為word格式整理為word格式整理為word格式1.2論文的結(jié)構(gòu)第一章，緒論，介紹了本課題的背景及意義；個(gè)人網(wǎng)站“我的主頁”為用戶提供了一個(gè)相互聯(lián)系，相互交流的地方，增強(qiáng)了朋友之間的相互聯(lián)系。第二章，介紹了個(gè)人網(wǎng)站開發(fā)的關(guān)鍵技術(shù)；如ASP，ACCESS以及Dreamweaver的簡介。第三章，介紹了網(wǎng)站后臺的環(huán)境配置，如：IIS的安裝過程、站點(diǎn)的建立和數(shù)據(jù)源的配置。第四章，介紹了系統(tǒng)的需求分析、功能模塊和網(wǎng)站的設(shè)計(jì)風(fēng)格；為方便用戶彼此交流信息，構(gòu)建“我的主頁”網(wǎng)站，有留言板，日志，圖片，個(gè)人簡介等模塊，以及數(shù)據(jù)表的建立。第五章，詳細(xì)介紹了留言板模塊的開發(fā)與實(shí)現(xiàn)以及后臺管理界面功能的實(shí)現(xiàn)。第六章，介紹了網(wǎng)站的測試。結(jié)束語，對本設(shè)計(jì)進(jìn)行了總結(jié)，提出了本設(shè)計(jì)的不足之處，并對未來發(fā)展方向做了展望。整理為word格式整理為word格式整理為word格式第二章關(guān)鍵技術(shù)簡介2.1ASP的簡介ASP技術(shù)ASP（ActiveServerPages動態(tài)網(wǎng)頁）是微軟公司推出的一種用以取代CGI（CommonGatewayInterface通用網(wǎng)關(guān)接口）的技術(shù)。目前，Internet上的許多基于Windows平臺的Web站點(diǎn)已開始應(yīng)用ASP來替換CGI[4]。簡單地講，ASP是一個(gè)位于服務(wù)器端的腳本運(yùn)行環(huán)境，通過這種環(huán)境，用戶可以創(chuàng)建和運(yùn)行動態(tài)的交互式Web服務(wù)器應(yīng)用程序，如交互式動態(tài)網(wǎng)頁，包括使用HTML表單收集和處理信息，上傳與下載等[5]。ASP文件的制作和HTML類似，且和HTML開發(fā)集成，可以在同一個(gè)過程完成，利用ASP將可以執(zhí)行的腳本嵌入到HTML文件中(將HTML文件的后綴名改為.asp)，這使得HTML文件的編寫與腳本的開發(fā)融合在一起[6]。通過ASP內(nèi)置的對象、服務(wù)器組件（ServerComponent）可以完成非常復(fù)雜的任務(wù)，而且用戶還可以自己開發(fā)或利用別人開發(fā)的服務(wù)器組件完成專門的任務(wù)[7]。ASP的特點(diǎn)：1.使用VBScript、JScript等簡單易懂的腳本語言，結(jié)合HTML代碼，即可快速地完成網(wǎng)站的應(yīng)用程序。2.無須compile編譯，容易編寫，可在服務(wù)器端直接執(zhí)行。3.使用普通的文本編輯器，如Windows的記事本，即可進(jìn)行編輯設(shè)計(jì)。4.與瀏覽器無關(guān)（BrowserIndependence），客戶端只要使用可執(zhí)行HTML碼的瀏覽器，即可瀏覽ActiveServerPages所設(shè)計(jì)的網(wǎng)頁內(nèi)容。5.ActiveServerPages能與任何ActiveXscripting語言兼容。除了可使用VBScript或JScript語言來設(shè)計(jì)外，還通過plug－in的方式，使用由第三方所提供的其它腳本語言，譬如REXX、Perl、Tcl等。6.可使用服務(wù)器端的腳本來產(chǎn)生客戶端的腳本。7.ActiveXServerComponents（ActiveX服務(wù)器組件）具有無限可擴(kuò)充性。可以使用VisualBasic、Java、VisualC＋＋、COBOL等程序設(shè)計(jì)語言來編寫你所需要的ActiveXServerComponent[8]。ASP技術(shù)與其他技術(shù)相比，此技術(shù)實(shí)現(xiàn)比較簡單、快捷，適用于小型的網(wǎng)絡(luò)。本網(wǎng)站主要使用ASP技術(shù)和數(shù)據(jù)庫技術(shù)，因?yàn)槭紫扔肈reamweaver軟件建立動態(tài)網(wǎng)站，然后與數(shù)據(jù)庫進(jìn)行連接，在此基礎(chǔ)上對該網(wǎng)站進(jìn)行詳細(xì)設(shè)計(jì)，最后進(jìn)行相關(guān)測試。2.2ACCESS的簡介MicrosoftAccess2010的特點(diǎn)，就在于使用簡便。Access2010充分運(yùn)用信息的力量。在追蹤與共享數(shù)據(jù)，或是利用數(shù)據(jù)制作報(bào)表時(shí)，將更加輕松無負(fù)擔(dān)，這些數(shù)據(jù)自然也就更具影響力。整理為word格式整理為word格式整理為word格式1.最好上手、最快上手。在Access2010中，可以發(fā)揮社群的力量。采用其他人建立的數(shù)據(jù)庫模板，并且分享獨(dú)到設(shè)計(jì)。2.使用多種數(shù)據(jù)聯(lián)機(jī)，以及從其他來源鏈接或匯入的信息，以整合Access報(bào)表，讓閱讀報(bào)表的人都能更容易掌握趨勢、洞燭機(jī)先。3.在任何地方都能存取應(yīng)用程序、數(shù)據(jù)或窗體。將數(shù)據(jù)庫延伸到網(wǎng)絡(luò)上，讓沒有Access客戶端的使用者，也能透過瀏覽器開啟網(wǎng)絡(luò)窗體與報(bào)表。4.把親切熟悉、賞心悅目的Office主題，原汁原味地套用到Access客戶端與網(wǎng)絡(luò)數(shù)據(jù)庫上。5.以拖放方式為數(shù)據(jù)庫加入導(dǎo)航功能。6.更快、更輕松地完成工作。Access2010能簡化尋找及使用各項(xiàng)功能的方式。7.使用IntelliSense建立表達(dá)式，不費(fèi)吹灰之力。經(jīng)過簡化的“表達(dá)式建立器”可以更快、更輕松地建立數(shù)據(jù)庫中的邏輯與表達(dá)式。8.以前所未有的超快速度設(shè)計(jì)宏。Access2010擁有面目一新的宏設(shè)計(jì)工具，可以更輕松地建立、編輯并自動化執(zhí)行數(shù)據(jù)庫邏輯。9.把數(shù)據(jù)庫部分轉(zhuǎn)化成可重復(fù)使用的模板。重復(fù)使用由數(shù)據(jù)庫的其他用戶所建置的數(shù)據(jù)庫組件，節(jié)省時(shí)間與心力。10.重復(fù)使用由數(shù)據(jù)庫的其他用戶所建置的數(shù)據(jù)庫組件，節(jié)省時(shí)間與心力。可以經(jīng)由網(wǎng)絡(luò)服務(wù)通訊協(xié)議，聯(lián)機(jī)到數(shù)據(jù)源[9]。ACCESS是桌面型關(guān)系數(shù)據(jù)庫，適于小型的開發(fā)和小數(shù)據(jù)量的應(yīng)用，部署簡單方便，就一個(gè)文件。SQLSERVER是中型DBMS，適于較大數(shù)據(jù)量和高性能要求的應(yīng)用，管理相對復(fù)雜，但是功能強(qiáng)大，存儲過程，觸發(fā)器，自定義函數(shù)，定時(shí)JOB，MAIL通知等很多功能[10]。2.3Dreamweaver的簡介Dreamweaver是目前流行的一款可視化網(wǎng)頁制作工具，具有簡潔高效的設(shè)計(jì)和開發(fā)界面，它的所見即所得特性使得用戶無需編寫代碼即可完成網(wǎng)頁的制作，簡單易用，非常適合初學(xué)者使用，同時(shí)，Dreamweaver也支持代碼設(shè)計(jì)，為高級程序人員提供了代碼編輯環(huán)境，方便程序人員應(yīng)用HTML或其他代碼進(jìn)行網(wǎng)頁開發(fā)[11]。自Dreamweaver問世以來已更換了多個(gè)版本，而每一次升級都會給用戶帶來更多的驚喜，當(dāng)前最新版本DreamweaverCS5的出現(xiàn)同樣不負(fù)眾望，又在原版本的基礎(chǔ)上增加了一些新的功能，并對一些不足之處進(jìn)行了調(diào)整，從而使Dreamweaver的功能更加強(qiáng)大，使用起來也更加得心用手。整理為word格式整理為word格式整理為word格式DreamweaverCS5的新功能如下：1.集成CMS支持。即對WordPress、Joomla！和Drupal等內(nèi)容管理系統(tǒng)框架的創(chuàng)作和測試支持。2.CSS檢查。在DreamweaverCS5中能以可是方式顯示詳細(xì)的CSS框模型，使用戶可以輕松切換CSS屬性，并且無需讀取代碼或使用其他實(shí)用程序。3.與AdobeBrowserlab集成。可使用多個(gè)查看、診斷和比較工具預(yù)覽動態(tài)網(wǎng)頁和本地內(nèi)容。4.PHP自定義類代碼提示。為自定義PHP函數(shù)顯示適當(dāng)?shù)恼Z法，可幫助用戶更準(zhǔn)確的書寫代碼。5.站點(diǎn)特定的代碼提示?？蓮腄reamweaver中的非標(biāo)準(zhǔn)文件和目錄代碼提示中受益[12]。整理為word格式整理為word格式整理為word格式第三章后臺環(huán)境配置3.1IIS安裝和配置在windows7中實(shí)現(xiàn)配置IIS1.單擊【開始】-【控制面板】-【程序】，打開“程序和功能”對話框。（如圖3-1所示）圖3-1程序和功能對話框2.單擊左邊菜單欄中【打開或關(guān)閉Windows功能】項(xiàng)，打開“Windows功能”對話框，在對話框“組件”列表中，選中“Internet

信息服務(wù)（IIS）”項(xiàng)。（如圖3-2所示）圖3-2windows功能對話框3.選中“Internet

信息服務(wù)（IIS）”項(xiàng)，然后單擊“確定”即可。隨后系統(tǒng)會自動彈出整理為word格式整理為word格式整理為word格式“正在配置組件”提示框，這時(shí)候用戶需等待一段時(shí)間。4.點(diǎn)擊“完成”按鈕，完成IIS的安裝。3.2設(shè)置數(shù)據(jù)源（ODBC）在windows7中設(shè)置“數(shù)據(jù)源”（ODBC）1.單擊【開始】-【控制面板】-【管理工具】，打開“管理工具”對話框。（如圖3-3所示）圖3-3管理工具對話框2.在“管理工具”對話框中，選擇“數(shù)據(jù)源（ODBC）”，彈出“ODBC數(shù)據(jù)源管理器”對話框。（如圖3-4所示）圖3-4ODBC數(shù)據(jù)源管理器3.在彈出的“ODBC數(shù)據(jù)源管理器”對話框中，選擇【系統(tǒng)DSN】，在右側(cè)點(diǎn)擊【添加】按鈕，彈出【創(chuàng)建新數(shù)據(jù)源】對話框，在【創(chuàng)建新數(shù)據(jù)源】對話框中選中整理為word格式整理為word格式整理為word格式“MicrosoftAccessDriver（*.mdb）”，單擊【完成】按鈕。（如圖3-5所示）圖3-5創(chuàng)建數(shù)據(jù)源4.點(diǎn)擊【完成】按鈕后，會彈出【ODBCMicrosoftAccess安裝】對話框，設(shè)置【數(shù)據(jù)源名稱】為“conm”。（如圖3-6所示）圖3-6修改數(shù)據(jù)源名稱5.再單擊【數(shù)據(jù)庫】選項(xiàng)下的【選擇】按鈕打開【選擇數(shù)據(jù)庫】對話框，在【選擇數(shù)據(jù)庫】對話框中設(shè)置【數(shù)據(jù)庫名稱】為“conm.mdb”，【文件類型】為Access數(shù)據(jù)庫（*.mdb）。（如圖3-7所示）整理為word格式整理為word格式整理為word格式圖3-7選擇數(shù)據(jù)庫6.然后單擊【確定】按鈕回到【ODBCMicrosoftAccess安裝】對話框，其中【數(shù)據(jù)庫】參數(shù)變?yōu)樗x擇的數(shù)據(jù)庫。7.再單擊【確定】按鈕回到【ODBC數(shù)據(jù)源管理器】對話框，然后單擊【確定】按鈕完成設(shè)置。3.3Dreamweaver開發(fā)站點(diǎn)環(huán)境1.啟動Dreamweaver，進(jìn)入到工作界面，單擊【站點(diǎn)】菜單下的【新建站點(diǎn)】選項(xiàng)，彈出【站點(diǎn)定義】對話框，在【站點(diǎn)定義】名稱中輸入我們的項(xiàng)目名稱“Family”。（如圖3-8所示）圖3-8定義站點(diǎn)2.單擊【下一步】，彈出【是否使用服務(wù)器技術(shù)】中，選擇【是，我想使用服務(wù)器技術(shù)?！?，在【那種服務(wù)器技術(shù)？】的下拉列表中選擇【ASPVBScript】。（如圖3-9所示）整理為word格式整理為word格式整理為word格式圖3-9選擇服務(wù)器3.單擊【下一步】，在【開發(fā)過程中，您打算如何使用您的文件？】項(xiàng)，選擇【在本地進(jìn)行編輯和測試】項(xiàng)，然后，在【將把文件存儲在計(jì)算機(jī)上的什么位置】中選擇我們的目錄所在位置“D:\畢業(yè)設(shè)計(jì)\Family\”。（如圖3-10所示）圖3-10設(shè)置存儲位置4.單擊【下一步】，在【測試URL】設(shè)置中虛擬目錄地址為默認(rèn)地址，然后單擊【測試URL】按鈕進(jìn)行測試。會彈出【URL前綴測試成功】對話框，單擊【確定】。（如圖3-11所示）整理為word格式整理為word格式整理為word格式圖3-11測試URL5.單擊【下一步】，在遠(yuǎn)程服務(wù)器設(shè)置面板中，由于我們是在本地進(jìn)行開發(fā)和測試，所以我們選擇【否】。（如圖3-12所示）圖3-12本地開發(fā)測試6.單擊【下一步】，單擊【完成】后就建立好了這個(gè)站點(diǎn)。（如圖3-13所示）整理為word格式整理為word格式整理為word格式圖3-13完成站點(diǎn)定義在Dreamweaver中建立站點(diǎn)是一件簡單而直觀的事情，要知道站點(diǎn)的建立是使用Dreamweaver進(jìn)行開發(fā)的第一步。如果沒有建立好站點(diǎn)，那么Dreamweaver的開發(fā)功能將會不能使用。整理為word格式整理為word格式整理為word格式第四章系統(tǒng)分析與設(shè)計(jì)現(xiàn)在人人都體會到了網(wǎng)絡(luò)時(shí)代的強(qiáng)烈沖擊，學(xué)習(xí)網(wǎng)絡(luò)知識、學(xué)習(xí)網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)成為新時(shí)代的一個(gè)熱點(diǎn)。人是社會性的動物，具有多方面的欲望和追求，被人理解、被社會承認(rèn)是人的高級欲望中的一種?，F(xiàn)在暢行的個(gè)人形象設(shè)計(jì)已成為一種龐大市場就說明了這個(gè)問題。傳統(tǒng)的個(gè)人形象展示依靠照相、錄像、演講、交談或文字說明等形式，而個(gè)人網(wǎng)站是所有形式中最新穎、最直觀、最有效、最綜合、最高級的形式。4.1需求分析為方便用戶彼此交流信息，網(wǎng)站提供如下的幾個(gè)模塊功能。其需求描述如下：1.主頁模塊：是網(wǎng)站的首頁，通過首頁可以鏈接到任何頁面，方便、快捷。2.個(gè)人簡介：主要介紹管理員的相關(guān)信息。3.日志模塊：以列表的形式顯示文章信息，這樣可以在頁面顯示大量的日志信息。當(dāng)用戶找到感興趣的文章后需要點(diǎn)擊文章標(biāo)題，會彈出相應(yīng)的文章的具體內(nèi)容。4.留言模塊：在留言頁面以表格的形式來顯示用戶所發(fā)送的留言。用戶可以發(fā)布留言和評論留言，但管理員可以刪除留言和回復(fù)留言。5.圖片模塊：在圖片頁面以排列的方式顯示圖片，圖片分為幾種類型，可以根據(jù)自己的喜好欣賞。6.管理模塊：在這里管理員可以通過登錄進(jìn)入管理界面，在這里有用戶管理、文章管理、留言管理。管理員可以在這里對網(wǎng)站進(jìn)行定期的更新和維護(hù)。4.2功能模塊設(shè)計(jì)根據(jù)需求分析中的模塊分類方法，可以得到系統(tǒng)的操作流程圖。個(gè)人網(wǎng)站的操作流程主要在“首頁"處。本設(shè)計(jì)的用戶分為兩類：用戶，管理員。用戶僅有部分瀏覽功能；管理員具備用戶的所有權(quán)限，同時(shí)還能發(fā)布文章，刪除留言，修改文章，修改用戶信息等。根據(jù)這些功能，設(shè)計(jì)出系統(tǒng)的功能模塊，具體的功能模塊如圖4-1所示整理為word格式整理為word格式整理為word格式妖精的城堡妖精的城堡后臺模塊前臺管理發(fā)表文章留言管理日志管理用戶管理用戶注冊主頁留言圖片日志個(gè)人簡介退出管理圖4-1功能模塊示意圖4.3確定網(wǎng)站風(fēng)格4.3.1主頁版塊每個(gè)網(wǎng)站都會有一個(gè)主頁，主頁是進(jìn)入網(wǎng)站后在瀏覽器中顯示的第一個(gè)頁面。為了瀏覽方便，所以在進(jìn)行版面設(shè)計(jì)時(shí)，將本站的幾個(gè)主要版塊的內(nèi)容都濃縮在主頁的界面里，從而令用戶能快速的看到用戶所感興趣的內(nèi)容，節(jié)省用戶瀏覽時(shí)間。圖4-2主頁效果圖整理為word格式整理為word格式整理為word格式4.3.2網(wǎng)站字體網(wǎng)站字體(Font)設(shè)置是網(wǎng)站制作中設(shè)計(jì)師經(jīng)常遇到的一個(gè)很關(guān)鍵的問題，每一個(gè)網(wǎng)站都應(yīng)該仔細(xì)，認(rèn)真地思考自己網(wǎng)站的字體，合適的網(wǎng)站字體能讓客戶對網(wǎng)站產(chǎn)生信賴感，產(chǎn)生一種權(quán)威感，而不合適的字體往往會使用戶產(chǎn)生一種排斥感，和低級感。網(wǎng)站的字體是一門學(xué)問，網(wǎng)站優(yōu)化不能僅僅從技術(shù)角度去做，應(yīng)該把網(wǎng)站自身的設(shè)計(jì)做好，只有這些好的基礎(chǔ)，網(wǎng)站的優(yōu)化，推廣才會真正產(chǎn)生效果。網(wǎng)站設(shè)計(jì)中字體的使用原則：

1.不要使用超過3種以上的字體。字體太多則顯得雜亂，沒有主題。2.不要用太大的字。因?yàn)榘婷媸怯邢薜?，大字體占的版面太多也沒有什么效果。

3.不要使用不停閃爍的文字。會讓瀏覽者眼花繚亂。4.3.3網(wǎng)站版塊本網(wǎng)站主要是根據(jù)用戶的需求制作的個(gè)人網(wǎng)站。用戶可以直接瀏覽該網(wǎng)站的所有內(nèi)容，也可注冊用戶。內(nèi)容包括：主頁、個(gè)人簡介、日志、留言板、圖片、管理等版塊。(如圖4-3所示)圖4-3主頁導(dǎo)航界面就是網(wǎng)站給瀏覽者的第一印象，往往決定著網(wǎng)站的可看性，本站的主頁是通過“家”的感覺來呈現(xiàn)的，可以給瀏覽者一種溫馨的感覺，會感到幸福。而導(dǎo)航就是通過與相關(guān)版塊的聯(lián)系而制作的相關(guān)聯(lián)的形狀，更形象生動的表現(xiàn)了網(wǎng)站的生動活潑。構(gòu)建一個(gè)網(wǎng)站就好比寫一篇論文，首先要列出題綱，才能主題明確、層次清晰。網(wǎng)站建設(shè)初學(xué)者，最容易犯的錯誤就是，確定題材后立刻開始制作，沒有進(jìn)行合理規(guī)劃。從而導(dǎo)致網(wǎng)站結(jié)構(gòu)不清晰，目錄龐雜混亂，板塊編排混亂等。結(jié)果不但瀏覽者看得糊里糊涂，制作者自己在擴(kuò)充和維護(hù)網(wǎng)站也相當(dāng)困難。所以，我們在動手制作網(wǎng)頁前，一定要考慮好欄目和板塊的編排問題。另外，板塊的編排設(shè)置也要合理安排與劃分。版塊比欄目的概念要大一些，每個(gè)版塊都有自己的欄目。整理為word格式整理為word格式整理為word格式4.4數(shù)據(jù)庫邏輯結(jié)構(gòu)設(shè)計(jì)首先創(chuàng)建Access數(shù)據(jù)庫conm.mbd用來保存本系統(tǒng)的所有數(shù)據(jù)。本設(shè)計(jì)定義conm.mbd數(shù)據(jù)庫中包含以下幾個(gè)表：用戶注冊表、留言表、日志表、管理員表。下面分別介紹這幾個(gè)表的結(jié)構(gòu)1.用戶注冊表表4-1admin1編號字段說明數(shù)據(jù)類型1Id編號自動編號2name姓名文本3mima密碼數(shù)字4sex性別文本5shengri出生日期日期/時(shí)間6work職業(yè)文本7phone聯(lián)系方式數(shù)字8time時(shí)間日期/時(shí)間2.留言表表4-2book編號字段說明數(shù)據(jù)類型1id編號自動編號2name姓名文本3sex性別文本4work職業(yè)文本5time時(shí)間日期/時(shí)間6liuyan留言內(nèi)容備注7huifu回復(fù)內(nèi)容備注8pinglun評論內(nèi)容備注3.日志表表4-3rizhi2編號字段說明數(shù)據(jù)類型1Id編號自動編號2rtitle標(biāo)題備注整理為word格式整理為word格式整理為word格式3zuozhe作者文本4nei內(nèi)容備注5riqi時(shí)間日期/時(shí)間6nr主要內(nèi)容備注管理員表表4-4guanli編號字段說明數(shù)據(jù)類型1name管理員文本2password密碼文本整理為word格式整理為word格式整理為word格式第五章系統(tǒng)的實(shí)現(xiàn)該系統(tǒng)的實(shí)現(xiàn)主要包含主頁，個(gè)人簡介，日志，圖片，留言和管理界面的制作。其中留言界面是很重要的，對與瀏覽頁面，提供了瀏覽和發(fā)布信息的功能。而留言就提供了交流和動態(tài)的感覺這樣就成了交互的功能。達(dá)到了溝通和交流的目的。所以，本設(shè)計(jì)最大的特點(diǎn)就是這個(gè)留言模塊，提供了交流的設(shè)計(jì)。5.1留言板的實(shí)現(xiàn)5.1.1留言板的主界面完整的留言板具有發(fā)表留言和查看別人留言及評論留言的功能，下面有留言板頁面的效果圖。（如圖5-1所示）圖5-1留言板效果圖5.1.2留言板主界面的制作1.在Dreamweaver中打開“gl.asp”,在右側(cè)的【應(yīng)用程序】中【數(shù)據(jù)庫】的“+”在彈出的下拉列表中選擇【數(shù)據(jù)源名稱（DSN）】，在彈出的【數(shù)據(jù)源名稱（DSN）】對話框中，設(shè)置【連接名稱】為“conm”，【數(shù)據(jù)源名稱（DSN）】為“conm”，單擊右側(cè)的【測試】，會彈出【成功連接腳本】對話框，表示數(shù)據(jù)庫添加完成。（如圖5-2所示）整理為word格式整理為word格式整理為word格式圖5-2連接數(shù)據(jù)源2.在右側(cè)的屬性欄中選擇【綁定】點(diǎn)擊“+”【記錄集（查詢）】，彈出【記錄集】對話框，在其中設(shè)置【連接】為“conm”，【表格】為“book”，【列】選擇【全部】，【排序】中選擇【id，降序】，并單擊【確定】。（如圖5-3所示）圖5-3綁定記錄集3.選擇【插入記錄】—【表單】，在表單中插入4行3列的表格，將【記錄集】里的字段拖曳到相應(yīng)的單元格中。然后在右側(cè)的屬性欄中選擇【服務(wù)器行為】點(diǎn)擊“+”【重復(fù)區(qū)域】，彈出【重復(fù)區(qū)域】對話框中設(shè)置【顯示】為“7”條記錄(根據(jù)個(gè)人喜好設(shè)置)，單擊【確定】。（如圖5-4所示）圖5-4重復(fù)區(qū)域整理為word格式整理為word格式整理為word格式4.將光標(biāo)放在下一行上，選擇【插入】-【數(shù)據(jù)對象】-【顯示記錄計(jì)數(shù)】-【記錄集導(dǎo)航狀態(tài)】，單擊【確定】。再選擇【插入】-【數(shù)據(jù)對象】-【記錄集分頁】-【記錄集導(dǎo)航條】，【顯示方式】選擇【圖像】。（如圖5-5，圖5-6所示）圖5-5記錄集導(dǎo)航狀態(tài)圖5-6記錄集導(dǎo)航條5.單擊【確定】，然后選中“評論”，點(diǎn)擊【服務(wù)器行為】單擊“+”選擇【轉(zhuǎn)到詳細(xì)頁面】，在【轉(zhuǎn)到詳細(xì)頁面】對話框中設(shè)置【詳細(xì)信息頁】為“pl.asp”等，然后單擊【確定】。（如圖5-7所示）圖5-7詳細(xì)頁設(shè)置6.按【Ctrl+S】保存操作，按F12，預(yù)覽效果。（如圖5-8，5-9所示）整理為word格式整理為word格式整理為word格式圖5-8留言板效果圖圖5-9留言板效果圖5.1.3發(fā)表留言界面的制作發(fā)表留言是為瀏覽者可以與管理進(jìn)行交流的平臺，可以發(fā)表留言信息，然后在主界面上顯示。（如圖5-10所示）圖5-10發(fā)表留言界面整理為word格式整理為word格式整理為word格式1.在Dreamweaver中打開“fb.asp”，在網(wǎng)頁中插入表單，在表單中插入個(gè)4行2列的表格，并輸入文本，并且設(shè)置它們的“文本域”與數(shù)據(jù)庫中的字段相同。（如圖5-11所示）圖5-11設(shè)置文本域2.選擇【綁定】點(diǎn)擊“+”【記錄集（查詢）】，彈出【記錄集】對話框，在其中設(shè)置【連接】為“conm”，【表格】為“book”，【排序】中選擇【id，降序】，并單擊【確定】。（如圖5-12所示）圖5-12綁定記錄集3.選擇【服務(wù)器行為】點(diǎn)擊“+”【插入記錄】，彈出【插入記錄】對話框，在其中設(shè)置【連接】為“conm”，【表格】為“book”，【插入后，轉(zhuǎn)到】為“gl.asp”，【表單元素】中設(shè)置相對應(yīng)的字段，并單擊【確定】。（如圖5-13所示）圖5-13插入記錄4.保存操作，按F12預(yù)覽效果。（如圖5-14所示）整理為word格式整理為word格式整理為word格式圖5-14發(fā)表留言效果圖通過留言板的制作，希望瀏覽者瀏覽本站而了解我，與許久未聯(lián)系的朋友們交流，彼此交流愛好和興趣，留言板還可以與其他網(wǎng)絡(luò)上志同道合的朋友們互相交流，探討知識等。5.2后臺管理界面在一個(gè)網(wǎng)站中，后臺管理是非常重要的，管理員可以通過后臺登錄，驗(yàn)證成功后可以對網(wǎng)站進(jìn)行信息的更新，留言的回復(fù)和系統(tǒng)的修改完善，所以一個(gè)好的網(wǎng)站需要有一個(gè)完善的后臺管理系統(tǒng)。5.2.1登錄界面在對系統(tǒng)進(jìn)行管理之前，需要通過系統(tǒng)的身份驗(yàn)證。本站中使用“l(fā)ogin.asp”進(jìn)行身份驗(yàn)證。只有用戶名和密碼正確才可以進(jìn)入管理界面，否則就會進(jìn)入“cw.asp”，登錄界面如圖5-15所示。圖5-15登錄界面本系統(tǒng)只因?yàn)槭荄reamweaver開發(fā)而成的，里面的代碼都是自動生成的。后臺登錄界面所需要的關(guān)鍵代碼如下：<tablewidth="26%"height="91"border="0"align="center"><tr><tdwidth="38%"><divalign="center"class="STYLE6">用戶名：</div></td>整理為word格式整理為word格式整理為word格式<tdwidth="62%"><inputtype="text"name="name"id="name"/></td></tr><tr><td><divalign="center"class="STYLE6">密碼：</div></td><td><inputtype="password"name="mima"id="mima"/></td></tr><tr><tdheight="23"> </td><td><inputtype="submit"name="button"id="button"value="提交"/>         <inputtype="reset"name="button2"id="button2"value="重置"/></td></tr></table>5.2.2管理員管理界面后臺管理界面是在通過用戶驗(yàn)證后才可以進(jìn)入，它分為各個(gè)管理模塊、主頁及與其他頁面的鏈接、退出管理系統(tǒng)等模塊。它是由框架組成的從而可以減少重復(fù)部分并可以使系統(tǒng)維護(hù)更容易管理（如圖5-16所示）圖5-16管理界面管理員管理界面主要代碼如下：<tr><tdwidth="20%"height="348"valign="top"><palign="center"class="STYLE1"><ahref="yhgl.asp"target="mainframe"class="STYLE3">用戶管理</a></p>整理為word格式整理為word格式整理為word格式<palign="center"class="STYLE1"><ahref="guanli/wzgl.asp"target="mainframe"class="STYLE3">文章管理</a></p><palign="center"class="STYLE5"><ahref="liuyan1.asp"target="mainframe"class="STYLE6">留言管理</a></p><palign="center"class="STYLE1"><ahref="guanli/yhzc.asp"target="mainframe"class="STYLE3">用戶注冊</a></p><palign="center"class="STYLE1"><ahref="rizhi2/xjwz.asp"target="mainframe"class="STYLE3">發(fā)表日志</a></p><palign="center"class="STYLE1"><ahref="index1.asp"class="STYLE3">退出管理</a></p></td><tdwidth="80%"valign="top"><iframename="mainframe"src="yhgl.asp"height="520"width="800"id="mainframe"align="top"></iframe></td></tr>5.2.3后臺管理模塊設(shè)計(jì)1.管理員管理界面用戶管理界面如圖5-17所示圖5-17用戶管理界面用戶管理界面關(guān)鍵代碼如下：<tablewidth="100%"height="71"border="1"align="center"><tr><tdwidth="15%"height="29"><divalign="center"class="STYLE5">用戶名</div></td><tdwidth="15%"><divalign="center"><spanclass="STYLE5">聯(lián)系電話</span></div></td>整理為word格式整理為word格式整理為word格式<tdwidth="15%"><divalign="center"class="STYLE5">職業(yè)</div></td><tdwidth="14%"><divalign="center"class="STYLE5">性別</div></td><tdwidth="14%"><divalign="center"class="STYLE5">注冊時(shí)間</div></td><tdwidth="17%"><divalign="center"class="STYLE5">修改</div></td><tdwidth="12%"><divalign="center"class="STYLE5">刪除</div></td></tr><%While((Repeat1__numRows<>0)AND(NOTRecordset1.EOF))%><tr><tdheight="34"><divalign="center"class="STYLE5"><%=(Recordset1.Fields.Item("name").Value)%></div></td><td><spanclass="STYLE5"><%=(Recordset1.Fields.Item("phone").Value)%></span></td><td><spanclass="STYLE5"><%=(Recordset1.Fields.Item("work").Value)%></span></td><td><divalign="center"class="STYLE5"><%=(Recordset1.Fields.Item("sex").Value)%></div></td><td><divalign="center"class="STYLE5"><%=(Recordset1.Fields.Item("time").Value)%></div></td><td><divalign="center"><ahref="xgyh.asp?<%=Server.HTMLEncode(MM_keepNone)&MM_joinChar(MM_keepNone)&"id="&Recordset1.Fields.Item("id").Value%>"class="STYLE9">修改</a></div></td><td><formid="form1"name="form1"method="POST"action="<%=MM_editAction%>"><divalign="center">整理為word格式整理為word格式整理為word格式<inputtype="submit"name="button"id="button"value="刪除"onclick="returnconfirm('確認(rèn)刪除');MM_popupMsg('確認(rèn)刪除信息嗎？')"/><inputtype="hidden"name="MM_delete"value="form1"/><inputtype="hidden"name="MM_recordId"value="<%=Recordset1.Fields.Item("id").Value%>"/></div></form></td></tr><%Repeat1__index=Repeat1__index+1Repeat1__numRows=Repeat1__numRows-1Recordset1.MoveNext()Wend%></table>2.日志管理模塊日志管理界面如圖5-18所示圖5-18日志管理界面日志管理界面關(guān)鍵代碼如下：<tablewidth="92%"border="1"align="center"><tr><tdwidth="23%"><divalign="center"class="STYLE3">標(biāo)題</div></td><tdwidth="18%"><divalign="center"class="STYLE3">作者</div></td>整理為word格式整理為word格式整理為word格式<tdwidth="14%"><divalign="center"class="STYLE3">發(fā)表時(shí)間</div></td><tdwidth="23%"><divalign="center"class="STYLE3">內(nèi)容</div></td><tdwidth="11%"><divalign="center"class="STYLE3">修改</div></td><tdwidth="11%"><divalign="center"class="STYLE3">刪除</div></td></tr><%While((Repeat1__numRows<>0)AND(NOTRecordset1.EOF))%><tr><td><divalign="center"><%=(Recordset1.Fields.Item("rtitle").Value)%></div></td><td><divalign="center"><%=(Recordset1.Fields.Item("zuozhe").Value)%></div></td><td><divalign="center"><%=(Recordset1.Fields.Item("riqi").Value)%></div></td><td><divalign="center"><%=(Recordset1.Fields.Item("nr").Value)%></div></td><td><divalign="center"><ahref="xgwz.asp?<%=Server.HTMLEncode(MM_keepNone)&MM_joinChar(MM_keepNone)&"id="&Recordset1.Fields.Item("id").Value%>"class="STYLE5">修改</a></div></td><td><formid="form1"name="form1"method="POST"action="<%=MM_editAction%>"><divalign="center"><inputtype="submit"name="button"id="button"value="刪除"onclick="returnconfirm('確認(rèn)刪除');MM_popupMsg('確認(rèn)')"/><inputtype="hidden"name="MM_delete"value="form1"/>整理為word格式整理為word格式整理為word格式<inputtype="hidden"name="MM_recordId"value="<%=Recordset1.Fields.Item("id").Value%>"/></div></form></td></tr><%Repeat1__index=Repeat1__index+1Repeat1__numRows=Repeat1__numRows-1Recordset1.MoveNext()Wend%></table>3.留言管理模塊留言管理界面如圖5-19所示圖5-19留言管理界面留言管理界面關(guān)鍵代碼如下：<tablewidth="102%"border="1"align="center"><tr><tdwidth="27%"rowspan="4"><divalign="center"><%=(Recordset1.Fields.Item("name").Value)%></div>整理為word格式整理為word格式整理為word格式<palign="center"><%=(Recordset1.Fields.Item("work").Value)%></p></td><tdwidth="30%"><divalign="center"><%=(Recordset1.Fields.Item("sex").Value)%></div></td><tdwidth="43%"><divalign="right"><%=(Recordset1.Fields.Item("time").Value)%></div></td></tr><tr><tdheight="37"colspan="2"><%=(Recordset1.Fields.Item("liuyan").Value)%></td></tr><tr><tdheight="23"colspan="2"><%=(Recordset1.Fields.Item("huifu").Value)%></td></tr><tr><tdheight="25"><divalign="center"><ahref="liuyan/hf.asp?<%=Server.HTMLEncode(MM_keepNone)&MM_joinChar(MM_keepNone)&"id="&Recordset1.Fields.Item("id").Value%>"class="STYLE5">回復(fù)</a></div></td><tdheight="25"><formid="form2"name="form2"method="POST"action="<%=MM_editAction%>"><inputname="button"type="submit"id="button"value="刪除"onclick="returnconfirm('確認(rèn)刪除');MM_popupMsg('確認(rèn)刪除信息嗎？')"/><inputtype="hidden"name="MM_delete"value="form2"/><inputtype="hidden"name="MM_recordId"value="<%=Recordset1.Fields.Item("id").Value%>"/></form></td></tr></table>對于管理界面的設(shè)計(jì)，可以使管理員更方便的對網(wǎng)站進(jìn)行管理。整理為word格式整理為word格式整理為word格式整理為word格式整理為word格式整理為word格式第六章網(wǎng)站的測試一個(gè)好的網(wǎng)站建設(shè)好了之后是不能立即發(fā)布的，在這之前需要進(jìn)行一段時(shí)間的測試，沒有經(jīng)過測試的網(wǎng)站往往會在瀏覽器兼容性和顯示器兼容性上出現(xiàn)問題。同樣由于在程序開發(fā)和頁面制作的過程中難免會出現(xiàn)誤差，所以在正式發(fā)布前通過測試找出網(wǎng)站的Bug（網(wǎng)頁中的漏洞）是非常重要的一個(gè)環(huán)節(jié)，通常稱此過程為捉蟲。在我的個(gè)人網(wǎng)站的測試過程中，在數(shù)據(jù)庫的鏈接