美食網(wǎng)站的設(shè)計與開發(fā)

目錄9889摘要 15811ABSTRACT 210170第1章緒論 3186551.1網(wǎng)站的設(shè)計意義 3166291.2網(wǎng)站的設(shè)計思想 3321411.3網(wǎng)站的研究背景 4294141.4國內(nèi)外研究現(xiàn)狀及分析 41133第2章網(wǎng)站需求分析 PAGEREF_Toc11335251742.1網(wǎng)站的界面需求 570512.2網(wǎng)站的功能需求 560922.3網(wǎng)站制作目標(biāo) 623972.4網(wǎng)站可行性分析 976102072.5網(wǎng)站前期準(zhǔn)備 6164262.6網(wǎng)站前臺頁面分析 7295722.7網(wǎng)站預(yù)定數(shù)據(jù)流程分析 77609第3章網(wǎng)站設(shè)計 8264963.1網(wǎng)站結(jié)構(gòu)圖 8126503.2網(wǎng)站開場動畫設(shè)計 973233.3網(wǎng)站一級頁面設(shè)計 910653.4網(wǎng)站二級頁面設(shè)計 11HYPERLINK\l_Toc16163.5網(wǎng)站三級頁面設(shè)計 12309333.6各數(shù)據(jù)表結(jié)構(gòu) 1330803.7數(shù)據(jù)庫的連接 14207593.8數(shù)據(jù)讀取頁面功能 14HYPERLINK\l_Toc2340第4章網(wǎng)站測試 164464.1網(wǎng)站運行環(huán)境 16210894.2測試結(jié)果及分析 166930第5章總結(jié) 184960參考文獻 1927847附錄一 2011599致謝 23PAGE\*Arabic24摘要網(wǎng)站設(shè)計和開發(fā)的質(zhì)量直接影響到網(wǎng)站的展示效果和接受程度?；贔lash技術(shù)的食品網(wǎng)站建設(shè)模式源自實踐中的探索和應(yīng)用中的反思，使網(wǎng)站既能保持新穎友好的界面，又能解決Flash網(wǎng)站反應(yīng)遲滯、切換速度慢的問題。本論文的撰寫是基于食品網(wǎng)站的設(shè)計與實現(xiàn)。我們主要使用了FlashCS4、ActionScript2.0腳本編程、Photoshop、ASP.NET與SQLServer2005數(shù)據(jù)庫相結(jié)合的技術(shù)對網(wǎng)站進行整體設(shè)計和制作，并對網(wǎng)站的功能和性能做了主要測試。本設(shè)計以網(wǎng)站形式介紹具有地方特色的餐飲美食文化。為滿足廣大用戶不同的需求提供了方便快捷的服務(wù)。關(guān)鍵詞：美食網(wǎng)站；FlashCS4；在線論壇；用戶需求

ABSTRACTQualitywebdesignanddevelopmentdirectlyaffectthesitedisplayeffectandacceptability.FoodwebconstructionmodeofFlashtechnologyfromreflectiononexplorationandpracticebasedonthesite,whichcanmaintaintheoriginalfriendlyinterface,andcansolvetheFlashsiteresponselag,theproblemofslowswitchingspeed.Thispaperisthedesignandimplementationoffoodwebbasedon.TheoveralldesignandproductionwemainlyusetheFlashCS4,ActionScript2.0scripting,Photoshop,ASP.NETandSQLServer2005databasetechnologycombiningthewebsite,andthewebsitefunctionandperformanceofthemaintest.ThisdesigntoformtheFoodsitecateringculturewithlocalcharacteristics.Toprovideconvenientservicestomeetthedifferentneedsofcustomers.Keywords:Foodwebsite;FlashCS4;onlineforum;usersdemand第1章緒論隨著人們生活水平的提高，人們越來越關(guān)注自己的飲食狀況,所以美食文化也就受到人們的更多的注意，因此我們制作了一個相關(guān)的食品網(wǎng)站。用戶在網(wǎng)站瀏覽美食信息的同時，除了可以瀏覽到相關(guān)美食的文字信息還可以看到誘人的美食圖片，為用戶提供全面的參考信息，其次本網(wǎng)站還實現(xiàn)了在線交流的功能，讓用戶更快地得到了所需的美食信息。1.1網(wǎng)站的設(shè)計意義相比較傳統(tǒng)的傳播媒體，基于FLASH的網(wǎng)站有著自身獨特的優(yōu)勢，首先網(wǎng)站不僅可以像傳統(tǒng)媒體一樣傳播文字和圖像信息，更能夠傳播動態(tài)圖形甚至視頻，聲音等信息[1]。其次，瀏覽者在瀏覽的過程中，相比較傳統(tǒng)媒體單一的瀏覽順序，網(wǎng)站則為用戶提供了很大的自主性，最后，瀏覽者在介紹信息的過程中，可以運用操作工具參與或創(chuàng)造信息的介紹活動，這種交互的優(yōu)勢也是傳統(tǒng)媒體不可能比擬的[2]。隨著計算機技術(shù)的不斷發(fā)展與深化，網(wǎng)站的制作越來越趨于人性化與美觀化，網(wǎng)頁設(shè)計中已經(jīng)融入越來越多的動畫制作和動態(tài)模塊。網(wǎng)站的迷人之處在于綜合使用文本、圖像、聲音、動畫和視頻等的信息與內(nèi)容，具有豐富的多媒體互動特點[3]。無可置疑，現(xiàn)如今網(wǎng)站已成為最吸引人的也最有效的信息傳遞手段和方式，在網(wǎng)絡(luò)上有著重要的地位，并發(fā)揮著及其重要的作用。1.2網(wǎng)站的設(shè)計思想本網(wǎng)站主要面對的是網(wǎng)絡(luò)上的美食愛好者，因此在進行網(wǎng)站設(shè)計時著重考慮了以下幾方面的因素：（1）充分展示本網(wǎng)站所擁有的美食資源和美食信息在網(wǎng)站內(nèi)容設(shè)計方面我們除了收錄國內(nèi)各地的眾多美食之外還特別介紹了國外的一些特色美食。（2）注重運用先進的網(wǎng)站設(shè)計技術(shù)考慮到網(wǎng)站在交互性及對網(wǎng)頁維護等方面的要求，在網(wǎng)站設(shè)計上我們放棄了靜態(tài)網(wǎng)頁設(shè)計技術(shù)，轉(zhuǎn)而采用FLASH技術(shù)進行制作動態(tài)網(wǎng)頁設(shè)計。（3）注重網(wǎng)頁的視覺效果合理的網(wǎng)站色調(diào)選擇和版面布局會讓瀏覽者產(chǎn)生美的感受，從而激發(fā)瀏覽者想要進一步瀏覽的興趣[4]。因此確定一個網(wǎng)站的主色調(diào)和版面布局很重要，因為我們的網(wǎng)站是使用FLASH制作的，所以會讓網(wǎng)站觀看起來十分簡便，效果生動活潑。1.3網(wǎng)站的研究背景本網(wǎng)站的研究目的就是通過網(wǎng)站全面宣傳，展示網(wǎng)站的布局、優(yōu)點與食品的介紹，隨時向瀏覽者發(fā)布網(wǎng)站的重要信息，使瀏覽者增加對網(wǎng)站的了解，增強瀏覽者與網(wǎng)站之間的聯(lián)系。通過計算機網(wǎng)絡(luò)讓瀏覽者及時得到網(wǎng)站最新消息及最新更換的美食信息，同時也幫助瀏覽者更快一步的了解到各地美食的信息[5]。在這里瀏覽者也可以提出對本網(wǎng)站的意見及想法，也可以在本網(wǎng)站上留下自己對美食的見解與推薦。我們設(shè)計出這個網(wǎng)站就是在展示自己的作品的同時也希望得到瀏覽者的認可，給瀏覽者留下深刻的印象。1.4國內(nèi)外研究現(xiàn)狀及分析目前，F(xiàn)LASH網(wǎng)站越來越受到國人的關(guān)注。2001年前后，F(xiàn)LASH軟件開始在中國市場風(fēng)行。這個由美國MACROMEDIA公司推出的一款多媒體動畫制作軟件，作為交互式動畫設(shè)計工具，可以將音樂、聲效和可動的畫面方便地融合在一起，以制作出高品質(zhì)的動態(tài)效果，造就了一種新的動畫形式——FLASH動畫[6]。FLASH動畫最早通過網(wǎng)絡(luò)流通，并隨著網(wǎng)絡(luò)技術(shù)的飛速發(fā)展，深入人們的日常生活。這一優(yōu)秀的矢量動畫編輯工具給我們帶來了強有力的沖擊，使我們能夠輕易地將豐富的想象力可視化。現(xiàn)如今，F(xiàn)lash已經(jīng)逐漸被國內(nèi)用戶所認識和接受，并隨之出現(xiàn)一大批忠實的追隨者[7]。在網(wǎng)絡(luò)上，對FLASH動畫貢獻最大的要數(shù)那些“閃客”們了，無數(shù)年輕人借助FLASH技術(shù)實現(xiàn)了他們的創(chuàng)意和夢想。在日本和美國，動畫和游戲這一類的技術(shù)超出國內(nèi)比較多，日本的動漫位居世界前列是眾所周知的[8]。要想在這一方面能有所作為，仍需加倍努力。在目前中國動畫市場資金短缺的環(huán)境下，F(xiàn)LASH動畫非常適合中國的國情?？傊現(xiàn)LASH動畫相對于傳統(tǒng)動畫的優(yōu)勢非常明顯。當(dāng)前，F(xiàn)LASH動畫在中國的發(fā)展取得了一定的進展，但是它的全盛時代還沒有到來。隨著網(wǎng)絡(luò)時代的到來，傳統(tǒng)媒體和非傳統(tǒng)媒體必將在相互競爭中不斷向前發(fā)展，F(xiàn)LASH動畫必將隨著自身技術(shù)和魅力展現(xiàn)出更為廣闊的前景[9]。第2章網(wǎng)站需求分析網(wǎng)站建設(shè)的需求分析是網(wǎng)站建設(shè)的第一個階段，其總的目的是根據(jù)調(diào)查分析，明確建設(shè)網(wǎng)站的目的與內(nèi)容，使網(wǎng)站建設(shè)能結(jié)合企業(yè)的實際情況，并滿足企業(yè)真實需求和用戶的需求[10]。網(wǎng)站需求分析的內(nèi)容主要包括企業(yè)需求調(diào)查、目標(biāo)客戶調(diào)查與分析、競爭對手調(diào)查與分析、市場定位分析、可行性分析、收益分析和風(fēng)險分析等[11]。2.1網(wǎng)站的界面需求由于我們制作的網(wǎng)站主題是美食類的網(wǎng)站，在界面顏色上，我們選擇以紅色和暗紅色為主色調(diào)，我們之所以選擇紅色為主色調(diào)一方面是因為紅色是生命、活力、健康、熱情、朝氣、歡樂的象征，另一方面是由于紅色容易引起人們的注意，之后配上白色的文字簡潔又醒目。在界面排版上，根據(jù)調(diào)查用戶需求的結(jié)果，我們在每個欄目頁面都會有部分圖片展示，再配以適當(dāng)?shù)奈淖终f明，能夠讓訪問者更加了解中國各地的美食和國外的一些美食以及關(guān)于飲食安全方面的常識。因為是Flash網(wǎng)站，自然要添加一些特殊的效果。比如在主頁界面上，我們會設(shè)置一些文字的變換過程。每個二級、三級欄目中的文字與圖片效果也不相同，樣式種類多，會使整個網(wǎng)站看起來很豐富。2.2網(wǎng)站的功能需求生活、工作中我們處處都需要資源，做網(wǎng)站也一樣也是需要很多的資源。這些資源既可以充實網(wǎng)站又可以提供給用戶。前提是我們需要弄清楚來訪問網(wǎng)站的用戶有什么樣的需求，以及他們所需要的資源[12]。隨著人民生活水平的提高，人們對吃有了更高的要求。我們開發(fā)這個網(wǎng)站的目的是為了能夠給人們提供更多更好吃的美食，另外也可以廣交天下美食愛好者。根據(jù)美食文化的特點，我們將網(wǎng)站分成了七個欄目進行詳細制作。1．美食菜譜：主要介紹的是川菜、粵菜、閩菜和湘菜四大菜系中的美食，讓用戶對這四大菜系的美食有更深刻的了解和認識。2．美食專題：主要介紹關(guān)于家常菜譜、美容瘦身和老人養(yǎng)生這三個方面的美食。3．美食廚房：主要介紹一些關(guān)于美容方面的菜譜、自己制作的美食DIY以及民間各地的風(fēng)味小吃。4．美食原料：主要介紹一些制作美食的原料，例如肉禽類、蔬菜類以及米面豆類。5．西餐導(dǎo)航：主要介紹一些富含國外特色的美食，例如韓國料理、法國料理以及意大利餐。6．飲食資訊：主要是介紹關(guān)于飲食安全方面的常識，例如飲食誤區(qū)、飲食養(yǎng)性及營養(yǎng)飲食。7．食家雜談：主要是為廣大美食愛好者提供一個交流和探討的平臺，方便各地美食文化的傳播，給人們提供更多美食信息。2.3網(wǎng)站制作目標(biāo)本網(wǎng)站的主要任務(wù)是制作一個美食類的網(wǎng)站，并實現(xiàn)在線交流的功能。訪問這個網(wǎng)站的可以是網(wǎng)絡(luò)上的任何人，所以我們制作的這個網(wǎng)站的目的是向所有美食的愛好者介紹中國各地的美食以及國外的一些特色美食。我們對所制作的網(wǎng)站分了七個方面進行介紹，它們分別是：美食菜譜、美食專題、美食廚房、美食原料、西餐導(dǎo)航、飲食資訊以及食家雜談，在七個大方面下各自又有各自的子欄目。前臺，是對美食的各個方面的詳細介紹。后臺是實現(xiàn)在線交流發(fā)帖的功能，網(wǎng)站還設(shè)置了管理員權(quán)限，管理員可以在管理界面內(nèi)對用戶所發(fā)的帖子進行回復(fù)、修改、刪除等操作。2.4網(wǎng)站可行性分析首先，在技術(shù)方面，我們所做的網(wǎng)站主要使用了FlashCS4、PhotoShop和ASP.NET技術(shù)來實現(xiàn)的，數(shù)據(jù)庫使用的是SQLServer2005。這些軟件市場上銷售價格較低，網(wǎng)絡(luò)上也有下載版本，在網(wǎng)站開發(fā)中已經(jīng)被大量使用，比較成熟，技術(shù)上是可行的。其次，在適用性方面，我們是針對美食建立的這個網(wǎng)站，針對性比較強。在制作內(nèi)容方面我們查閱了書籍和網(wǎng)站上的各種資料，對中國各地的美食有了比較深入的了解，在此基礎(chǔ)上我們才開始著手規(guī)劃網(wǎng)站。另外我們的網(wǎng)站還實現(xiàn)了在線交流發(fā)帖的功能。在管理員登陸的情況下用戶所發(fā)的帖子進行回復(fù)、修改、刪除等操作。所以，在技術(shù)上和適用性上，都是可行的。2.5網(wǎng)站前期準(zhǔn)備在開始著手的時候，我們先看了一些網(wǎng)上比較出色的FLASH網(wǎng)站，最后我們決定了構(gòu)建這個食品類的網(wǎng)站。在確立了選題后，我們做了一份網(wǎng)站策劃，詳細的對各種美食進行分類。然后根據(jù)分類收集所需要的資料，包括圖片，文字簡介等，還借鑒了其他一些關(guān)于美食網(wǎng)站的經(jīng)驗。2.6網(wǎng)站前臺頁面分析網(wǎng)站前臺分為開場動畫，首頁，二級頁面，三級頁面。在色彩上，網(wǎng)站整體以紅色為主色彩，文字方面以白色為主，以黑色和黃色為輔。在總體板式上，首頁和各二級頁面為獨立板式。三級頁面，每個欄目下的子欄目為統(tǒng)一板式，但不同欄目下的子欄目板式不一樣。在部分二級頁面里，除了導(dǎo)航可以進入三級頁面外，各二級頁面也加入了按鈕鏈接，更方便進入三級頁面。因為我們選取的課題是傳播類的食品網(wǎng)站，所以大膽的使用了紅色作為網(wǎng)站主色調(diào)。雖然沒有使每個頁面的板式不一樣，但各欄目下的三級頁面統(tǒng)一，簡單而不失單調(diào)，這樣更能給人整齊一致的感覺，也使訪問者一目了然。2.7網(wǎng)站預(yù)定數(shù)據(jù)流程分析根據(jù)網(wǎng)站在線交流功能的要求，建立數(shù)據(jù)庫，以下是表的各數(shù)據(jù)項。1．用戶登錄信息表：dbo.tb_Admin標(biāo)識：AdminID。用戶登錄信息表：用戶登錄ID號(AdminID)，用戶名(AdminName)，密碼(AdminPwd)3個字段。2．論壇模塊表：dbo.tb_Module標(biāo)識：ModuleID。模塊信息表：模塊號(ModuleID)，模塊名稱(ModuleName)，創(chuàng)建模塊日期(ModuleDate)3個字段。3．幫助表：dbo.tb_Help標(biāo)識：HelpID。幫助信息表：幫助序號(HelpID)，幫助名稱(HelpName)，幫助內(nèi)容(HelpConcent)，3個字段。第3章網(wǎng)站設(shè)計現(xiàn)在的Flash網(wǎng)站已經(jīng)不再是曾經(jīng)簡單的鼠標(biāo)事件，不再是單一的切換，因為這些Javascript技術(shù)已經(jīng)幫它實現(xiàn)[13]。現(xiàn)在的Flash在網(wǎng)站設(shè)計中扮演著更為重要的角色，尤其在3D方面的表現(xiàn)，總會讓我們目瞪口呆。一個優(yōu)秀的Flash網(wǎng)站，就像一部令人印象深刻的電影，給我們帶來視覺上的享受。Flash網(wǎng)站中的內(nèi)容多數(shù)甚至全部都是由Flash制作完成的，網(wǎng)站基本以圖形和動畫為主所以比較適合做那些文字內(nèi)容不太多，以平面動畫效果為主的應(yīng)用[14]。3.1網(wǎng)站結(jié)構(gòu)圖整個網(wǎng)站結(jié)構(gòu)分為開場動畫，一級頁面，二級頁面和三級頁面。一級頁面為首頁，二級頁面有“美食菜譜”、“美食專題”、“美食廚房”、“美食原料”、“西餐導(dǎo)航”、“食家雜談”，在每個二級欄目下又細分了3到4個三級欄目。開場動畫開場動畫首頁美食菜譜川菜粵菜湘菜閩菜美食專題家常菜譜美容瘦身老人養(yǎng)生美食廚房美容菜譜美食DIY美容菜譜飲食資訊飲食誤區(qū)飲食養(yǎng)性營養(yǎng)飲食西餐導(dǎo)航韓國料理法國料理意大利餐美食原料肉禽類蔬菜類米面豆類食家雜談圖1網(wǎng)站結(jié)構(gòu)圖3.2網(wǎng)站開場動畫設(shè)計Flash網(wǎng)站的開場動畫在整個網(wǎng)站中都起著至關(guān)重要的作用，一個好的開場動畫會緊緊地抓住瀏覽者的眼球，給瀏覽者留下深刻的印象，從而提高整個網(wǎng)站的層次。開場動畫，我們設(shè)計的比較有美食文化的特色，打開網(wǎng)站后，音樂開始響起，動畫中間出現(xiàn)關(guān)于中華美食文化源遠流長的介紹性文字，當(dāng)文字結(jié)束后，動畫會以潑墨的形式分別出現(xiàn)介紹川菜文化和湘菜文化的圖片和文字；當(dāng)湘文化介紹完之后，變成另一個音樂，慢慢出現(xiàn)網(wǎng)站的名字和網(wǎng)站的標(biāo)語，最后出現(xiàn)本網(wǎng)站的logo和“點擊進入”的文字，當(dāng)點擊“點擊進入”時會進入網(wǎng)站的主頁。在開場動畫展示的過程中動畫右下角一直會有“skip”字樣，可以跳過開場動畫的播放同樣可以進入本網(wǎng)站的主頁。流暢的動畫將網(wǎng)站開場動畫界面展示給瀏覽者。網(wǎng)站開場動畫如圖2所示：圖2開場動畫3.3網(wǎng)站一級頁面設(shè)計網(wǎng)站的主頁是網(wǎng)站的門面，所以首頁的設(shè)計是整個網(wǎng)站的重點內(nèi)容，必須要有吸引大眾目光的有創(chuàng)意的版面設(shè)計，這樣才能更好地宣傳與推廣網(wǎng)站。本網(wǎng)站分為左右兩個部分，左邊是有關(guān)美食的一些介紹文字框，拖動滑竿可以向下滑動后，可看到整個簡介的內(nèi)容，左上角是本網(wǎng)站的Logo標(biāo)志——食家美食網(wǎng)，并在Logo下邊配以火在燃燒的動畫。左下角是網(wǎng)站的版權(quán)信息，頁面上有帶有很多動畫效果的文字，為網(wǎng)站增加動感。本網(wǎng)站的字體顏色多為白色，方便瀏覽者觀看。網(wǎng)站的右邊以翻頁的形式出現(xiàn)6張圖片形成了兩排，呈現(xiàn)出一排三張圖片的格局。六張圖片整齊的排列在頁面中央，且六張圖片任一張都是可點擊的，點擊圖片會有出現(xiàn)一些相關(guān)的文字介紹或者圖片，這時右上方會出現(xiàn)關(guān)閉按鈕，點擊關(guān)閉以后將恢復(fù)到網(wǎng)站的首頁。網(wǎng)站的右下角有音樂條可以控制網(wǎng)站背景音樂音量的大小及音樂的開關(guān)。圖3為首頁效果圖：圖3一級頁面我們設(shè)計網(wǎng)站時，在網(wǎng)站里添加了背景音樂，考慮到有些用戶可能不想聽到背景音樂，所以我們在網(wǎng)站的下放設(shè)計了音樂條用來控制背景音樂的開關(guān)以及音量的大小。為了達到控制音樂這種效果，我們想了很多方法，以下是部分代碼（詳細代碼見附錄一）：MySound1=newSound();MySound1.loadSound("Morning.mp3",true);MySound1.start();MySound1.onSoundComplete=function(){MySound1.start();};……3.4網(wǎng)站二級頁面設(shè)計網(wǎng)站的二級頁面分為：“美食菜譜”，“美食專題”，“美食廚房”，“美食原料”，“西餐導(dǎo)航”，“飲食資訊”六個板塊。在樣式上，我們的每個版塊都達到了不一樣的效果，在二級頁面我們采用的顏色大致相同，簡潔而不失大氣，并且在二級頁面上，除了點擊導(dǎo)航上的三級子欄目外，也可以在頁面上找到相應(yīng)的按鈕進入三級頁面。以“美食專題”為例，在美食專題這個頁面中，左部分是以圖片的形式呈現(xiàn)在我們面前，當(dāng)鼠標(biāo)經(jīng)過某一張圖片時，會出現(xiàn)另一張圖片，當(dāng)鼠標(biāo)經(jīng)過圖片旁邊的文字時會出現(xiàn)相關(guān)的介紹性文字。頁面的右側(cè)是一棵不斷生長的花草圖案及飄落的文字，是用來增加頁面的美觀度。從而使網(wǎng)站的視覺效果更為震撼。頁面的上方出現(xiàn)進入到三級頁面的導(dǎo)航。圖4為美食專題頁面展示效果:圖4二級頁面以下是實現(xiàn)圖片展示的部分代碼：stop();a.useHandCursor=false;b.useHandCursor=false;c.useHandCursor=false;d.useHandCursor=false;我們制作的圖片切換在運行時一直顯示著手的形狀這不是我們需要的，所以我們使用了上面的代碼，用來取消當(dāng)鼠標(biāo)經(jīng)過圖片時圖片切換而不顯示手形的目的。這里的a,b,c,d代表著頁面中所顯示的4張圖片的實例名。3.5網(wǎng)站三級頁面設(shè)計網(wǎng)站的三級頁面，為各欄目下的詳細介紹，是將每個二級欄目細分為3到4個子欄目，分別進行詳細介紹。在風(fēng)格上，每個二級頁面下的子欄目樣式統(tǒng)一，整齊簡潔，使網(wǎng)站看起來更加大氣規(guī)整。我們所制作的美食網(wǎng)站展示主要是在“美食菜譜”，“美食專題”，“美食廚房”，“美食原料”，“西餐導(dǎo)航”，“飲食資訊”六個欄目中進行詳細介紹，各個板塊下的三級頁面形式各異，但是每個板塊下的三級頁面風(fēng)格是統(tǒng)一的。以下截取了“美食廚房”欄目下的“美食DIY”頁面作為展示：圖5三級頁面“美食DIY”這個頁面的特色就是形式比較獨特新穎，頁面的左側(cè)是想要介紹的幾道美食的圖片，而右邊是各個美食相應(yīng)的制作方法。中間的三個按鈕是當(dāng)瀏覽者點擊某一個按鈕時會出現(xiàn)相應(yīng)的一道美食和它的制作方法。整個頁面的效果符合了“美食廚房”這個主題，展現(xiàn)形式別具一格。3.6各數(shù)據(jù)表結(jié)構(gòu)數(shù)據(jù)庫技術(shù)隨著數(shù)據(jù)應(yīng)用和需求的變化而不斷發(fā)展。創(chuàng)建數(shù)據(jù)庫的過程就是確定數(shù)據(jù)庫的名稱、所有者、大小以及存儲該數(shù)據(jù)庫的文件和文件組。同時需要理清楚各項之間的相應(yīng)關(guān)系，才可以進行正常的網(wǎng)站運行。1．用戶登錄信息表:dbo.tb_Admin標(biāo)識：AdminID。預(yù)定信息表：登錄ID號(AdminID)，是否確認(AdminName)，價格(AdminPwd)3個字段。表1用戶登錄信息表字段數(shù)據(jù)類型允許空是否為主鍵AdminIDintnoyesAdminNamebityesnoAdminPwdintyesno2．瀏覽模塊信息表：dbo.tb_Module標(biāo)識：Module_ID。模塊信息表：模塊號(ModuleID)，模塊名稱(ModuleName)，創(chuàng)建模塊日期(ModuleDate)3個字段。表2瀏覽模塊信息表字段數(shù)據(jù)類型允許空是否為主鍵ModuleIDintnoyesModuleNamebityesnoModuleDateintyesno3．幫助表：dbo.tb_Help標(biāo)識：HelpID。幫助信息表：幫助序號(HelpID)，幫助名稱(HelpName)，幫助內(nèi)容(HelpConcent)，3個字段。表3幫助表字段數(shù)據(jù)類型允許空是否為主鍵HelpIDintnoyesHelpNamebityesnoHelpConcentintyesno以上為數(shù)據(jù)庫的三張表結(jié)構(gòu)。3.7數(shù)據(jù)庫的連接數(shù)據(jù)庫是用于存儲數(shù)據(jù)信息的系統(tǒng)，通過其他語言程序可以讀取數(shù)據(jù)庫中信息，或?qū)⑿畔⒋鎯Φ綌?shù)據(jù)庫中。本網(wǎng)站數(shù)據(jù)庫的連接采用的是ASP.NET技術(shù)。我們制作網(wǎng)站的數(shù)據(jù)庫連接將代碼寫入了Web.Config文件，以下為部分代碼：<?xmlversion="1.0"?><configuration><appSettings/><connectionStrings><addname="hotelConnectionString"connectionString="DataSource=.\sqlexpress;InitialCatalog=hotel;IntegratedSecurity=True"providerName="System.Data.SqlClient"/></connectionStrings><system.web><compilationdebug="true"/><authenticationmode="Windows"/></system.web></configuration>3.8數(shù)據(jù)讀取頁面功能在“在線論壇”功能里，主要是提供“在線瀏覽帖子”、“用戶登錄”、“發(fā)表帖子”，管理員還可以“管理帖子”、“管理模塊”、“管理用戶”功能。在論壇里，用戶可以暢所欲言，有好的關(guān)于美食文化的帖子都可以積極發(fā)表，在論壇里發(fā)現(xiàn)好的帖子也可以好好收藏。圖6為“管理員登陸”頁面截圖：圖6數(shù)據(jù)讀取“管理員登陸”圖第4章網(wǎng)站測試網(wǎng)站測試指的是當(dāng)一個網(wǎng)站制作完成，上傳到服務(wù)器之后針對網(wǎng)站的各項性能情況的一項檢測工作。它與軟件測試有一定的區(qū)別，它除了要求外觀的一致性以外，還要求其在各個瀏覽器下的兼容性，以及在不同環(huán)境下的顯示差異[15]。4.1網(wǎng)站運行環(huán)境網(wǎng)站運行環(huán)境：操作平臺：WindowsXP/Windows7數(shù)據(jù)庫：MicrosoftSQLServer2005運行環(huán)境：MicrosoftInternetInformationServices(IIS)5.14.2測試結(jié)果及分析1．測試結(jié)果第一，先根據(jù)程序說明文檔配置IIS，在MicrosoftSQLServer2005里添加數(shù)據(jù)庫后，還需要將本地數(shù)據(jù)庫名稱添加到網(wǎng)站數(shù)據(jù)庫安全性用戶中，然后進行測試。第二，測試“美食菜譜”下四個頁面的效果，在IIS下運行網(wǎng)站，點擊導(dǎo)航上的“美食菜譜”按鈕，可以看到二級頁面，幾張分別代表著所要介紹的地方菜系的圖片依次進行運動，移動到合適的位置，當(dāng)鼠標(biāo)經(jīng)過任何一張代表某個菜系的圖片時，在幾張圖片的中間空白位置會出現(xiàn)介紹該圖片所代表菜系的文字。在圖片的右邊是用來鏈接三級頁面的按鈕。點擊進入三級頁面，5張圖片以W的形狀出現(xiàn)在界面上，鼠標(biāo)經(jīng)過圖片出現(xiàn)文字介紹。測試其他的按鈕都是成功的。第三，測試“美食專題”下的三個頁面的效果，首先點擊導(dǎo)航上的“美食專題”按鈕，界面上出現(xiàn)幾張圖片組成的大圖片，這屬于鼠標(biāo)經(jīng)過事件，當(dāng)鼠標(biāo)經(jīng)過某一張圖片時，這張圖片就會切換成另一張圖片，當(dāng)鼠標(biāo)經(jīng)過文字時會出現(xiàn)文字介紹。圖片上邊分別為進入三級頁面的按鈕。點擊進入三級頁面，當(dāng)點擊某一張小圖片時，圖片會變大并配以文字介紹。測試其他的按鈕都能成功連接。第四，測試“美食廚房”下的三個頁面的效果，首先點擊導(dǎo)航上的“美食廚房”按鈕，頁面像幕布一樣切換出來，左側(cè)四張小圖片疊放在一起，都是可點的，點擊以后右側(cè)的大圖片會以不同樣式自動切換出來，頁面中間是詳細的文字介紹。文字上方是四個帶鏈接的按鈕，點擊以后進入三級頁面，左側(cè)是幾張圖片的切換，單擊按鈕時，右側(cè)配以相對圖片的文字介紹。測試其他的按鈕都能夠鏈接。第五，測試“美食原料”下的三個頁面的效果，首先點擊導(dǎo)航上的“美食原料”按鈕，頁面上會出現(xiàn)三張在運動的圖片，在圖片的下方為相對圖片的文字介紹。圖片的左邊是看上去讓頁面美觀的運動圖片，圖片上邊分別是進入三級頁面的按鈕。點擊進入三級頁面，界面上出現(xiàn)一張圖片，這同樣屬于鼠標(biāo)事件，當(dāng)鼠標(biāo)經(jīng)過圖片的某一個區(qū)域時會在圖片上出現(xiàn)相應(yīng)的文字。當(dāng)點擊按鈕時圖片會切換到另一張圖片，界面的右邊是介紹該頁面的文字。測試其他的按鈕都能夠鏈接。第六，測試“西餐導(dǎo)航”下的三個頁面的效果，首先點擊導(dǎo)航上的西餐導(dǎo)航按鈕，頁面右側(cè)是幾張圖片的自行切換，界面下邊是該頁面的一些文字介紹，文字上方是用圖片做成的進入三級頁面的按鈕，點擊進入三級頁面，頁面左邊出現(xiàn)文字介紹，右邊會慢慢移動到適合的位置，這里的圖片有置頂?shù)膭幽?，鼠?biāo)經(jīng)過某一張圖片，該圖片置頂，當(dāng)點擊這張圖片時會出現(xiàn)這張圖片的文字介紹。測試其他按鈕均成功。第七，測試“飲食資訊”下的三個頁面的效果，首先點擊導(dǎo)航上的飲食資訊按鈕，頁面左邊出現(xiàn)一幅大圖，并且在圖片上有文字介紹，大圖上兩塊幕布向兩邊展開并漸隱消失，圖片下方有四個白色小正方形，當(dāng)鼠標(biāo)經(jīng)過這幾個正方形時圖片切換，每張圖片切換效果相同。頁面左邊是文字介紹，在文字介紹旁邊是進入三級頁面的按鈕，點擊進入三級頁面，頁面上邊分別是文字介紹和圖片，頁面下邊是一行可以左右移動的圖片。測試其他的按鈕都能夠鏈接。第八，測試“食家雜談”的功能，在IIS下運行網(wǎng)站，點擊導(dǎo)航上的食家雜談按鈕，在該論壇中，主要是提供“在線瀏覽帖子”、“用戶登錄”、“發(fā)表帖子”等功能，管理員還可以完成“管理帖子”、“管理模塊”、“管理用戶”等操作。在論壇里，用戶可以暢所欲言，有好的關(guān)于美食的帖子都可以積極發(fā)表，在論壇里發(fā)現(xiàn)好的帖子也可以收藏。2．測試分析 經(jīng)過網(wǎng)站測試后，每個頁面都能正常顯示。達到了預(yù)先設(shè)想的效果，按時完成了整個網(wǎng)站的設(shè)計，制作，調(diào)試等一系列的工作。同時，在進行網(wǎng)站測試時，我們遇到了很多問題和困難，在老師和同學(xué)們的幫助下，網(wǎng)站功能現(xiàn)在都已經(jīng)能夠基本實現(xiàn)。第5章總結(jié)在完成設(shè)計的兩個多月里，我和我的搭檔經(jīng)歷的很多。在制作網(wǎng)站的過程中老師和同學(xué)的幫助是完成設(shè)計的必要因素。開始在網(wǎng)站的規(guī)劃，網(wǎng)站的色彩選擇等的方面我們遇到了很多的困難，又因為制作網(wǎng)站經(jīng)驗的匱乏，所以有一段時間我們的網(wǎng)站基本上沒有什么進度，所幸在老師和同學(xué)的幫助，我和我的搭檔的思路逐漸明了，而我們的網(wǎng)站也慢慢地完成，雖然我們的網(wǎng)站在制作過程中遇到了很多的困難，但是因為有了老師和同學(xué)的幫助，我們也在規(guī)定的時間內(nèi)完成了網(wǎng)站的制作。在制作網(wǎng)站的過程中我們不僅運用了Flash技術(shù)，而且使用了其他別的軟件技術(shù)，例如：制作論壇的時候用到了ASP.NET技術(shù)，數(shù)據(jù)庫技術(shù)，網(wǎng)站所需要的圖片規(guī)格不符合要求的，我們還使用了Photoshop軟件。這次設(shè)計的網(wǎng)站是一個較為完整的項目，它不僅考察了我們學(xué)到的知識在技術(shù)上的應(yīng)用，也需要配合我們的審美觀，更重要的是它讓我們學(xué)會團體合作的重要性。這不僅僅是一次畢業(yè)設(shè)計，更是一次系統(tǒng)的學(xué)習(xí)，我最大的收獲是學(xué)會了一種態(tài)度，一種對待學(xué)習(xí)的態(tài)度，這對我以后的學(xué)習(xí)是非常有幫助的。參考文獻[1]羅小燕．Flash動畫與卡通制作創(chuàng)意導(dǎo)航[M]．北京：清華大學(xué)出版社，2002：123～145．[2]哈特．ASP.NET2.0入門經(jīng)典[M]．北京：清華大學(xué)出版社，2006：123～135．[3]德漢，周輝．FlashMX2004網(wǎng)頁動畫制作標(biāo)準(zhǔn)教材[M]．北京：電子工業(yè)出版設(shè)，2004：135～148．[4]宗曉艷．Photoshop與Flash結(jié)合把現(xiàn)有圖畫改編為動畫的方法[J]．電腦知識與技術(shù)，2009，（23）：86～98．[5]陳青．FlashMX2004標(biāo)準(zhǔn)案例教材[M]．北京：人民郵電出版社，2006：135～168．[6]趙國志，趙璐．色彩構(gòu)成與繪畫設(shè)計藝術(shù)[M]．遼寧：美術(shù)出版社，2000：133～145．[7]趙子江．變形動畫制作教程[M]．北京：機械工業(yè)出版社，2000：165～183．[8]高志清．Flash動作制作零點飛躍—學(xué)設(shè)計零點飛躍叢書[M]．北京：水利水電出版社，2005：109～138．[9]李瓊．Flash8.0閃客動畫輕松現(xiàn)場實戰(zhàn)[M]．北京：航空工業(yè)出版社，2007：112～135．[10]雪之航工作室．FlashMX中文版技巧和實例[M]．北京：中國鐵道出版社，2003：160～179．[11]張昌飛．精通PHOTOSHOPCS4中文版[M]．北京：清華大學(xué)出版社，2010：135～156．[12]瑞哈特（美），曹銘．FLASHMX寶典[M]．北京：電子工業(yè)出版社，2003：93～113．[13]成戈．二維動畫設(shè)計制作FLASH8[M]．北京：電子大學(xué)出版社，2008：135～149．[14]劉濤．Flash創(chuàng)意設(shè)計實例教程[M]．北京：清華大學(xué)出版社，2003：111～123．[15]張亞東，張薈惠．FlashC