同城旅游網(wǎng)站項(xiàng)目規(guī)劃與設(shè)計目錄一、項(xiàng)目背景 11、選題的目的和意義 12、課題研究的主要簡介 1二、網(wǎng)站開發(fā)平臺 1三、網(wǎng)站建設(shè)日程表 2四、站點(diǎn)地圖 2五、線框圖 31、主頁布局 32、子頁布局 3六、設(shè)計規(guī)范及網(wǎng)頁UI設(shè)計 31、設(shè)計愿望 42、確定網(wǎng)站主題 53、確定網(wǎng)站形象 54、確定網(wǎng)站風(fēng)格 55、確定網(wǎng)站內(nèi)容 5七、主要頁面的詳細(xì)設(shè)計圖 6八、網(wǎng)站測試 81、測試準(zhǔn)備 82、用戶界面測試 83、功能測試 84、兼容性測試 9九、網(wǎng)站推廣與維護(hù) 91.網(wǎng)站推廣 92、網(wǎng)站維護(hù) 9PAGE2一、項(xiàng)目背景1、選題的目的和意義隨著計算機(jī)科學(xué)的迅速發(fā)展及網(wǎng)絡(luò)用戶要求的不斷提高，特別是數(shù)據(jù)庫技術(shù)在Internet中的廣泛應(yīng)用，Web站點(diǎn)向網(wǎng)絡(luò)用戶提供的服務(wù)將越來越豐富，越來越人性化，信息化管理被人們所重視。電子商務(wù)（ElectronicCommerce，簡稱E-commerce）隨即誕生，成為當(dāng)前產(chǎn)物，以滿足人們足不出戶即可搜集信息、實(shí)時購物等要求。時代的發(fā)展把我們推向網(wǎng)絡(luò)化和信息化的巨潮，這給我們帶來了無限的機(jī)遇，也帶來了巨大的挑戰(zhàn)。如何更好地利用網(wǎng)絡(luò)化和信息化，成為我們在未來的競爭中占據(jù)有利地位的關(guān)鍵問題。在這種情況下，同城旅游網(wǎng)站需要結(jié)合公司自己的實(shí)際情況，設(shè)計開發(fā)一個具有以宣傳與銷售為主的多功能網(wǎng)站平臺，它則是一個典型的Web電子商務(wù)系統(tǒng)，由網(wǎng)絡(luò)服務(wù)器和網(wǎng)頁實(shí)現(xiàn)。電子商務(wù)是通過采用數(shù)字科技與Internet作為最基本的溝通手段，將企業(yè)價值進(jìn)行持續(xù)不斷的優(yōu)化配置的過程。本網(wǎng)站功能包括公司簡介，公司新聞，營銷網(wǎng)絡(luò)，產(chǎn)品中心，客服中心，誠邀加盟，聯(lián)系我們等。2、課題研究的主要簡介同城旅游網(wǎng)站是給用戶一個方便的購物空間，登陸旅游網(wǎng)界面，根據(jù)自己的需求選擇瀏覽，其功能有以下：（1）用戶可以通過瀏覽主頁，了解公司的簡介以及圖片展示（2）用戶通過瀏覽子頁，可以對旅游進(jìn)行細(xì)致的了解二、網(wǎng)站開發(fā)平臺功能模塊技術(shù)和軟件平臺操作系統(tǒng)Windows8設(shè)計稿、圖形處理PhotoshopCS6動畫設(shè)計制作FlashCS5網(wǎng)頁制作平臺Dreamweaver網(wǎng)站開發(fā)語言HTML,CSS,JavaScript,asp，sql,server網(wǎng)站測試平臺Chrome，F(xiàn)irefox三、網(wǎng)站建設(shè)日程表完成整個項(xiàng)目所需時間為三個月，其中各項(xiàng)規(guī)劃任務(wù)如下表所示：時間任務(wù)內(nèi)容9月9日-16日擬定項(xiàng)目9月17日-23日制定初步項(xiàng)目計劃10月6日-19日網(wǎng)站初步框架10月20日-11月1日網(wǎng)站內(nèi)容具體豐富11月2日-11月10日總結(jié)反思，網(wǎng)站細(xì)節(jié)完善11月11日-24日計劃微調(diào)，網(wǎng)站用戶體驗(yàn)感測試11月25日-12月7日網(wǎng)站裝飾再加工，CSS布局，JS語言,后臺數(shù)據(jù)庫設(shè)計12月8日-12月15日最終測試四、站點(diǎn)地圖同城旅游網(wǎng)站同城旅游網(wǎng)站網(wǎng)站首頁跟團(tuán)游自助特賣服務(wù)五、線框圖1、主頁布局LLogo圖片搜索欄導(dǎo)航Banner動畫主推廣板塊版權(quán)及其他版權(quán)及其他版權(quán)設(shè)計2、子頁布局LLogo圖片搜索欄導(dǎo)航子頁主展示區(qū)版權(quán)及其他版權(quán)及其他版權(quán)設(shè)計六、設(shè)計規(guī)范及網(wǎng)頁UI設(shè)計同城旅游網(wǎng)網(wǎng)站這個網(wǎng)站是運(yùn)用了HTML靜態(tài)網(wǎng)頁技術(shù)，和Dreamweaver軟件相結(jié)合實(shí)現(xiàn)的。頁面間通過網(wǎng)頁鏈接，實(shí)現(xiàn)具體所要查找的食品，可以方便用戶的需要做出選擇，給人們帶來了極大地方便。1、設(shè)計愿望當(dāng)用戶點(diǎn)擊希望去的界面時，就會自動的鏈接到用戶希望的那個網(wǎng)頁。展現(xiàn)給用戶相應(yīng)的界面，在每個界面都會有這幾個選項(xiàng)卡，用戶可以在其中自由的切換。2、確定網(wǎng)站主題建立一個網(wǎng)站好比寫一篇文章，首先要擬好提綱，文章才能主題明確，層次清晰。如果網(wǎng)站結(jié)構(gòu)不清晰，目錄龐雜，內(nèi)容東一塊西一塊。結(jié)果不但瀏覽者看得糊涂，自己擴(kuò)充和維護(hù)網(wǎng)站也相當(dāng)困難。網(wǎng)站的題材確定后，并且收集和組織了許多相關(guān)的資料內(nèi)容，但如何組織內(nèi)容才能吸引網(wǎng)友們來瀏覽網(wǎng)站呢？欄目的實(shí)質(zhì)是一個網(wǎng)站的大綱索引，索引應(yīng)該將網(wǎng)站的主體明確顯示出來。3、確定網(wǎng)站形象網(wǎng)站形象的設(shè)計可以從網(wǎng)站的LOGO、網(wǎng)站的色彩、網(wǎng)站的字體宣傳語等這些方面著手。圖6-1Logo設(shè)計網(wǎng)站色彩，網(wǎng)站給人的第一印象來自于視覺的沖擊，不同的色彩搭配會產(chǎn)生不同的效果，并可能影響到訪問者的情緒?！皹?biāo)準(zhǔn)色彩”指的是能體現(xiàn)網(wǎng)站形象和延伸內(nèi)涵的色彩，給人們一種以整體統(tǒng)一的感覺。我個人網(wǎng)站的色彩是以橙色為主，黑色的字體和淺色的圖像給人一種舒服的感覺，仿佛生活在虛幻的世界里。網(wǎng)站字體，和標(biāo)準(zhǔn)色彩一樣，標(biāo)準(zhǔn)字體是指用于標(biāo)題、主菜單的一些特有字體。為了體現(xiàn)網(wǎng)站所特有的風(fēng)格，可以根據(jù)自已的網(wǎng)站所表達(dá)的內(nèi)涵，選擇更貼切的字體。我的個人網(wǎng)站的標(biāo)準(zhǔn)字體是華文彩體。給人一種沉穩(wěn)而不失俏皮的感覺。表格布局的過程：設(shè)計出框架為800*1000的布局表格，再在表格中添加適當(dāng)?shù)膯卧矜溄釉O(shè)計制作的過程：主頁與五個子頁進(jìn)行連接圖片處理的過程：單元格設(shè)定好，圖片大小和單元格同等大小然后添加導(dǎo)航按鈕的設(shè)置等等4、確定網(wǎng)站風(fēng)格風(fēng)格是抽象的，指網(wǎng)站的整體形象給瀏覽者留下的綜合感受。這個“整體形象”包括網(wǎng)站的LOGO、網(wǎng)站的色彩、網(wǎng)站的字體、網(wǎng)站的標(biāo)語等許多因素。網(wǎng)站是可以平易近人的、生動活潑的，也可以是嚴(yán)肅專業(yè)的。但不管是在色彩、技術(shù)、文字、布局、還是交互方式上，只要能由此讓瀏覽者明確的看出這是你的網(wǎng)站所獨(dú)有的，這就形成了一種風(fēng)格。風(fēng)格是有人性的，它通過網(wǎng)站的色彩、技術(shù)、文字、布局、交互方式等可以綜合概括出一個網(wǎng)站的自己的個性；我的網(wǎng)站風(fēng)格是以舒服為主，給人一種舒舒服服的感覺。5、確定網(wǎng)站內(nèi)容同城旅游網(wǎng)站主要是運(yùn)用電子商務(wù)，一是為了用網(wǎng)絡(luò)這一手段對公司進(jìn)行宣傳，提高公司的整體形象，二是為了進(jìn)一步開拓業(yè)務(wù)市場，是不同地域的客戶能通過本網(wǎng)站非常簡單、方便地選購公司的不同商品。網(wǎng)站整體設(shè)計注重實(shí)用性與觀賞性的結(jié)合，側(cè)重實(shí)用性，突出新穎、簡單的特點(diǎn)。一個功能基本完善的公司網(wǎng)站應(yīng)是完全控件式的頁面布局，使得信息的錄入工作更簡便。對新聞，產(chǎn)品的錄入、修改、刪除等操作，都將立即在主頁的對應(yīng)欄目顯示出來，實(shí)現(xiàn)“即時發(fā)布、即時見效”。所以至少應(yīng)該具有以下的幾個網(wǎng)站功能模塊：企業(yè)信息管理企業(yè)信息主要包括公司簡介、組織結(jié)構(gòu)、公司文化、榮譽(yù)、精神理念。客戶可以瀏覽這些信息，管理員則可以通過后臺管理系統(tǒng)，及時的更新企業(yè)信息。跟團(tuán)游、自助查詢展示，特賣模塊客戶可以通過產(chǎn)品展示了解產(chǎn)品信息，并對有意向的產(chǎn)品填寫需求?？蛻艨梢酝ㄟ^產(chǎn)品展示了解產(chǎn)品信息，快速的查找旅游的信息，并挑選喜歡的酒店，將主要的打折產(chǎn)品展示在頁面中，方便顧客更好的挑選，滿足顧客的需求。服務(wù)營銷網(wǎng)絡(luò)、客服中心、誠邀加盟這幾個模塊主要用于宣傳公司企業(yè)文化、樹立形象一級方便客戶與公司聯(lián)系這幾方面。七、主要頁面的詳細(xì)設(shè)計圖八、網(wǎng)站測試1、測試準(zhǔn)備測試前對被測系統(tǒng)做好以下準(zhǔn)備：系統(tǒng)的全面?zhèn)浞?，包括?yīng)用程序備份、數(shù)據(jù)備份等；記錄測試前系統(tǒng)狀態(tài)；制定應(yīng)急措施，確保在測試中發(fā)生問題時系統(tǒng)可恢復(fù)。測試員應(yīng)在測試開始前了解網(wǎng)頁的相關(guān)情況，對測試的預(yù)期結(jié)果應(yīng)進(jìn)行準(zhǔn)備和預(yù)測。測試前要做好真實(shí)數(shù)據(jù)的準(zhǔn)備工作，并進(jìn)行系統(tǒng)的數(shù)據(jù)初始化。2、用戶界面測試主要測試導(dǎo)航條、內(nèi)容、顏色、背景、圖像、返回等。3、功能測試主要測試站點(diǎn)中的鏈接等。鏈接測試：目的是檢查各個URL所聯(lián)接的頁面是否正確。表單測試：目的是檢查每個表單與程序是否正確聯(lián)接，能夠正確地發(fā)送用戶請求。4、兼容性測試主要檢驗(yàn)應(yīng)用能否在不同的客戶端使用。如蘋果（iOS系統(tǒng)的）用戶，經(jīng)常使用chrome，F(xiàn)irefox等瀏覽器的用戶是否都能正常使用。九、網(wǎng)站推廣與維護(hù)1.網(wǎng)站推廣（1）微信公眾平臺、朋友圈、微博、QQ空間推廣（2）論壇推廣我們可以注冊幾十個論壇，每個論壇注冊若干個帳號，把簽名設(shè)為自己的網(wǎng)站及團(tuán)隊圖標(biāo)。發(fā)表熱門內(nèi)容，自己頂自己的帖子。目前我們應(yīng)用的論壇包括校內(nèi)的極速之星、外網(wǎng)的百度貼吧、天涯論壇、豆瓣等等網(wǎng)民較為聚集的地方。（3）電子郵件推廣我們會像宜家一樣讓用戶進(jìn)行自愿注冊會員，瀏覽者自愿留下他的郵箱地址，定期或不定期的發(fā)布一些電子刊物、會員通訊、專業(yè)服務(wù)商的電子郵件廣告等。可以減少廣告對用戶的滋擾、增加潛在吸引人群定位的準(zhǔn)確