1、興 義 民 族 師 范 學(xué) 院 畢業(yè)設(shè)計(jì)論文題 目：基于php的留言板的設(shè)計(jì)專 業(yè)：現(xiàn)代教育技術(shù)指導(dǎo)老師：王波班 級(jí)：2009級(jí)學(xué) 號(hào)：3學(xué)生姓名：王艷紅時(shí) 間：2012年6月獨(dú) 創(chuàng) 性 聲 明本人聲明所呈交的學(xué)位論文是本人在導(dǎo)師指導(dǎo)下進(jìn)行的研究工作及取得的研究成果。盡我所知，除了文中特別加以標(biāo)注和致謝的地方外，論文中不包含其他人已經(jīng)發(fā)表或撰寫過的研究成果。與我一同工作的同志對(duì)本研究所做的任何貢獻(xiàn)均已在論文中作了明確的說明并表示謝意。簽名：日期：關(guān)于論文使用授權(quán)的說明本論文作者完全了解興義民族師范學(xué)院有關(guān)保留、使用論文的規(guī)定：興義民族師范學(xué)院有權(quán)保留并向國家有關(guān)部門或機(jī)構(gòu)送交論文的復(fù)印件和磁盤

2、，允許論文被查閱和借閱，可以將論文的全部或部分內(nèi)容編入有關(guān)數(shù)據(jù)庫進(jìn)行檢索，可以采用影印、縮印或掃描等復(fù)制手段保存、匯編學(xué)位論文，并且本人電子文檔的內(nèi)容和紙質(zhì)論文的內(nèi)容相一致。簽名：日 期：指導(dǎo)教師簽 名：日期：摘要Internet的迅猛發(fā)展，推動(dòng)了各種網(wǎng)絡(luò)技術(shù)的不斷產(chǎn)生和更新，PHP便是在這一條件下產(chǎn)生的，PHP，是英文超級(jí)文本預(yù)處理語言Hypertext Preprocessor的縮寫。PHP是一種HTML內(nèi)嵌式的語言，是一種在服務(wù)器端執(zhí)行的嵌入HTML文檔的腳本語言，語言的風(fēng)格有類似于C語言，被廣泛的運(yùn)用。PHP的最新版本是PHP5.0，它有很多功能。首先，PHP5.0完全實(shí)現(xiàn)面向?qū)ο?，?/p>

3、供名為PHP兼容模式的功能。其次是XML功能，PHP5.0版本支持可直觀地訪問XML數(shù)據(jù)、名為SimpleXML的XML處理用界面。同時(shí)還強(qiáng)化了XMLWeb服務(wù)支持，而且標(biāo)準(zhǔn)支持SOAP擴(kuò)展模塊。數(shù)據(jù)庫方面，PHP新版本提供旨在訪問MySQL的新界面MySQL。除此前的界面外，還可以使用面向?qū)ο蠼缑婧皖A(yù)處理語句（Prepared Statement）等MySQL的新功能。現(xiàn)在我做一個(gè)班級(jí)同學(xué)同學(xué)錄網(wǎng)站，使大家互相溝通、交流討論。這個(gè)同學(xué)錄網(wǎng)站就是通過DreamweaverCS4和PHP以及MySQL來完成的，為網(wǎng)絡(luò)用戶提供的一個(gè)能夠多人參與交流的方式。本文主要介紹網(wǎng)站系統(tǒng)的設(shè)計(jì)思路和制作過程，

4、從網(wǎng)站的重要性開始，介紹我的網(wǎng)站采用的主要技術(shù)。該網(wǎng)站較全面地利用Dreamweaver技術(shù)實(shí)現(xiàn)網(wǎng)站的基本功能：留言、刪除、等功能，并增加了一些特色功能。最后介紹自己從構(gòu)思到設(shè)計(jì)再到制作的一些心得體會(huì)。關(guān)鍵字：DreamweaverCS4 PHP MySQL目錄第一章前言1第二章 課題來源及需求分析22.1 課題來源22.2 需求分析2第三章 總體設(shè)計(jì)方案33.1 網(wǎng)站規(guī)范33.1.1 命名規(guī)范33.1.2 目錄結(jié)構(gòu)規(guī)范33.1.3 尺寸規(guī)范33.1.4 形象設(shè)計(jì)規(guī)范43.1.5 數(shù)據(jù)庫使用規(guī)范43.2 網(wǎng)站流程圖43.3 素材收集及加工53.3.1 素材收集53.3.2 素材加工54.1 所

5、需要的軟、硬件環(huán)境64.1.1 硬件環(huán)境64.1.2 軟件環(huán)境64.2 開發(fā)工具的選用及介紹64.2.1 頁面設(shè)計(jì)工具64.2.2 圖象制作編輯工具74.2.3 MySQL數(shù)據(jù)庫74.3.2 數(shù)據(jù)庫設(shè)計(jì)84.3.3 Dreamweaver站點(diǎn)建立94.3.4 各個(gè)功能頁面的詳細(xì)設(shè)計(jì)104.4 關(guān)鍵技術(shù)分析10第五章 設(shè)計(jì)效果展示與改進(jìn)意見125.1 設(shè)計(jì)效果展示125.1.1 同學(xué)錄首頁頁面(index.php)125.1.2 留言操作頁面(admin.php)125.1.3 添加留言頁面(index.php)135.1.4 管理登錄頁面(login.php)135.1.5 刪除留言頁面(de

6、l.php)145.1.6 登錄失敗頁面(login.php)15致謝18參考文獻(xiàn)19第一章 前言計(jì)算機(jī)是20世紀(jì)最偉大的科學(xué)技術(shù)發(fā)明之一，對(duì)人類的生產(chǎn)活動(dòng)和社會(huì)活動(dòng)產(chǎn)生了極其重要的影響，并以強(qiáng)大的生命力飛速發(fā)展。它的應(yīng)用領(lǐng)域從最初的軍事科研應(yīng)用擴(kuò)展到目前社會(huì)的各個(gè)領(lǐng)域，已形成規(guī)模巨大的計(jì)算機(jī)產(chǎn)業(yè)，帶動(dòng)了全球范圍的技術(shù)進(jìn)步，由此引發(fā)了深刻的社會(huì)變革。計(jì)算機(jī)已遍及學(xué)校、企事業(yè)單位，進(jìn)入尋常百姓家，成為信息社會(huì)中必不可少的工具。它是人類進(jìn)入信息時(shí)代的重要標(biāo)志。隨著計(jì)算機(jī)技術(shù)的飛速發(fā)展Internet也在迅速的成長，互聯(lián)網(wǎng)很快成為了人們快速獲取、發(fā)布和傳遞信息的重要渠道，它在人們政治、經(jīng)濟(jì)、生活等各

7、個(gè)方面發(fā)揮著重要的作用。Internet上發(fā)布信息主要是通過網(wǎng)站來實(shí)現(xiàn)的，獲取信息也是要在Internet“海洋”中按照一定的檢索方式將所需要的信息從網(wǎng)站上下載下來。網(wǎng)站已成為機(jī)關(guān)、學(xué)校、企事業(yè)單位、甚至尋常百姓家的信息化建設(shè)的重要組成部分。由此可見，網(wǎng)站的投資建設(shè)也越來越突顯其重要性了。目前，網(wǎng)站開發(fā)所用的技術(shù)有ASP、JSP、PHP，在Internet上幾乎處處都能看到它們的身影。本網(wǎng)站用的是PHP技術(shù)，因?yàn)樗恍枰M(jìn)行復(fù)雜的編程，就可以開發(fā)出專業(yè)的動(dòng)態(tài)Web網(wǎng)站。PHP 獨(dú)特的語法混合了 C、Java、Perl 以及 PHP 自創(chuàng)新的語法。它可以比 CGI或者Perl更快速的執(zhí)行動(dòng)態(tài)網(wǎng)頁

8、。用PHP做出的動(dòng)態(tài)頁面與其他的編程語言相比，PHP是將程序嵌入到HTML文檔中去執(zhí)行，執(zhí)行效率比完全生成HTML標(biāo)記的CGI要高許多；PHP還可以執(zhí)行編譯后代碼，編譯可以達(dá)到加密和優(yōu)化代碼運(yùn)行，使代碼運(yùn)行更快。PHP具有非常強(qiáng)大的功能，所有的CGI的功能PHP都能實(shí)現(xiàn)，而且支持幾乎所有流行的數(shù)據(jù)庫以及操作系統(tǒng)。最重要的是PHP可以用C、C+進(jìn)行程序的擴(kuò)展！在本文中，將用到PHP、DreamweaverCS5和MySQL等知識(shí)，建設(shè)班級(jí)同學(xué)錄網(wǎng)站。在網(wǎng)站中實(shí)現(xiàn)用戶注冊(cè)、登錄網(wǎng)站和查看、添加留言的效果，管理員則能實(shí)現(xiàn)登錄、和刪除留言的效果。所以，在此論文中本人將會(huì)對(duì)所做的網(wǎng)站進(jìn)行簡單的分析與介紹

9、。第二章 課題來源及需求分析每一個(gè)課題的開發(fā)都是適應(yīng)社會(huì)的發(fā)展需求而產(chǎn)生的，都有其開發(fā)的來源及目的，也只有適應(yīng)社會(huì)的需求開發(fā)才有意義，也才可能有更好的發(fā)展。所以在進(jìn)行規(guī)劃一個(gè)網(wǎng)站之前要先對(duì)其進(jìn)行可行性分析。這一章就是對(duì)我所做的課題進(jìn)行簡單的可行性分析。2.1 課題來源長期以來學(xué)生都是靠紙介質(zhì)的畢業(yè)紀(jì)念冊(cè)來記錄同窗畢業(yè)時(shí)留下的美好回憶和真摯情誼，盡管現(xiàn)在的畢業(yè)紀(jì)念冊(cè)做得十分華美，但是伴隨網(wǎng)絡(luò)信息時(shí)代中數(shù)字化生產(chǎn)生活應(yīng)用的快速發(fā)展，傳統(tǒng)畢業(yè)紀(jì)念冊(cè)內(nèi)容靜止、制作費(fèi)時(shí)費(fèi)力的缺點(diǎn)愈加突出，與互聯(lián)網(wǎng)時(shí)代很不相稱，時(shí)代呼喚傳統(tǒng)畢業(yè)紀(jì)念冊(cè)必須以嶄新的多媒體畢業(yè)紀(jì)念冊(cè)形式來滿足豐富的信息動(dòng)態(tài)化的服務(wù)要求。此外，

10、隨著Internet的發(fā)展，網(wǎng)站的作用越來越重要，被稱之為繼廣播、報(bào)紙、雜志、電視后的第五種媒體數(shù)字媒體，擁有眾多優(yōu)勢(shì)，所以現(xiàn)在不少企業(yè)都有或正在建設(shè)自己的網(wǎng)站。而且與畢業(yè)紀(jì)念冊(cè)類似的同學(xué)錄在網(wǎng)絡(luò)中應(yīng)用廣泛，現(xiàn)在比較有名的門戶網(wǎng)站都提供了同學(xué)錄功能。 而留言本作為網(wǎng)站重要的一個(gè)部分，從來就是一個(gè)大家交流的平臺(tái)！借助留言板，瀏覽者可以通過添加留言的方式給版主或其他瀏覽者進(jìn)行留言和提問。利用網(wǎng)絡(luò)留言本可以極大的增進(jìn)教師和學(xué)生、學(xué)生和學(xué)生之間的交互性，打破了教師和學(xué)生、學(xué)生和學(xué)生之間相對(duì)孤立狀態(tài)。而且網(wǎng)絡(luò)留言本能使畢業(yè)紀(jì)念冊(cè)更加豐富多彩，它不僅是新老同學(xué)聯(lián)系的橋梁，而且還是網(wǎng)絡(luò)休閑和網(wǎng)上展示自我的好

11、方式。2.2 需求分析需求分析是軟件定義時(shí)期的最后一個(gè)階段，它的基本任務(wù)是確定網(wǎng)站必須完成哪些工作，也就是對(duì)目標(biāo)系統(tǒng)提出完整、準(zhǔn)確、清晰、具體的要求。需求分析的結(jié)果是網(wǎng)站開發(fā)的基礎(chǔ)。需求分析的結(jié)果是網(wǎng)站開發(fā)的基礎(chǔ)，一次成功的需求分析，不僅需要項(xiàng)目負(fù)責(zé)人甚至是客戶等所有與項(xiàng)目相關(guān)人員的共同努力，而且還和公司的能力范圍有一定關(guān)系。需要說明的是，這里所說的需求分析活動(dòng)內(nèi)容是建立在較為理想的基礎(chǔ)上的，由于各個(gè)公司現(xiàn)實(shí)情況的不同，用戶可以根據(jù)自身情況借鑒試用。如果用戶能夠根據(jù)本公司的情況系統(tǒng)地規(guī)范此類文檔的保存和收集工作，相信對(duì)公司以后其他網(wǎng)站項(xiàng)目的開發(fā)以及公司自身實(shí)力的增強(qiáng)都會(huì)有很大的幫助。不管是簡單

12、的個(gè)人主頁，還是復(fù)雜的大型網(wǎng)站，對(duì)網(wǎng)站的需求分析與規(guī)劃都要放到第一步，因?yàn)樗苯雨P(guān)系到網(wǎng)站的功能是否完善、是否能達(dá)到預(yù)期目標(biāo)等。網(wǎng)站需求分析與規(guī)劃包含的內(nèi)容很多，如確定網(wǎng)站的建設(shè)目標(biāo)、確定目標(biāo)用戶、確定網(wǎng)站欄目結(jié)構(gòu)、確定網(wǎng)站目錄結(jié)構(gòu)和收集資料等。動(dòng)態(tài)網(wǎng)站具有很好的管理數(shù)據(jù)資料的好處，一方面，在前臺(tái)(即在網(wǎng)頁上)訪問者可以利用查詢功能很快地找到自己想要的資料；另一方面，在后臺(tái)(任何一臺(tái)連上互聯(lián)網(wǎng)的計(jì)算機(jī))，網(wǎng)站管理者通過量身定做的后臺(tái)管理系統(tǒng)很方便地管理網(wǎng)站，而且后臺(tái)管理系統(tǒng)界面很直觀，也很容易學(xué)會(huì)使用。第三章 總體設(shè)計(jì)方案一個(gè)網(wǎng)站的成功與否與建站前的網(wǎng)站規(guī)劃有著極為重要的關(guān)系。在建立網(wǎng)站前應(yīng)明

13、確建設(shè)網(wǎng)站的目的，建立網(wǎng)站之前，要有明確的目的，要明白建立網(wǎng)站的用意是什么，接受對(duì)象是哪些群體，要為訪問者提供怎樣的服務(wù)，然后對(duì)整個(gè)網(wǎng)站進(jìn)行策劃。只有詳細(xì)的規(guī)劃，才能避免在網(wǎng)站建設(shè)中出現(xiàn)的很多問題，使網(wǎng)站建設(shè)能順利進(jìn)行。網(wǎng)站規(guī)劃是指在網(wǎng)站建設(shè)前對(duì)市場進(jìn)行分析、確定網(wǎng)站的目的和功能，并根據(jù)需要對(duì)網(wǎng)站建設(shè)中的技術(shù)、內(nèi)容、費(fèi)用、測(cè)試、維護(hù)等做出規(guī)劃。網(wǎng)站規(guī)劃對(duì)網(wǎng)站建設(shè)起到計(jì)劃和指導(dǎo)的作用，對(duì)網(wǎng)站的內(nèi)容和維護(hù)起到定位作用。3.1 網(wǎng)站規(guī)范3.1.1 命名規(guī)范命名的原則：以最少的字母達(dá)到最容易理解的意義。一般文件及目錄命名規(guī)范：每一個(gè)目錄中應(yīng)該包含一個(gè)缺省的php 文件，文件名統(tǒng)一用index.php，

14、文件名稱統(tǒng)一用小寫的英文字母、數(shù)字和下劃線的組合，盡量按單詞的英語翻譯為名稱。例如：feedback(信息反饋)，aboutus(關(guān)于我們)。圖片的命名規(guī)范：名稱分為頭尾兩兩部分，用下劃線隔開。 頭部分表示此圖片的大類性質(zhì)。例如：放置在頁面頂部的廣告、裝飾圖案等長方形的圖片我們?nèi)∶篵anner；標(biāo)志性的圖片我們?nèi)∶麨椋簂ogo；在頁面上位置不固定并且?guī)в墟溄拥男D片我們?nèi)∶麨閎utton；在頁面上某一個(gè)位置連續(xù)出現(xiàn)，性質(zhì)相同的鏈接欄目的圖片我們?nèi)∶簃enu；裝飾用的照片我們?nèi)∶簆ic；不帶鏈接表示標(biāo)題的圖片我們?nèi)∶簍itle依照此原則類推。 尾部分用來表示圖片的具體含義，用英文字母表示

15、。例如：db.jpg，logo.jpg，news-title-bg.gif，why.jpg，title_news.gif，。有news效果的圖片，兩張分別在原有文件名后加_bg和_title命名。3.1.2 目錄結(jié)構(gòu)規(guī)范目錄建立的原則：以最少的層次提供最清晰簡便的訪問結(jié)構(gòu)。目錄的命名以小寫英文字母，下劃線組成。根目錄一般只存放index.htm以及其他必須的系統(tǒng)文件每個(gè)主要欄目開設(shè)一個(gè)相應(yīng)的獨(dú)立目錄。根目錄下的images用于存放各頁面都要使用的公用圖片，子目錄下的images目錄存放本欄目頁面使用的私有圖片，所有JS,ASP,PHP等腳本存放在根目錄下的scripts目錄，所有CGI程序存放

16、在根目錄下的cgi-bin目錄，所有CSS文件存放在根目錄下style目錄，每個(gè)語言版本存放于獨(dú)立的目錄。例如：簡體中文gb，所有flash，avi，ram，quicktime等多媒體文件存放在根目錄下的media目錄。3.1.3 尺寸規(guī)范尺寸規(guī)范請(qǐng)根據(jù)您的實(shí)際情況調(diào)整：頁面標(biāo)準(zhǔn)按800*600分辨率制作，推薦尺寸為766*430px，頁面長度原則上不超過3屏，寬度不超過1屏，每個(gè)標(biāo)準(zhǔn)頁面為A4幅面大小，即8.5X11英寸。 全尺寸banner為468*60px，半尺寸banner為234*60px，小banner為88*31px，另外120*90，120*60也是小圖標(biāo)的標(biāo)準(zhǔn)尺寸。每個(gè)非首頁

17、靜態(tài)頁面含圖片字節(jié)不超過60K，全尺寸banner不超過14K。3.1.4 形象設(shè)計(jì)規(guī)范網(wǎng)站的CI整體形象包括下面幾個(gè)要素：1、標(biāo)志(logo)。網(wǎng)站必須有獨(dú)立的標(biāo)志，標(biāo)志可以以網(wǎng)站中英文名稱設(shè)計(jì)，也可以采用特別的圖案。原則是簡單易記。標(biāo)志必須可以用黑白和彩色分別清晰表現(xiàn)，標(biāo)志圖片的名稱為logo_域名.gif，例如：logo_sina.gif，盡量提供標(biāo)志的矢量圖片，請(qǐng)盡可能在每個(gè)頁面上都使用標(biāo)志。2、標(biāo)準(zhǔn)色。網(wǎng)站應(yīng)該有自己的標(biāo)準(zhǔn)色（主體色），準(zhǔn)色原則上不超過兩種，如果有兩種，其中一種為標(biāo)準(zhǔn)色，另一種為標(biāo)準(zhǔn)輔助色，標(biāo)準(zhǔn)色應(yīng)盡量采用216種web安全色之內(nèi)的色彩，必須提供標(biāo)準(zhǔn)色確切的RGB和C

18、YMK數(shù)值，請(qǐng)盡可能使用標(biāo)準(zhǔn)色。3、標(biāo)準(zhǔn)字體。網(wǎng)站應(yīng)該定義一種標(biāo)準(zhǔn)字體（指logo上，圖片上使用的字體），標(biāo)準(zhǔn)字體原則上定義兩種，一種中文字體，一種英文字體 （不包括文本內(nèi)容字體）必須提供標(biāo)準(zhǔn)字體的名稱和字庫請(qǐng)盡可能使用標(biāo)準(zhǔn)字體。3.1.5 數(shù)據(jù)庫使用規(guī)范服務(wù)器上有關(guān)數(shù)據(jù)庫的一切操作只能由服務(wù)器管理人員進(jìn)行。程序中訪問數(shù)據(jù)庫時(shí)使用統(tǒng)一的用戶、統(tǒng)一的連接文件訪問數(shù)據(jù)庫。原則上每一個(gè)欄目只能建一個(gè)庫，庫名與各欄目的英文名稱相一致，庫中再包含若干表。比較大的、重點(diǎn)的欄目可以考慮單獨(dú)建庫，庫名與欄目的英文名稱相一致。數(shù)據(jù)庫、表、字段、索引、視圖等一系列與數(shù)據(jù)庫相關(guān)的名稱必須全部使用與內(nèi)容相關(guān)的英文單詞

19、命名，對(duì)于一個(gè)單詞難以表達(dá)的，可以考慮用多個(gè)單詞加下劃線（_）連接（不能超過四個(gè)單詞）命名。不再使用的數(shù)據(jù)庫、表應(yīng)刪除，在刪除之前必須備份（包括結(jié)構(gòu)和內(nèi)容）。3.2 網(wǎng)站流程圖本同學(xué)錄的網(wǎng)站流程圖如圖3-1所示。管理員會(huì)員用戶查看留言添加留言查看留言查看留言圖 1插入記錄圖 2檢查表單設(shè)置圖 3首頁頁面展示圖 4留言操作頁面展示圖 5檢查表單設(shè)置圖 圖 6添加留言頁面圖 7版主管理登錄頁面圖 8編輯留言頁面圖 9登錄出錯(cuò)頁面 10編輯留言頁面圖 11插入記錄圖 11編輯留言頁面記錄圖 13檢查表單設(shè)置圖 14首頁頁面展示圖 15留言操作頁面展示刪除留言圖圖 16 刪除留言頁面展示圖 17回復(fù)留

20、言頁面展示IC 11編輯留言頁面留言板其他用戶3.3 素材收集及加工明確了網(wǎng)站的主題后，就要圍繞主題開始搜集材料了。但是所收集到的素材并不一定就可以馬上運(yùn)用到實(shí)際中了，有些素材還需要利用軟件進(jìn)行加工處理。明確了網(wǎng)站的主題以后，就要圍繞主題開始搜集材料了。常言道：“巧婦難為無米之炊”。要想讓自己的網(wǎng)站有血有肉，能夠吸引用戶，就要盡量搜集材料，搜集材料越多，以后制作網(wǎng)站就越容易。資源可以是圖像、文本或媒體。在開始開發(fā)站點(diǎn)前，要確保收集了說有這些項(xiàng)目并做好了準(zhǔn)備。否則，將不得不為找到一幅圖像或創(chuàng)建一個(gè)按鈕而經(jīng)常中斷開發(fā)過程。如果自己創(chuàng)建資源，在開始開發(fā)之前要確保創(chuàng)建所用這些資源，如果使用鼠標(biāo)經(jīng)過圖像

21、技術(shù)，那么其中還包括所需要的圖像。然后組織資源，以便可以在使用Dreamweaver創(chuàng)建站點(diǎn)時(shí)方便的訪問它們。Dreamweaver可以更容易地通過使用庫，在各種文檔種重用頁面布局和頁面元素。但是，用模板和庫來創(chuàng)建新頁面比將模板和庫來應(yīng)用于現(xiàn)有文檔更容易。如果許多頁面將使用同樣的布局，則可以使用模板。為該布局規(guī)劃和設(shè)計(jì)一個(gè)模板，然后就可以基于此模板創(chuàng)建新的頁面。如果決定更改所用頁面的布局，僅需要該模板即可。3.3.1 素材收集1、文本內(nèi)容素材的收集具體的文本內(nèi)容，可以讓訪問者明白設(shè)計(jì)者在Web頁中想要說明的東西，我們可以從網(wǎng)絡(luò)、書本上找到需要的文字材料，也可以自己編寫有關(guān)的文字材料，將這些素材

22、制作成Word文檔保存在“文字資料”子目錄下。收集的文本素材既豐富，又要便于組織，這樣才能做出內(nèi)容豐富、整體感強(qiáng)的網(wǎng)站。2、藝術(shù)內(nèi)容素材的收集只有文本內(nèi)容的網(wǎng)站對(duì)于訪問者來說，是枯燥乏味、缺乏生機(jī)的。如果加上藝術(shù)內(nèi)容素材，如靜態(tài)圖片、動(dòng)態(tài)圖像、音像等，將使網(wǎng)頁充滿動(dòng)感與生機(jī)，也將吸引更多的訪問者。而這些素材主要是從Internet上獲得，還有則是利用自己制作的一些圖片。3.3.2 素材加工當(dāng)搜集素材完后，接下來的工作就是要對(duì)素材進(jìn)行整理與加工。我們要把素材修改一下因?yàn)槲覀兊乃夭脑谧髌分幸w現(xiàn)作品的思想信息和我們創(chuàng)作的感情，只有經(jīng)過我們加工處理過的素材才能夠很好的傳達(dá)出這種感情來。 對(duì)于圖形素材

23、的加工，主要使用的工具是畫圖工具PhotoshopCS4。從圖片的大小上來看，我們要把圖片統(tǒng)一為一個(gè)大小，統(tǒng)一成為我們作品規(guī)定的大小尺寸；從色彩上看，我們所搜集的素材色彩就不統(tǒng)一，所以要通過對(duì)色調(diào)、飽和度、色彩平衡等方面使圖片在色調(diào)上保持統(tǒng)一；從圖片的外觀上看，我們可以對(duì)圖片素材進(jìn)行剪切、組合等的變化，還可以利用特效的修飾來使圖片更能夠適合需要。第四章 詳細(xì)設(shè)計(jì)我們前一章介紹的是網(wǎng)站的總體設(shè)計(jì)方案，總體設(shè)計(jì)方案是對(duì)一個(gè)網(wǎng)站進(jìn)行前期的方案和虛擬的構(gòu)思，以及對(duì)所需要的素材進(jìn)行整理。而這一章的詳細(xì)設(shè)計(jì)部分是對(duì)設(shè)計(jì)規(guī)劃的具體實(shí)施化，這里將根據(jù)總體設(shè)計(jì)規(guī)劃中提供的定位和準(zhǔn)備的材料來構(gòu)建這個(gè)網(wǎng)站。4.1

24、所需要的軟、硬件環(huán)境4.1.1 硬件環(huán)境處理器：Inter(R) Pentium(R) CPU P61002.00GHz或者更高內(nèi)存容量：256MB或更高硬盤容量：10GB或更高顯示卡：NVIDIA GeForce310M顯示適配器或更高光驅(qū)：CD-ROM 48X或更高4.1.2 軟件環(huán)境操 作 系 統(tǒng)：Windows Xp 系統(tǒng)數(shù) 據(jù) 庫軟件：Mysql數(shù)據(jù)庫網(wǎng)頁設(shè)計(jì)軟件：Dreamweaver cs5圖像設(shè)計(jì)軟件：PhotoshopCS44.2 開發(fā)工具的選用及介紹4.2.1 頁面設(shè)計(jì)工具 本人使用的頁面設(shè)計(jì)工具是Dreamweaver CS5。Dreamweaver是Macromedia

25、公司推出的一款專業(yè)網(wǎng)頁開發(fā)軟件，提供了高度可視化的集成編輯環(huán)境，強(qiáng)大的網(wǎng)頁編輯功能和站點(diǎn)維護(hù)功能，具有強(qiáng)大便捷的數(shù)據(jù)庫作支持，多種動(dòng)態(tài)網(wǎng)頁技術(shù)的支持，強(qiáng)大的操作功能和便捷直觀的操作界面。Dreamweaver是唯一提供Roundtrip HTML、視覺化編輯與原始碼編輯同步的設(shè)計(jì)工具。它包含HomeSite和BBEdit等主流文字編輯器。幀(frames)和表格的制作速度快的令您無法想像。進(jìn)階表格編輯功能使您簡單的選擇單格、行、欄或作未連續(xù)之選取。甚至可以排序或格式化表格群組，Dreamweaver 支援精準(zhǔn)定位，利用可輕易轉(zhuǎn)換成表格的圖層以拖拉置放的方式進(jìn)行版面配置。所見即所得 Dreamw

26、eaver成功整合動(dòng)態(tài)式出版視覺編輯及電子商務(wù)功能，提供超強(qiáng)的支援能力給Third-party廠商，包含ASP，Apache，BroadVision，Cold Fusion，iCAT， Tango與自行發(fā)展的應(yīng)用軟體。當(dāng)您正使用Dreamweaver在設(shè)計(jì)動(dòng)態(tài)網(wǎng)頁時(shí)，所見即所得的功能，讓您不需要透過瀏覽器就能預(yù)覽網(wǎng)頁。夢(mèng)幻樣版和XML Dreamweaver將內(nèi)容與設(shè)計(jì)分開，應(yīng)用于快速網(wǎng)頁更新和團(tuán)隊(duì)合作網(wǎng)頁編輯。建立網(wǎng)頁外觀的樣版，指定可編輯或不可編輯的部份，內(nèi)容提供者可直接編輯以樣式為主的內(nèi)容卻不會(huì)不小心改變既定之樣式。您也可以使用樣版正確地輸入或輸出XML內(nèi)容。 全方位的呈現(xiàn)利用Dream

27、weaver設(shè)計(jì)的網(wǎng)頁，可以全方位的呈現(xiàn)在任何平臺(tái)的熱門瀏覽器上。對(duì)于cascading style sheets的動(dòng)態(tài)HTML支援和鼠標(biāo)換圖效果，聲音和動(dòng)畫的DHTML效果資料庫可在Netscape和Microsoft瀏覽器上執(zhí)行。使用不同瀏覽器檢示功能，Dreamweaver可以告知您在不同瀏覽器上執(zhí)行的成效如何。當(dāng)有新的瀏覽器上市時(shí)，只要從Dreamweaver的網(wǎng)站在下載它的描述檔，便可得知詳盡的成效報(bào)告。它是一款專業(yè)的HTML編輯器，用于設(shè)計(jì)，編碼，開發(fā)網(wǎng)站、網(wǎng)頁和WEB應(yīng)用程序。Dreamweaver提供了很多實(shí)用工具，利用這些工具，我們可以更加方便、快速地制作網(wǎng)頁。它可以與其他M

28、acromedia產(chǎn)品配合使用，為用戶提供全面的網(wǎng)頁制作功能。4.2.2 圖象制作編輯工具 本人使用的圖像制作工具是PhotoshopCS4。Photoshop是Adobe公司旗下最為出名的圖像處理軟件之一，集圖像掃描、編輯修改、圖像制作、廣告創(chuàng)意，圖像輸入與輸出于一體的圖形圖像處理軟件，深受廣大平面設(shè)計(jì)人員和電腦美術(shù)愛好者的喜愛。Photoshop是世界頂尖級(jí)的圖像設(shè)計(jì)與制作工具軟件。圖像處理是對(duì)已有的位圖圖像進(jìn)行編輯加工處理以及運(yùn)用一些特殊效果，其重點(diǎn)在于對(duì)圖像的處理加工。在表現(xiàn)圖像中的陰影和色彩的細(xì)微變化方面或者進(jìn)行一些特殊效果處理時(shí)，使用位圖形式是最佳的選擇，它在這方面的優(yōu)點(diǎn)是矢量圖都

29、無法比擬的。 Photoshop是目前公認(rèn)的最好的通用平面美術(shù)設(shè)計(jì)軟件，它的功能完善，性能穩(wěn)定，使用方便，所以在幾乎所有的廣告、出版、軟件公司，Photoshop都是首選的平面工具。Photoshop支持幾乎所有的圖像格式和色彩模式，能夠同時(shí)進(jìn)行多圖層的處理；它的繪畫功能和選擇功能讓編輯圖像變得十分方便；它的圖層樣式功能和濾鏡功能給圖像帶來無窮無盡的奇特效果。是專門用來進(jìn)行圖像處理的軟件。通過它可以對(duì)圖像修飾、對(duì)圖形進(jìn)行編輯，以及對(duì)圖像的色彩處理，另外，還有繪圖和輸出功能等。4.2.3 MySQL數(shù)據(jù)庫MySQL是一個(gè)小型關(guān)系型數(shù)據(jù)庫管理系統(tǒng)，開發(fā)者為瑞典MySQL AB公司。在2008年1月

30、16號(hào)被Sun公司收購。而2009年，SUN又被Oracle收購。MySQL是一種關(guān)聯(lián)數(shù)據(jù)庫管理系統(tǒng)，關(guān)聯(lián)數(shù)據(jù)庫將數(shù)據(jù)保存在不同的表中，而不是將所有數(shù)據(jù)放在一個(gè)大倉庫內(nèi)。這樣就增加了速度并提高了靈活性。MySQL的SQL中文名稱是“結(jié)構(gòu)化查詢語言”。SQL是用于訪問數(shù)據(jù)庫的最常用標(biāo)準(zhǔn)化語言。MySQL軟件采用了GPL（GNU通用公共許可證）。由于其體積小、速度快、總體擁有成本低，尤其是開放源碼這一特點(diǎn)，許多中小型網(wǎng)站為了降低網(wǎng)站總體擁有成本而選擇了MySQL作為網(wǎng)站數(shù)據(jù)庫。與其他的大型數(shù)據(jù)庫例如Oracle、DB2、SQL Server等相比，MySQL自有它的不足之處，如規(guī)模小、功能有限（M

31、ySQL Cluster的功能和效率都相對(duì)比較差）等，但是這絲毫也沒有減少它受歡迎的程度。對(duì)于一般的個(gè)人使用者和中小型企業(yè)來說，MySQL提供的功能已經(jīng)綽綽有余，而且由于MySQL是開放源碼軟件，因此可以大大降低總體擁有成本。 目前Internet上流行的網(wǎng)站構(gòu)架方式有兩種，一種是LAMPLinux+Apache+ MySQL+PHP/Perl/Python，而另一種是LNMPLinux+ Nginx+MySQL+php。即使用Linux作為操作系統(tǒng)，Apache和Nginx作為Web服務(wù)器，MySQL作為數(shù)據(jù)庫，PHP/Perl/Python作為服務(wù)器端腳本解釋器。由于這四個(gè)軟件都是免費(fèi)或開

32、放源碼軟件（FLOSS)，因此使用這種方式不用花一分錢（除開人工成本）就可以建立起一個(gè)穩(wěn)定、免費(fèi)的網(wǎng)站系統(tǒng)。4.3.2 數(shù)據(jù)庫設(shè)計(jì)數(shù)據(jù)庫在一個(gè)信息系統(tǒng)中占有十分重要的地位，數(shù)據(jù)庫結(jié)構(gòu)設(shè)計(jì)的好壞直接對(duì)應(yīng)用系統(tǒng)的效率以及實(shí)現(xiàn)的效果產(chǎn)生影響。合理的數(shù)據(jù)庫結(jié)構(gòu)設(shè)計(jì)可以提高數(shù)據(jù)存儲(chǔ)的效率，保證數(shù)據(jù)庫的完整性和一致性，同時(shí)合理的數(shù)據(jù)庫結(jié)構(gòu)設(shè)計(jì)也有利于和程序的實(shí)現(xiàn)。這一設(shè)計(jì)階段是在需求分析的基礎(chǔ)上，設(shè)計(jì)出能夠滿足用戶需要的各種實(shí)體以及它們的關(guān)系。采用的數(shù)據(jù)庫是MicrosoftAccess建立data.mdb庫文件。一個(gè)功能齊全的網(wǎng)站應(yīng)該有幾個(gè)表，如留言表（ly）、管理員表（yh）、用戶表（member）。

33、每個(gè)表下面還要建立字段，比如說留言表有留言用戶(n_name)、留言主題 (n_subject)、留言內(nèi)容(n_content)、留言表情(n_smlie)、留言時(shí)間(n_date)等訪客的相關(guān)信息是需要保存的內(nèi)容。為了優(yōu)化數(shù)據(jù)庫，有些字段需要做些設(shè)置。詳細(xì)見以下表所示。留言記錄表note表，如表4-1所示：表4-1數(shù)據(jù)庫ly表的設(shè)計(jì)字段名稱數(shù)據(jù)類型基本描述id自動(dòng)編號(hào)確定數(shù)據(jù)唯一性以保證在管理時(shí)能準(zhǔn)確定位到相應(yīng)記錄Nc文本留言者姓名Bt文本留言主題Nr文本留言者所留內(nèi)容Sj文本留言時(shí)間管理員信息表admin表，如表4-2所示：表4-2數(shù)據(jù)庫 yh表的設(shè)計(jì)字段名稱數(shù)據(jù)類型基本描述id自動(dòng)編號(hào)確

34、定數(shù)據(jù)唯一性以保證在管理時(shí)能準(zhǔn)確定位到相應(yīng)記錄name文本管理員的用戶名passwd文本管理員登錄時(shí)所需的密碼管理員信息表admin表，如表4-3所示：表4-3數(shù)據(jù)庫 yh表的設(shè)計(jì)字段名稱數(shù)據(jù)類型基本描述id自動(dòng)編號(hào)確定數(shù)據(jù)唯一性以保證在管理時(shí)能準(zhǔn)確定位到相應(yīng)記錄Zc_yh文本會(huì)員的用戶名Zc_mm文本會(huì)員登錄時(shí)所需的密碼Zc_yx文本會(huì)員的郵箱地址Zc_dz文本會(huì)員詳細(xì)地址Zc_dh文本會(huì)員電話號(hào)碼并輸入相關(guān)記錄。數(shù)據(jù)庫設(shè)計(jì)好了以后，可以直接在數(shù)據(jù)庫里添加兩條記錄，以后測(cè)試時(shí)候用。4.3.3 Dreamweaver站點(diǎn)建立打開Dreamweaver選擇【站點(diǎn)】中的【新建站點(diǎn)】，在出現(xiàn)的“未命

35、名站點(diǎn)1”對(duì)話框中輸入站點(diǎn)名稱，根據(jù)向?qū)б徊揭徊絹矶x我們的留言板站點(diǎn)，在進(jìn)行下一步后，我們選擇“是，我想使用服務(wù)器技術(shù)”選項(xiàng)，在此處我選擇的ASPVBScript；繼續(xù)進(jìn)行下一步，選擇“在本地進(jìn)行編輯和測(cè)試”選項(xiàng)，并選擇文件存儲(chǔ)的位置；接下來是設(shè)置Dreamweaver的測(cè)試URL，點(diǎn)擊【測(cè)試URL】，測(cè)試成功后則可以選擇是否使用遠(yuǎn)程服務(wù)器，不使用遠(yuǎn)程服務(wù)器則選擇“否”選項(xiàng)；接下來則會(huì)顯示剛才所填的信息，目的是要確認(rèn)一下，如果發(fā)現(xiàn)有錯(cuò)，可以點(diǎn)擊【后退】來進(jìn)行重新設(shè)置，沒有問題的話點(diǎn)擊【完成】就可完成新站點(diǎn)的建立。站點(diǎn)建好之后便可在該站點(diǎn)下建立index.php(同學(xué)錄首頁)、zc_inser

36、t.php(會(huì)員相冊(cè)頁面)、banjiziliao.ht(管理員班級(jí)資料頁面)、banjiziliao1.html(會(huì)員班級(jí)資料頁面)、banjiziliao2.html(訪客班級(jí)資料頁面)、tccg.html(退出登錄頁面)、admin.php(管理員首頁)、index.php (管理員查看發(fā)表留言頁面)、read.php (會(huì)員查看發(fā)表留言頁面)、login.php (管理員登錄失敗頁面)、zc_login.php(會(huì)員登錄失敗頁面)、login.php(管理員登錄頁面)、del.php(管理員刪除留言頁面)、cz_login.php(會(huì)員登錄頁面)、index.php(會(huì)員首頁)、ind

37、ex.php(會(huì)員登錄成功頁面)、zc_insert.php(會(huì)員注冊(cè)頁面)、db.php(連接數(shù)據(jù)庫公共頁面)、logout.php（會(huì)員離開頁面）、search.php（搜索頁面）共12個(gè)頁面。4.3.4 各個(gè)功能頁面的詳細(xì)設(shè)計(jì)在Dreamweaver中新建幾個(gè)頁面(“PHP和HTML”類型的文檔)，分別取名index.php(同學(xué)錄首頁)、zc_insert.php(會(huì)員相冊(cè)頁面)、banjiziliao.ht(管理員班級(jí)資料頁面)、banjiziliao1.html(會(huì)員班級(jí)資料頁面)、banjiziliao2.html(訪客班級(jí)資料頁面)、tccg.html(退出登錄頁面)、admi

38、n.php(管理員首頁)、index.php (管理員查看發(fā)表留言頁面)、read.php (會(huì)員查看發(fā)表留言頁面)、login.php (管理員登錄失敗頁面)、zc_login.php(會(huì)員登錄失敗頁面)、login.php(管理員登錄頁面)、del.php(管理員刪除留言頁面)、cz_login.php(會(huì)員登錄頁面)、index.php(會(huì)員首頁)、index.php(會(huì)員登錄成功頁面)、zc_insert.php(會(huì)員注冊(cè)頁面)、db.php(連接數(shù)據(jù)庫公共頁面)、logout.php（會(huì)員離開頁面）、search.php（搜索頁面）共12個(gè)頁面。由于頁面太多且有些重復(fù)，我這里選幾個(gè)頁

39、面進(jìn)行說明。1、顯示留言主頁面(index.php)打開index.php，并修改頁面標(biāo)題為“留言板首頁”。插入一個(gè)1行6列的表格，寬度為800像素，邊框粗細(xì)為0像素，單元格邊距、單元格間距均為0。然后在此表格中插入1行1列的表格。在大表格中的各個(gè)表格設(shè)置寬度為800。把鼠標(biāo)定位在第一行，在這里插入所需要的背景圖片及自己的logo，主頁設(shè)計(jì)一下略。2、管理員登錄面(loginphp)在這里我首先把index.php給保存了模板，接下來做的頁面都是根據(jù)這模板做的，所以我就不在說明以下的網(wǎng)頁是如何做的。在【修改】中【模板】選擇【套用模板到頁】，然后在可編輯區(qū)域中把內(nèi)容刪了，在插入一個(gè)表單，在表單中

40、插入4行1列的表格，在表格中輸入所需要的內(nèi)容。接下來就是綁定數(shù)據(jù)庫了，在【窗口】中的【數(shù)據(jù)庫】處點(diǎn)擊【+】選擇【MySQL連接】。6登錄錯(cuò)誤頁面(login.php) 提示用戶登錄錯(cuò)誤，在此頁面中可輸入如下內(nèi)容：用戶名和密碼錯(cuò)誤，請(qǐng)重新登錄。并在重新登錄設(shè)置一個(gè)鏈接到登錄頁面，進(jìn)行重新登錄操作。4.4 關(guān)鍵技術(shù)分析1、不能直接訪問數(shù)據(jù)庫Web頁不能直接訪問數(shù)據(jù)庫中存儲(chǔ)的數(shù)據(jù)，而是需要與記錄集進(jìn)行交互。記錄集是從數(shù)據(jù)庫中提取的信息或記錄的子集。該信息子集是通過數(shù)據(jù)庫查詢提取出來的。Dreamweaver使用結(jié)構(gòu)查詢語言(SQL)來生成查詢。使用Dreamweaver 中的簡單【記錄集】對(duì)話框和高級(jí)【記錄集】對(duì)話框都可以定義記錄集。在簡單【記錄集】對(duì)話框中，可以輕松構(gòu)建簡單的SQL語句；在高級(jí)【記錄集】對(duì)話框中，可以編寫自己的SQL語句或使用圖形化“數(shù)據(jù)庫項(xiàng)”樹創(chuàng)建SQL語句。將數(shù)據(jù)庫用做動(dòng)態(tài)網(wǎng)頁的內(nèi)容源時(shí)，必須首先創(chuàng)建一個(gè)要在其中存儲(chǔ)檢索數(shù)據(jù)的記錄集。記錄集在存儲(chǔ)內(nèi)容的數(shù)據(jù)庫和生成頁面的應(yīng)用程序服務(wù)器之間起一種橋梁作用。2、如何能使密碼不被透露現(xiàn)在盜取密碼的方式很多，盜取密碼的技術(shù)也不計(jì)其數(shù)，因此我們要保護(hù)好自己的密碼，以免被人盜取。保護(hù)密碼的方法是把密碼設(shè)置成復(fù)雜的密碼，那是靠擁護(hù)自己去