咖啡屋的網(wǎng)站設(shè)計與開發(fā)

1、畢業(yè)設(shè)計（論文）咖啡屋的網(wǎng)站設(shè)計與開發(fā)系 部： 信息技術(shù)系 專 業(yè)： 電子商務(wù) 學(xué) 號： 學(xué)生姓名： 指導(dǎo)教師姓名： 指導(dǎo)教師職稱： 摘要隨著因特網(wǎng)的飛速發(fā)展和信息經(jīng)濟(jì)、網(wǎng)絡(luò)經(jīng)濟(jì)等概念的提出，信息網(wǎng)絡(luò)漸漸影響著人們的生活方式。面對信息的來源，也不在是傳統(tǒng)的報刊、雜志、廣播等，而是通過零時空的網(wǎng)絡(luò)實現(xiàn)資源共享。因此，網(wǎng)站的設(shè)計與開發(fā)，成為了實現(xiàn)企業(yè)與顧客之間交流的重要紐帶。球愛咖啡屋網(wǎng)站是商業(yè)網(wǎng)站中展示和宣傳企業(yè)形象的一個重要方面。本網(wǎng)站通過設(shè)計開發(fā)，實現(xiàn)了后臺管理對產(chǎn)品信息和新聞信息的錄入、修改和刪除以及意見反饋的查看和刪除等功能，另外可以對后臺賬號進(jìn)行相應(yīng)的管理，以滿足安全性方面的要求。如何

2、有效地宣傳推廣自己的產(chǎn)品是各企業(yè)努力追求的目標(biāo)，同時客戶足不出戶就可以了解到企業(yè)最新的產(chǎn)品信息，并可以查找、咨詢顧客所需的產(chǎn)品，更可以通過留言板，把自己的意見反饋給企業(yè)，幫助企業(yè)更好的改進(jìn)發(fā)展，以滿足顧客需要。網(wǎng)站既達(dá)到了企業(yè)產(chǎn)品的宣傳與推廣，又實現(xiàn)了客戶與企業(yè)的相互溝通。關(guān)鍵字：網(wǎng)站設(shè)計 產(chǎn)品展示 新聞信息 后臺賬號管理 留言模塊目錄第1章引 言11.1課題的開發(fā)背景11.2選題的目的和意義1第2章系統(tǒng)分析22.1任務(wù)概述22.1.1組織結(jié)構(gòu)圖22.1.2組織與業(yè)務(wù)的關(guān)系22.1.3實現(xiàn)目標(biāo)32.2項目開發(fā)計劃3第3章概要設(shè)計43.1系統(tǒng)結(jié)構(gòu)模塊43.2處理流程43.2.1主流程43.2.2

3、后臺管理流程53.3數(shù)據(jù)庫設(shè)計53.3.1注冊表53.3.2新聞表53.3.3留言表6第4章詳細(xì)設(shè)計74.1主模塊說明74.1.1簡要說明74.1.2測試數(shù)據(jù)74.1.3主界面設(shè)計74.2網(wǎng)站首頁簡介84.2.1簡要說明84.2.2產(chǎn)品內(nèi)容94.3產(chǎn)品展示模塊94.3.1新聞模塊94.3.2產(chǎn)品界面設(shè)計104.4在線留言模塊114.4.1簡要說明114.4.2界面設(shè)計114.5聯(lián)系模塊124.5.1簡要說明124.5.2聯(lián)系界面設(shè)計12第5章系統(tǒng)測試145.1測試計劃145.1.1測試方案145.1.2測試項目145.2測試結(jié)果15第6章用戶手冊166.1系統(tǒng)主要功能166.2運行環(huán)境要求16

4、6.3系統(tǒng)安裝與初始化166.4運行說明16結(jié) 論18致 謝19參考文獻(xiàn)20溫州科技職業(yè)學(xué)院信息技術(shù)系 電子商務(wù)專業(yè)畢業(yè)設(shè)計第1章 引 言1.1 課題的開發(fā)背景隨著Internet的不斷普及，互聯(lián)網(wǎng)實現(xiàn)了世界范圍的互聯(lián)和信息共享，并已全面介入人類生產(chǎn)生活的方方面面，帶動著人類社會的飛速發(fā)展。越來越多的企業(yè)建立起自己的網(wǎng)站，以最快捷和方便的方法宣傳自己企業(yè)的形象和文化，擴(kuò)大自己在業(yè)界的影響， 本設(shè)計所完成的網(wǎng)站是功能比較完善的網(wǎng)站，對網(wǎng)站的體系和結(jié)構(gòu)的集約化安排，提供咖啡的最新信息，同時兼具時效性和全面性，網(wǎng)站同時為廣大喜愛咖啡者提供了一個相互交流的平臺。1.2 選題的目的和意義本網(wǎng)站以與時代接

5、軌和宣傳企業(yè)為目的，利用Internet進(jìn)行對企業(yè)產(chǎn)品的宣傳與推廣，樹立企業(yè)的形象，讓客戶足不出戶就能及時了解產(chǎn)品信息，并能根據(jù)需要查找、咨詢自己所需的產(chǎn)品。本網(wǎng)站設(shè)計了意見反饋，通過意見反饋，客戶可以留下自己的聯(lián)系方式與意見，企業(yè)可以對其所發(fā)表的意見與其聯(lián)系。企業(yè)通過網(wǎng)站后臺，可以發(fā)布自己公司的動態(tài)，最新產(chǎn)品，以及客戶意見的查看。企業(yè)網(wǎng)站的開發(fā)意義在于讓訪客及時了解公司動態(tài)，招聘信息和企業(yè)產(chǎn)品?？蛻艨梢钥吹焦咀钚孪嚓P(guān)信息及產(chǎn)品信息，既達(dá)到企業(yè)產(chǎn)品的宣傳與推廣，又實現(xiàn)了客戶與企業(yè)之間的溝通。第2章 系統(tǒng)分析2.1 任務(wù)概述2.1.1 組織結(jié)構(gòu)圖組織結(jié)構(gòu)圖，如下圖所示：圖2- 1 組織結(jié)構(gòu)圖球

6、愛咖啡屋網(wǎng)站首 頁種類介紹新 聞實物對照聯(lián)系我們在線留言2.1.2 組織與業(yè)務(wù)的關(guān)系 業(yè)務(wù)流程圖，如下圖所示：圖2- 2 業(yè)務(wù)流程圖網(wǎng) 民瀏覽公司首頁瀏覽公司新聞查看產(chǎn)品介紹瀏覽產(chǎn)品留言反饋瀏覽聯(lián)系方式2.1.3 實現(xiàn)目標(biāo)球愛咖啡屋網(wǎng)站主要針對通過Internet來訪問該網(wǎng)站上的相關(guān)產(chǎn)品，主要實現(xiàn)的目標(biāo)有：1、 管理員可以對公司產(chǎn)品、公司新聞等進(jìn)行添加、修改和刪除。2、 管理員可以對賬號并進(jìn)行密碼的修改和刪除。3、 訪客通過該網(wǎng)站可以瀏覽網(wǎng)站新聞，每周優(yōu)惠活動，每周特別推薦。4、 訪客通過該網(wǎng)站可以瀏覽公司最新新聞5、 訪客可以在網(wǎng)站上發(fā)表自己的留言與企業(yè)進(jìn)行溝通。6、 訪客可以對相關(guān)產(chǎn)品的詳

7、細(xì)信息進(jìn)行瀏覽。2.2 項目開發(fā)計劃項目實施進(jìn)度安排：完成內(nèi)容日期安排1.進(jìn)行設(shè)計前的資料（圖片，信息，資料）收集和實際情況調(diào)查,落實畢業(yè)設(shè)計課題2011年12月2日2011年12月4日2.填寫開題報告2011年12月 5日2011年12月12日3.撰寫文檔前部分： (1)系統(tǒng)分析2011年12月12日2011年12月27日(2)概要設(shè)計 (3)詳細(xì)設(shè)計：主模塊2012年01月03日2012年01月21日注冊登錄模塊2012年01月25日2011年02月27日咖啡屋介紹模塊2012年01月25日2011年02月27日產(chǎn)品模塊2012年01月25日2011年02月27日企業(yè)文化模塊2012年01

8、月25日2011年02月27日留言板模塊2012年01月25日2011年02月27日聯(lián)系方式模塊2012年01月25日2011年02月27日4.編制各功能模塊程序2012年04月02日2012年04月08日5.撰寫文檔后部分：系統(tǒng)測式2012年04月10日2012年04月15日6.系統(tǒng)測試及運行2012年04月17日2012年04月20日7.文檔整合提交：向指導(dǎo)老師提交畢業(yè)設(shè)計2012年 04月22日2012年04月29日全部完成第3章 概要設(shè)計3.1 系統(tǒng)結(jié)構(gòu)模塊1、產(chǎn)品管理模塊該模塊是為了能夠讓管理員能夠更好的對產(chǎn)品信息進(jìn)行管理而設(shè)置的，其功能有產(chǎn)品信息的添加、編輯、刪除。2、新聞管理模塊

9、該模塊是為了能夠讓管理員能夠更好的對公司新聞進(jìn)行管理而設(shè)置的，其功能有公司新聞的添加、編輯、刪除。3、在線留言管理模塊該模塊是讓企業(yè)知道客戶的反饋信息，如：客戶購產(chǎn)品之后的意見，以及客戶想要訂購的產(chǎn)品內(nèi)容。4、賬號管理模塊初始的管理賬號，可以建立多個后臺管理賬號，方便多人添加信息，達(dá)到發(fā)布產(chǎn)品等信息的效率，并可以修改其密碼。5、聯(lián)系商家模塊客戶對產(chǎn)品有什么意見可以直接聯(lián)系商家進(jìn)行解決。3.2 處理流程3.2.1 主流程1、建立與數(shù)據(jù)庫的連接。2、獲取網(wǎng)站設(shè)計。3、顯示首頁面。4、等待用戶輸入。如后臺登錄：進(jìn)入后臺登錄頁面。如瀏覽：進(jìn)入瀏覽頁面。如新聞信息管理：進(jìn)入新聞信息管理頁面。如產(chǎn)品信息管

10、理：進(jìn)入產(chǎn)品信息管理頁面。如后臺管理：進(jìn)入后臺管理頁面。3.2.2 后臺管理流程1、要求管理員輸入用戶名及密碼。2、管理員身份登錄查驗3、賬號管理：進(jìn)入管理員賬號管理頁面。修改密碼：進(jìn)入修改密碼頁面。4、新聞管理：進(jìn)入新聞管理頁面。添加新聞：進(jìn)入添加新聞頁面。修改新聞：進(jìn)入修改新聞頁面。刪除新聞：進(jìn)入刪除新聞頁面。5、產(chǎn)品信息管理：進(jìn)入產(chǎn)品管理頁面。添加產(chǎn)品：進(jìn)入添加產(chǎn)品頁面。編輯產(chǎn)品：進(jìn)入編輯產(chǎn)品頁面。刪除產(chǎn)品：進(jìn)入刪除產(chǎn)品頁面。6、意見反饋管理：進(jìn)入意見反饋管理頁面。3.3 數(shù)據(jù)庫設(shè)計3.3.1 注冊表表3- 1 注冊表字段名稱數(shù)據(jù)類型字段大小字段說明id自動編號長整型username文本

11、50姓名userpass文本50密碼email文本50郵箱3.3.2 新聞表表3- 2 新聞表 字段名稱數(shù)據(jù)類型字段大小字段說明id自動編號長整型新聞ID號news_subject文本50標(biāo)題news_content備注內(nèi)容news_faburen文本50發(fā)布人news_adddate日期/時間日期3.3.3 留言表 表3- 3 留言表字段名稱數(shù)據(jù)類型字段大小字段說明id自動編號長整型意見反饋表的主鍵xingming文本50名稱neirong文本50內(nèi)容time文本50時間20第4章 詳細(xì)設(shè)計4.1 主模塊說明4.1.1 簡要說明簡要說明，如下表所示：表4- 1 主模塊表模塊名稱主模塊模塊代碼

12、名稱Index.asp啟動條件打開IE并輸入相應(yīng)的網(wǎng)址功能顯示各模塊信息4.1.2 測試數(shù)據(jù)1、模塊是否正常工作流程。2、對輸入的查驗，包括輸入值的合法性與合理性檢驗。3、數(shù)據(jù)庫連接異常能否做出適當(dāng)處理。4、數(shù)據(jù)庫數(shù)據(jù)異常時能否判斷，并給予合適處理。4.1.3 主界面設(shè)計球愛咖啡屋網(wǎng)站首頁種類介紹新聞實物對照聯(lián)系我們在線留言進(jìn)入首頁界面設(shè)計，如下圖所示：圖4- 1 公司首頁4.2 網(wǎng)站首頁簡介4.2.1 簡要說明網(wǎng)站首頁簡要說明，如下表所示：圖4- 2 主模塊說明表模塊名稱種類介紹啟動條件在主模塊中按相應(yīng)的文字鏈接條功能顯示產(chǎn)品的簡介內(nèi)容4.2.2 產(chǎn)品內(nèi)容產(chǎn)品內(nèi)容設(shè)計效果，如下圖所示：圖4-

13、 3 產(chǎn)品簡介4.3 產(chǎn)品展示模塊4.3.1 新聞模塊產(chǎn)品展示簡要說明，如下表所示：表4- 2 新聞模塊說明表模塊名稱新聞啟動條件在主模塊中按相應(yīng)的文字鏈接條新聞模塊效果，如下圖所示：圖4- 4 新聞模塊圖4.3.2 產(chǎn)品界面設(shè)計產(chǎn)品展示模塊的建立和維護(hù)功能的窗體效果也就是本網(wǎng)站的字頁它應(yīng)該包括以下功能或條目結(jié)構(gòu)：產(chǎn)品相關(guān)信息、產(chǎn)品添加、產(chǎn)品修改、產(chǎn)品刪除，其中在產(chǎn)品展示中有對產(chǎn)品進(jìn)行分頁的功能。產(chǎn)品展示模塊的效果，如下圖所示：圖4- 5 產(chǎn)品展示4.4 在線留言模塊4.4.1 簡要說明在線留言簡要說明，如下表所示：表4- 3 公司新聞模塊說明表模塊名稱在線留言啟動條件在主模塊中按相應(yīng)的文字鏈

14、接條功能在線給商家留言輸出顯示留言窗口該功能模塊的設(shè)立是為了能夠方便瀏覽者對網(wǎng)站提出自己的要求或者不滿之處。方便完善網(wǎng)站的不足。4.4.2 界面設(shè)計留言模塊，如下圖所示：圖4- 6 在線留言4.5 聯(lián)系模塊4.5.1 簡要說明意見反饋簡要說明，如下表所示：表4- 4 聯(lián)系我們模塊說明表模塊名稱聯(lián)系我們啟動條件在主模塊中按相應(yīng)的文字鏈接條輸入聯(lián)系我們功能實現(xiàn)訪客與網(wǎng)站維護(hù)人員的溝通與意見反饋輸出給予瀏覽者商家的具體聯(lián)系方式4.5.2 聯(lián)系界面設(shè)計 聯(lián)系我們模塊效果，如下圖所示：圖4- 7 聯(lián)系我們第5章 系統(tǒng)測試5.1 測試計劃5.1.1 測試方案考慮到各種因素和條件的限制，本網(wǎng)站設(shè)計決定采用黑

15、盒測試方案。決定不考慮制作步驟的簡易，而是根據(jù)網(wǎng)站所需要的輸入數(shù)據(jù)的格式以及應(yīng)該完成的功能，設(shè)計一些合法的測試用例和不合法的測試用例，對不合法的輸入和操作能夠正確地識別，以檢查系統(tǒng)是否能正確的發(fā)布新聞和產(chǎn)品以及填寫意見反饋的功能。5.1.2 測試項目1、后臺登錄測試后臺登錄界面，內(nèi)容包括帳號、密碼、輸入。2、后臺管理員管理測試后臺所有管理員的功能，內(nèi)容包括管理員對各功能模塊的管理，管理員賬戶的添加、刪除、修改等等。3、后臺新聞管理測試后臺新聞的管理，內(nèi)容包括新聞的添加、修改、刪除。4、后臺產(chǎn)品管理測試后臺產(chǎn)品管理，內(nèi)容包括分類的添加、修改、刪除。5、后臺的留言板管理測試后臺留言板的管理，內(nèi)容包

16、括意見反饋的查看與刪除。6、產(chǎn)品的前臺操作測試前臺企業(yè)的產(chǎn)品瀏覽操作，內(nèi)容包括產(chǎn)品的大圖、詳細(xì)介紹。7、新聞的前臺管理測試前臺公司新聞的瀏覽操作，內(nèi)容包括新聞的標(biāo)題、作者、發(fā)布時間、詳細(xì)內(nèi)容。8、留言板的前臺操作測試前臺瀏覽者對網(wǎng)站意見的撰寫與提交。5.2 測試結(jié)果1、程序運行已經(jīng)正確設(shè)定，安裝成功。2、程序代碼檢查，程序單位首部有程序說明和修改備注。3、功能測試，多畫面之間切換正確，功能鍵、觸發(fā)鍵、按鈕、菜單和選擇項功能正確。4、正確性測試，讀/寫/刪除操作結(jié)果正確，各種組合條件之查詢或報表正確。最終測試結(jié)果：測試結(jié)果顯示正常。第6章 用戶手冊6.1 系統(tǒng)主要功能本系統(tǒng)的設(shè)計主要是為了宣傳企

17、業(yè)文化，樹立良好的企業(yè)形象，展示公司產(chǎn)品，讓每位瀏覽者能很好的在網(wǎng)上瀏覽本網(wǎng)站，找到自己所需的產(chǎn)品和信息。本系統(tǒng)提供全免費的服務(wù)，如果你支持本站你可以在網(wǎng)站上發(fā)表對網(wǎng)站的評論以及給我們一些建設(shè)性的建議。本系統(tǒng)的實現(xiàn)也為當(dāng)今社會中的一部分足不出戶的人提供了一種方便的途徑。6.2 運行環(huán)境要求操作系統(tǒng) WindowsXP或Windows2000以上配置CPU：PIV以上內(nèi)存：64MB硬盤：160G以上開發(fā)工具 ASP，Photoshop , Flash8，Macromedia Dreamweaver 8數(shù)據(jù)庫系統(tǒng) Access 20036.3 系統(tǒng)安裝與初始化該系統(tǒng)操作簡單，首先配置好服務(wù)器,將所

18、有文件放入服務(wù)器的目錄下，就可以運行了。安裝步驟如下： 1、打開IIS服務(wù)器進(jìn)行設(shè)置，如果沒有IIS，請先安裝IIS 5.0版本以上。2、在安裝、設(shè)置完IIS后就可以瀏覽網(wǎng)頁了，瀏覽有兩種方式，一種是直接在IIS服務(wù)器的右欄的文件中找到那個index.asp文件，右擊選擇瀏覽。還有一種方式是打開IE在地址欄里輸入localhost/index.asp就可以打開網(wǎng)頁首頁了。6.4 運行說明在進(jìn)入網(wǎng)站后瀏覽者就可以看到網(wǎng)站的首頁其設(shè)計效果。在此頁面中瀏覽者可以瀏覽flash、網(wǎng)站欄目等等。如果瀏覽者想看看所有的產(chǎn)品只要點擊欄目上的“案例展示”便可實現(xiàn)，如果想看產(chǎn)品的詳細(xì)介紹或者大圖只要點擊產(chǎn)品的圖

19、片即可。如果瀏覽者對本網(wǎng)站有什么意見或好的建設(shè)性問題，可以點擊欄目上的“聯(lián)系我們”，進(jìn)行深入的溝通。最后對支持本系統(tǒng)的人和瀏覽本網(wǎng)站的瀏覽者表示忠心的感謝！你們的支持與存在是我們最大的動力，請在瀏覽在的同時不要忘了給我們提一些建設(shè)性的意見！以便我們能夠更好的為你們提供更優(yōu)質(zhì)的服務(wù)。 結(jié) 論畢業(yè)設(shè)計是考驗我們大學(xué)這三年來的所學(xué)，它要求我們將大學(xué)這三年來所學(xué)到的知識能夠融會貫通、熟練應(yīng)用，并要求我們能夠理論聯(lián)系實際，培養(yǎng)我們的綜合運用能力以及解決實際問題的能力。這次設(shè)計讓我感受頗深，真正體會到了在整個過程中的無奈與快樂。1.確定設(shè)計方向。這一點很重要，萬事開頭難，在開始的時候我就沒有很好的進(jìn)入狀態(tài)

20、。選題下來的時候我有很多的猶豫，考慮了很長時間才知道自己要做什么。把整體思路理清楚了，這樣你才能按照你最初的計劃堅定的走下去。2.頻繁與同學(xué)討論。剛開始做的時候進(jìn)度很慢，常常因為一個數(shù)據(jù)庫連接。搞得昏頭昏腦。網(wǎng)站建設(shè)的一半的時候才發(fā)現(xiàn)很多同學(xué)的畢業(yè)設(shè)計都差不多快要完成了，這時候心里就開始急了，就怕進(jìn)度趕不上。之后才發(fā)現(xiàn)有問題一定要開頭多問，多問老師，多問同學(xué)，不能自己悶頭做，方向偏了仍不知道，多把自己的想法和思路告訴老師和同學(xué)們?！芭杂^者清”，自己在設(shè)計網(wǎng)站時可能看不到不足之處，但是旁人卻能一眼就分的出好與壞，這時候多聽別人的意見與建議對我來說很有必要。3.越挫越勇。做畢業(yè)設(shè)計，前面前臺都還好

21、說，基本上靜態(tài)頁面不會出現(xiàn)什么錯誤只要美觀就好，可是后臺有關(guān)數(shù)據(jù)庫的問題就大了，常常被搞的脾氣暴躁，還會出現(xiàn)很多錯誤，沒辦法，只能自己慢慢調(diào)試解決所以的問題。4.越來越緊的狀態(tài)，尤其是最后的那幾天。畢業(yè)設(shè)計越到最后階段，越要有毅力和狀態(tài)，不能前緊后松，覺得前面做了不少，后面可以放松了。在制作畢業(yè)設(shè)計時也遇到了一些困難。由于這是我們第一次寫畢業(yè)文章，沒有任何經(jīng)驗，對于此文章的格式、要求和內(nèi)容都一無所知，在查詢了大量的書籍后才有了模糊概念。所以在此篇文章中不免會有些缺點。文章提交的前幾天，要不厭其煩的檢查正文，包括內(nèi)容，格式等。畢業(yè)設(shè)計為我們即將踏入社會之前提供了一次鍛煉的舞臺，同時我也相信會在我

22、以后的人生道路上帶來很多的幫助。經(jīng)過開發(fā)這個網(wǎng)站系統(tǒng)，這不僅僅是一次畢業(yè)設(shè)計的完成，而是在這過程中，所有的問題要自已去面對，自已去解決。由于我在這個月已進(jìn)入實習(xí)階段，時間等各方面也比較倉促，所以這次的畢業(yè)設(shè)計做的淺顯，和同學(xué)設(shè)計的設(shè)計比較之后，當(dāng)然仍有很多不足的地方，但這是我一個人第一次獨立的完成，不但鍛煉了自己的開發(fā)能力，同時也學(xué)到了很多，讓我受益匪淺。致 謝在論文即將完成之際，想到之前從不知道畢業(yè)論文怎么寫，到開始進(jìn)入課題到論文的完成，再到順利完成了畢業(yè)設(shè)計，傾注了太多的心血和時間，球愛咖啡屋網(wǎng)站的設(shè)計與開發(fā)的完成，意味著大學(xué)生活即將結(jié)束。在大學(xué)階段，我在學(xué)習(xí)上和思想上都受益非淺，這除了自身的努力外，與各位老師、同學(xué)和朋友的關(guān)心、支持