【文章內(nèi)容簡(jiǎn)介】 打造一個(gè)界面美觀友好，布局 合理，欄目功能強(qiáng)大，信息詳盡的網(wǎng)站。另外，網(wǎng)站后臺(tái)管理將實(shí)現(xiàn)簡(jiǎn)單操作、易于維護(hù)等基本功能。主要實(shí)現(xiàn)如下目標(biāo)： （ 1）、向外界宣傳潮菜文化和菜肴傳統(tǒng)做法； （ 2）、信息盡可能齊全，滿(mǎn)足不同用戶(hù)需求； （ 3）、設(shè)有留言功能； （ 4）、后臺(tái)管理操作簡(jiǎn)單，功能完善，易于維護(hù)； （ 5）、管理員需登錄才可進(jìn)行后臺(tái)管理，安全可靠。 模塊結(jié)構(gòu)設(shè)計(jì) 模塊功能設(shè) 本美食網(wǎng)站主要由前臺(tái)信息頁(yè)面和后臺(tái)管理模塊兩部分組成。 前臺(tái)信息頁(yè)面： (如圖 3221) 前臺(tái)信息頁(yè)面主要包括 8個(gè)欄目： 主頁(yè)、家常菜、特色菜、傳統(tǒng)小吃、食療藥膳、留言版 (美食論享 )、菜肴排行、關(guān)于我們。主頁(yè)上，主要包括幾個(gè)重要的鏈接 還有一個(gè)搜索功能模塊（美食特搜）。另外，各欄目界面均美觀友好、布局合理，吸引用戶(hù)。 后臺(tái)管理模塊： (圖 3222) 后臺(tái)管理功能完善，包括修改企業(yè)簡(jiǎn)介；增加、刪改菜肴信息；管理菜系；前臺(tái)管理等。管理員需登錄才能進(jìn)行后臺(tái)管理操作，登錄成功之后就可以對(duì)網(wǎng)站的信息進(jìn)行增、刪、改等工作，同時(shí)具有增加 /管理管理員及回復(fù)前臺(tái)用戶(hù)留言的權(quán)限。 模塊功能結(jié)構(gòu)圖 主頁(yè) 家常菜 特色菜 傳統(tǒng)小吃 食療藥膳 前臺(tái)頁(yè)面信息 美食 特搜 美食列表 美食詳情 圖 31 前臺(tái)頁(yè)面模塊功能結(jié)構(gòu)圖 后臺(tái)管理 增加菜肴 刪除菜肴 管理菜系 前臺(tái)管理 管理員 管理友情鏈接 管理留言版 退出管理 圖 32 后臺(tái)管理模塊功能結(jié)構(gòu)圖 數(shù)據(jù)庫(kù)設(shè)計(jì) 數(shù)據(jù)庫(kù)在任何動(dòng)態(tài)網(wǎng)站中占有非常重要的地位，數(shù)據(jù)庫(kù)結(jié)構(gòu)設(shè)計(jì)的合理與否會(huì)對(duì)網(wǎng)站的效率以及實(shí)現(xiàn)的效果產(chǎn)生直接影響。合理的數(shù)據(jù)庫(kù)結(jié)構(gòu)設(shè)計(jì)可以提高數(shù)據(jù)存儲(chǔ)的效率，保證數(shù)據(jù)的完整性和一致性。同時(shí)，合理的數(shù)據(jù)庫(kù)結(jié)構(gòu)也將有利于網(wǎng)站的開(kāi)發(fā)實(shí)現(xiàn)。 設(shè)計(jì)數(shù)據(jù)庫(kù) 時(shí)應(yīng)該首先充分了解網(wǎng)站各個(gè)方面的需求，包括現(xiàn)有的以及將來(lái)可能增加的需求。 數(shù)據(jù)庫(kù)名稱(chēng)為：“ food”。 ER 圖設(shè)計(jì) 用戶(hù)的需求具體體現(xiàn)在對(duì)美食信息上，美食信息包括名稱(chēng)，圖片，制作方法等數(shù)據(jù)，這就要求數(shù)據(jù)庫(kù)結(jié)構(gòu)能夠充分滿(mǎn)足各種信息的輸出和輸入。 針對(duì)本網(wǎng)站的需求，通過(guò)對(duì)某些功能的所要需求和數(shù)據(jù)分析，設(shè)計(jì)如下面所示的數(shù)據(jù)項(xiàng)和數(shù)據(jù)結(jié)構(gòu) ： 管理員信息表：包括登錄賬號(hào)、密碼； 美食信息表：包括美食編號(hào)、名稱(chēng)、圖片、菜系、調(diào)料、市場(chǎng)價(jià)、制作過(guò)程等； 美食類(lèi)別信息表：包括菜系編號(hào)、名稱(chēng)、下屬二級(jí)分類(lèi)數(shù)目、 JS 代碼； 美食二級(jí)分類(lèi)信息表：包括編號(hào)、名稱(chēng)、數(shù)量、主菜類(lèi)編號(hào)； 用戶(hù)留言信息表：編號(hào)、用戶(hù)姓名、電話(huà)、郵箱、留言?xún)?nèi)容、留言時(shí)間、回復(fù)內(nèi)容； 友情鏈接信息表：編號(hào)、標(biāo)志圖、網(wǎng)站名稱(chēng)、網(wǎng)站地址、網(wǎng)站簡(jiǎn)介、加入時(shí)間。 根據(jù)以上數(shù)據(jù)項(xiàng)和數(shù)據(jù)結(jié)構(gòu)，設(shè)計(jì)出能夠滿(mǎn)足數(shù)據(jù)庫(kù)需求的各種實(shí)體，以及它們之間的關(guān)系，設(shè)計(jì)規(guī)劃出的實(shí)體有：管理員實(shí)體、美食實(shí)體、美食類(lèi)別實(shí)體、二級(jí)分類(lèi)實(shí)體、友情鏈接等。各個(gè)實(shí)體具體的 ER圖如下： 管理員 賬號(hào) 密碼 圖 33 管理員 ER 圖 圖 34 美食 ER 圖 美食信息 調(diào)料 市場(chǎng)價(jià) 制作過(guò)程 名稱(chēng) 編號(hào) 圖片 所屬類(lèi)別 美食二級(jí)分類(lèi) 數(shù)量 編號(hào) 名稱(chēng) 主菜類(lèi)編號(hào) 圖 36 美食二級(jí)分類(lèi) ER 圖 圖 37 用戶(hù)留言 ER 圖 用戶(hù)留言 留言時(shí)間 回復(fù)內(nèi)容 郵箱 編號(hào) 用戶(hù)姓名 留言?xún)?nèi)容 友情鏈接信息 網(wǎng)頁(yè)簡(jiǎn)介 加入時(shí) 間 網(wǎng)站地 Logo 圖 38 友情鏈接 ER 圖 數(shù)據(jù)表設(shè)計(jì) 表 31：管理員信息表 字段名 數(shù)據(jù)類(lèi)型 數(shù)據(jù)長(zhǎng)度 是否為空 管理員賬號(hào) char 50 No 密碼 char 50 No 表 32：美食信息表 字段號(hào) 數(shù)據(jù)類(lèi)型 數(shù)據(jù)長(zhǎng)度 是否為空 編號(hào) ID char 名稱(chēng) char 50 No 圖片 char 50 Yes 制作原料 char 50 Yes 推薦等級(jí) char 10 No 美食類(lèi)別 char 10 No 美食二級(jí)類(lèi)別 char 10 No 調(diào)味料 char 50 Yes 市場(chǎng)價(jià) char 50 Yes 制作過(guò)程 char 255 Yes 關(guān)鍵字 char 50 Yes 推薦與否 自動(dòng) 點(diǎn)擊次數(shù) 自動(dòng) 日期 Date No 表 33：美食類(lèi)別信息表 字段名 數(shù)據(jù)類(lèi)型 數(shù)據(jù)長(zhǎng)度 是否為空 編號(hào) Long char 自動(dòng) No 名稱(chēng) char 50 No 下級(jí)分類(lèi)數(shù)目 Long char 自動(dòng) No JS 代碼 Char 50 No 表 34：美食二級(jí)分類(lèi)信息表 字段名 數(shù)據(jù)類(lèi)型 數(shù)據(jù)長(zhǎng)度 是否為空 編號(hào) Long char 自動(dòng)增值 名稱(chēng) Char 50 No 數(shù)量 Long char 自動(dòng) 美食類(lèi)別編號(hào) Long char 自動(dòng) 表 35：用戶(hù)留言信息表 字段名 數(shù)據(jù)類(lèi)型 數(shù)據(jù)長(zhǎng)度 是否為空 編號(hào) Long char 自動(dòng) No 用戶(hù)姓名 Char 50 No 電話(huà) Char 50 Yes 郵箱 Char 50 Yes 留言?xún)?nèi)容 Char 255 No 留言日期 Date 回復(fù) Char 255 Yes（默認(rèn)“暫無(wú)回復(fù)”） 表 36：友情鏈接信息表 字段名 數(shù)據(jù)類(lèi)型 數(shù)據(jù)長(zhǎng)度 是否為空 編號(hào) Long char 自動(dòng) 標(biāo)志 (Logo) char 50 網(wǎng)站名稱(chēng) char 50 網(wǎng)站地址 char 50 網(wǎng)站簡(jiǎn)介 char 255 加入時(shí)間 Date 界面設(shè)計(jì) 作為一個(gè)美食網(wǎng)站，界面的設(shè)計(jì)是至關(guān)重要的，一個(gè)優(yōu)秀的美食網(wǎng)站在用戶(hù)第一次瀏覽時(shí)就應(yīng)該給用戶(hù)造成視覺(jué)上的沖擊，吸引住用戶(hù)的眼球，可以從網(wǎng)站顏色搭配，結(jié)構(gòu)功能等方面去考慮。在實(shí)現(xiàn)視覺(jué)美觀享受的同時(shí)，也需要提供簡(jiǎn)單方便的操作。 主頁(yè)設(shè)計(jì) 研究表明，橙色是最能激發(fā)食欲的顏色，本主頁(yè)使用潮州標(biāo)志建筑圖片（湘子橋）作為主標(biāo)題背景圖，整體色彩搭配合理，布局清晰，同時(shí)注重細(xì)節(jié)構(gòu)造，使用趣味動(dòng)態(tài)標(biāo)題欄，構(gòu)造出美觀、吸引人的主頁(yè)。給人留下 深 刻 的 影 響 圖 39 主頁(yè) 留言 界面 用戶(hù)在瀏覽了網(wǎng)站頁(yè)面之后，可以來(lái)到“美食論享”頁(yè)面進(jìn)行留言，本網(wǎng)站不設(shè)游客登錄、注冊(cè)，留言板塊向所有用戶(hù)開(kāi)放，只需填入必要信息即可進(jìn)行留言，管理者會(huì)及時(shí)給予回復(fù)，此功能簡(jiǎn)單易操作，頁(yè)面自然清晰。 圖 310 美食論享（留言） 后臺(tái)管理界面 后臺(tái)管理功能完善，同時(shí)頁(yè)面整潔，結(jié)構(gòu)清晰明了。 圖 311 后臺(tái)主頁(yè) 圖 312 添加菜肴 圖 313 刪改菜肴 4 開(kāi)發(fā)實(shí)施 本網(wǎng)站的以 ASP為主要開(kāi)發(fā)語(yǔ)言，在 Dreamweaver中完成頁(yè)面的設(shè)計(jì)與框架布局，使用 Access數(shù)據(jù)庫(kù)，同時(shí)輔以 Photoshop為畫(huà)圖工具，對(duì)所使用圖片進(jìn)行必要修改 ,以保證頁(yè)面的美觀。 網(wǎng)站主頁(yè)開(kāi)發(fā) 頁(yè)面截圖 主頁(yè)面部分源代碼 table width=770 border=0 align=center cell padding=” 0” cell spacing=” 00” bgcolor=” FFCC99” tdamp。nibs。/td /t r t r bicolor=FFCC99 td width=” 5” imp border=” 0” sic=” Image/Space _ ” /td td width=175 malign=top style=borderright:1px D8D8D8 solid。 table border=0 width=100% cell spacing=0 cell padding=0 t r td align=center background= bicolor=DFDFE1 table width=157 border=0 cell padding=0 cell spacing=0 bicolor=FFCC99 t r td align=center!include file=/td /t r t r /t r t r /t r t r td align=centerimage sic=Image/ width=200 height=55 border=0/td /t r t r td align=center!include file=/td /t r t r td align=centerimp sic=Image/new. gif width=200 height=55 border=0/td /t r t r td align=center!include file=/td /t r t r td align=centerimp sic=Image/ width=200 height=55 border=0/td /t r t r td align=centertable border=0 cell spacing=0 cell padding=0 t r td width=100%imp border=0 sic=Image/ width=157 height=7/td /t r t r td background=Image/ align=centertable border=0 width=95% cell spacing=0 cell padding=5 t r td class=hajj width=100% align=centermarquee scroll amount=1 scroll delay=60 direction=up height=130 width=88 onMouseOut=this. start() onMouseOVer=this. stop() style=cursor: hand bicolor=F7EFFF