旅游網(wǎng)站設(shè)計(jì)正文(共26頁)_第1頁
旅游網(wǎng)站設(shè)計(jì)正文(共26頁)_第2頁
旅游網(wǎng)站設(shè)計(jì)正文(共26頁)_第3頁
旅游網(wǎng)站設(shè)計(jì)正文(共26頁)_第4頁
旅游網(wǎng)站設(shè)計(jì)正文(共26頁)_第5頁
已閱讀5頁,還剩21頁未讀, 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

1、精選優(yōu)質(zhì)文檔-傾情為你奉上旅游網(wǎng)站設(shè)計(jì)與建立鑫鑫旅行網(wǎng)系 別: 專 業(yè): 年 級(jí): 姓 名: 指導(dǎo)教師: 摘 要本文就旅游網(wǎng)站的設(shè)計(jì)與建立,以軟件工程的方法對(duì)全過程進(jìn)行了分析與研究,本文的主要工作集中在: 1.對(duì)WEB頁進(jìn)行概述,主要是對(duì)旅游網(wǎng)站的歷史和發(fā)展作了回顧,并對(duì)WEB頁的定義和特性進(jìn)行闡述,并對(duì)網(wǎng)站設(shè)計(jì)過程中使用的工具和技術(shù)簡(jiǎn)單的介紹.2.對(duì)網(wǎng)站建設(shè)中提及的術(shù)語進(jìn)行簡(jiǎn)單解釋,并對(duì)網(wǎng)站的由來和發(fā)展進(jìn)行討論。3.對(duì)自己設(shè)計(jì)的網(wǎng)站從設(shè)計(jì)理念到制作的過程進(jìn)行詳細(xì)分析.4.使用Dreamweaver+Flash+photoshop 等軟件的設(shè)計(jì)方式進(jìn)行解析。5.就網(wǎng)站的設(shè)計(jì)與制作提出自己的觀點(diǎn)

2、以及建議。關(guān)鍵詞:網(wǎng)站;設(shè)計(jì)工具;設(shè)計(jì)方案;創(chuàng)意;風(fēng)格 引 言隨著Internet的蓬勃發(fā)展,人類已經(jīng)意識(shí)到了網(wǎng)絡(luò)的巨大用途。網(wǎng)絡(luò)的實(shí)時(shí)性、無區(qū)域性成為吸引全世界人類的巨大誘惑力。如今Internet國(guó)際互聯(lián)網(wǎng)已在我國(guó)普及,越來越多的社會(huì)團(tuán)體、企事業(yè)單位,在互聯(lián)網(wǎng)上建立自己的網(wǎng)站。社會(huì)的發(fā)展和科學(xué)的進(jìn)步,上網(wǎng)成為越來越多人們的選擇。隨著國(guó)民經(jīng)濟(jì)的發(fā)展,旅游業(yè)也迅速的發(fā)展起來,它增進(jìn)了中國(guó)人民同世界各國(guó)人民交往的友誼,而且促進(jìn)了中國(guó)的對(duì)外開放,開辟了新的就業(yè)門路,對(duì)于提高民族素質(zhì)等都有積極作用。因此我們應(yīng)大力發(fā)展旅游行業(yè),更應(yīng)該利用網(wǎng)絡(luò)這個(gè)傳播工具來擴(kuò)展它的影響力和傳播速度及范圍,來共享資源。網(wǎng)

3、絡(luò)發(fā)展前景無限,及早與網(wǎng)絡(luò)結(jié)合,與信息時(shí)代同步,與高科技匯合,定會(huì)給社會(huì)各行各業(yè)的發(fā)展注入新鮮的活力。站在網(wǎng)絡(luò)時(shí)代的前夜,我們清晰地聽到了網(wǎng)絡(luò)時(shí)代的宣言:誰掌握了網(wǎng)絡(luò),誰就掌握了未來。第1章 緒論1.1系統(tǒng)開發(fā)背景目前,隨著科技的發(fā)展,時(shí)代的進(jìn)步。傳統(tǒng)的地圖與廣告已經(jīng)遠(yuǎn)遠(yuǎn)不能滿足人們的信息需求,在當(dāng)今這個(gè)年代,人們更愿意的是從網(wǎng)絡(luò)獲得信息,快速而龐大的信息量是其他途徑所不能媲美的,而現(xiàn)代旅游網(wǎng)站的產(chǎn)生必定能給人們帶來無限的便捷,它是現(xiàn)代旅游人士所迫切需求的。自互聯(lián)網(wǎng)Internet成為一種革命性的大眾媒體以來,其發(fā)展速度之快令人驚嘆。 而作為世界最大朝陽產(chǎn)業(yè)的旅游,當(dāng)它與電子商務(wù)這一新興模式相

4、結(jié)合時(shí),其潛藏的商業(yè)價(jià)值表露無遺。根據(jù)CNN公布的數(shù)據(jù),全球旅游電子商務(wù)已連續(xù) 5 年以超過 350%的速度發(fā)展,1999年度全球電子商務(wù)銷售額突破1400億美元, 其中旅游電子商務(wù)銷售額突破270億美元,占全球電子商務(wù)銷售總額的1/5,占電子商務(wù)應(yīng)用的最大份額;5年前全球就約有超過17萬家旅游企業(yè)在網(wǎng)上開展旅游服務(wù),享受過旅游網(wǎng)站服務(wù)的超過8500萬人次。隨著中國(guó)經(jīng)濟(jì)的高速發(fā)展和國(guó)民收入的提高,以及旅游業(yè)自身的日漸發(fā)展成熟,越來越多的人在旅游時(shí)選擇了自助旅游的方式。據(jù)2004年中國(guó)國(guó)內(nèi)旅游抽樣調(diào)查,按旅游方式分組,傳統(tǒng)的由旅行社組織的出游人數(shù)僅占104,而各種形式的自助旅游則已經(jīng)成為現(xiàn)代旅游

5、業(yè)發(fā)展的主流趨勢(shì)。這樣,摒棄了跟團(tuán)旅游全程導(dǎo)游陪同的高度規(guī)范化模式,人們?cè)谧灾髀糜螞Q策過程中對(duì)旅游信息的需求也越來越迫切。與此同時(shí),近10年來網(wǎng)絡(luò)在中國(guó)蓬勃發(fā)展,從2001年來網(wǎng)民人數(shù)每年增長(zhǎng)均在2000萬左右,2006年6月已達(dá)123億。各地、各方踴躍投資建設(shè)旅游網(wǎng)站以實(shí)現(xiàn)旅游產(chǎn)業(yè)信息化,網(wǎng)絡(luò)也成為越來越多旅游者新的信息渠道甚至消費(fèi)方式。1.2旅游網(wǎng)站的歷史和發(fā)展我國(guó)旅游電子商務(wù)起步較晚,雖然在這些年取得了一定發(fā)展,但是由于電子商務(wù)的基礎(chǔ)薄弱,各項(xiàng)配套設(shè)施和相關(guān)法律制度還不健全,主要是在借鑒國(guó)外旅游電子商務(wù)發(fā)展的經(jīng)驗(yàn)和模式,在摸索中前進(jìn),經(jīng)歷了以下幾個(gè)階段:(1) 萌芽階段(19961998

6、):我國(guó)旅游網(wǎng)站的建設(shè)最早可以追溯到1996年。1997年由國(guó)旅總社參與投資的華夏旅游網(wǎng)的創(chuàng)辦是中國(guó)旅游電子商務(wù)預(yù)訂網(wǎng)興起的引人注目的先聲。此后,各類旅游預(yù)訂網(wǎng)站如雨后春筍紛紛建立,行業(yè)規(guī)模逐漸擴(kuò)大。(2) 起步階段(19992002):1999年5月,攜程旅行網(wǎng)(簡(jiǎn)稱攜程)成立,可以說是這一階段的一個(gè)標(biāo)志。攜程是一家吸納海外風(fēng)險(xiǎn)投資組建的旅行服務(wù)公司,在當(dāng)時(shí)被稱為一個(gè)“沒有門店的旅行社”,它將信息技術(shù)、現(xiàn)代運(yùn)作管理理念與傳統(tǒng)旅游業(yè)相結(jié)合,打造了具有極強(qiáng)競(jìng)爭(zhēng)力的服務(wù)價(jià)值鏈,形成了全新的服務(wù)和業(yè)務(wù)模式。這種全新的模式和理念,拓展了旅游電子商務(wù)的發(fā)展模式,適應(yīng)了旅游業(yè)的發(fā)展要求,對(duì)旅游業(yè)的發(fā)展起了

7、巨大的推動(dòng)作用。(3) 發(fā)展階段(20032004):該階段以2003年攜程在美國(guó)納斯達(dá)克成功上市為標(biāo)志,當(dāng)時(shí)也是互聯(lián)網(wǎng)全面復(fù)蘇的時(shí)期。在這個(gè)階段中,中國(guó)旅游電子商務(wù)市場(chǎng)還處于探索和摸索的階段,攜程上市客觀上加速了我國(guó)旅游電子商務(wù)市場(chǎng)服務(wù)水平的提升。(4) 完善階段(20052008):2005年我國(guó)第三方支付平臺(tái)支付寶的出現(xiàn),為解決網(wǎng)上支付這一瓶頸問題,提供了非常好的解決方案,更重要的是為消費(fèi)者建立了網(wǎng)上支付的信心,旅游電子商務(wù)也開啟在線交易的新紀(jì)元,特別是對(duì)于機(jī)票產(chǎn)品,越來越多的實(shí)現(xiàn)了在線支付。(5) 新探索階段(2009至今):2009年1月,千橡互動(dòng)以1850萬美元收購e龍5,283,

8、202股流通股,占后者總流通股本的23.7%。千橡互動(dòng)收購e龍這一事件表明,在中國(guó)旅游電子商務(wù)市場(chǎng)日益發(fā)展的前提下,web 2.0應(yīng)用逐漸在探索與旅游業(yè)結(jié)合的有效模式,未來在盈利模式方面需要形成具有中國(guó)特色的突破點(diǎn)。1.3鑫鑫旅行網(wǎng)網(wǎng)站概述主要建立一個(gè)完整的旅游網(wǎng)站,突出旅游特點(diǎn),有美觀的界面設(shè)計(jì)。各景點(diǎn)相關(guān)酒店預(yù)訂、各個(gè)景點(diǎn)路程與旅游方式的設(shè)計(jì)與查詢、對(duì)個(gè)景點(diǎn)所需費(fèi)用查詢。 有一定數(shù)量旅游景點(diǎn)信息可供處理。網(wǎng)站的信息咨詢平臺(tái)可以成為一個(gè)瀏覽者、客戶與旅游網(wǎng)站之間互動(dòng)的流程、渠道。系統(tǒng)主要功能:1.用戶功能模塊:實(shí)現(xiàn)的主要功能包括新用戶注冊(cè)、老用戶登陸。2.信息檢索模塊:該模塊主要是方便用戶對(duì)

9、本站景點(diǎn)和酒店進(jìn)行相關(guān)檢索。3.留言模塊:該模塊中用戶可以發(fā)表自己的看法也可瀏覽其他用戶的留言。4.酒店預(yù)定:該功能模塊主要是客戶瀏覽了相關(guān)資料后,可通過本模塊的下拉一個(gè)預(yù)定定單。將個(gè)人信息及預(yù)定的酒店填寫完整后提交表單。5.信息瀏覽:實(shí)現(xiàn)的主要功能包括查看站內(nèi)公告、點(diǎn)擊景點(diǎn),酒店等的信息。第2章 開發(fā)工具及主要開發(fā)技術(shù)簡(jiǎn)介2.1 Dreamweaver簡(jiǎn)介是美國(guó)MACROMEDIA公司開發(fā)的集和管理網(wǎng)站于一身的所見即所得網(wǎng)頁編輯器,它是第一套針對(duì)專業(yè)網(wǎng)頁設(shè)計(jì)師特別發(fā)展的視覺化網(wǎng)頁開發(fā)工具,利用它可以輕而易舉地制作出跨越平臺(tái)限制和跨越瀏覽器限制的充滿動(dòng)感的網(wǎng)頁。Dreamweaver是在網(wǎng)頁設(shè)

10、計(jì)與制作領(lǐng)域中用戶最多、應(yīng)用最廣、功能最強(qiáng)大的軟件,隨著Dreamweaver 8的發(fā)布,更堅(jiān)定Dreamweaver在該領(lǐng)域的地位。它集網(wǎng)頁設(shè)計(jì)、網(wǎng)站開發(fā)和站點(diǎn)管理功能于一身,具有可視化、支持多平臺(tái)和跨瀏覽器的特性,是目前網(wǎng)站設(shè)計(jì)、開發(fā)、制作的首選工具。DREAMWEAVER特點(diǎn):1、靈活的編寫方式Dreamweaver具有靈活編寫網(wǎng)頁的特點(diǎn),不但將世界一流水平的“設(shè)計(jì)”和“代碼”編輯器合二為一,而且在設(shè)計(jì)窗口中還精化了源代碼,能幫助用戶按工作需要定制自己的用戶界面。2、可視化編輯界面Dreamweaver是一種所見即所得的HTML編輯器,可實(shí)現(xiàn)頁面元素的插入和生成??梢暬庉嫮h(huán)境大量減少了

11、代碼的編寫,同時(shí)亦保證了其專業(yè)性和兼容性,并且可以對(duì)內(nèi)部的HTML編輯器和任何第三方的HTML編輯器進(jìn)行實(shí)時(shí)的訪問。無論用戶習(xí)慣手工輸入HTML源代碼還是使用可視化的編輯界面,Dreamweaver都能提供便捷的方式使用戶設(shè)計(jì)網(wǎng)頁和管理網(wǎng)站變得更容易。3、功能更多的CSS支持CSS可視化設(shè)計(jì)、CSS檢查工具4、動(dòng)態(tài)跨瀏覽器驗(yàn)證當(dāng)保存時(shí)系統(tǒng)自動(dòng)檢查當(dāng)前文檔的跨瀏覽器有效性,可以指定何種瀏覽器為測(cè)試用瀏覽器,同時(shí)系統(tǒng)自動(dòng)檢驗(yàn)以確定頁面有沒有目標(biāo)瀏覽器不支持的tags或CSS結(jié)構(gòu)。動(dòng)態(tài)跨瀏覽器有效性檢查功能可以自動(dòng)核對(duì)tags和CSS規(guī)則是否適應(yīng)目前的主瀏覽器。5、強(qiáng)大的WEB站點(diǎn)管理功能6、內(nèi)建的

12、圖形編輯引擎7、Dreamweaver的集成特性Dreamweaver 8繼承了Fireworks、Flash和Shockwave的集成特性,可以在這些Web創(chuàng)作工具之間自由地切換,輕松地創(chuàng)建美觀實(shí)用的網(wǎng)頁。8、豐富的媒體支持能力可以方便地加入Java、Flash、Shockwave、ActiveX以及其他媒體。Dreamweaver具有強(qiáng)大的多媒體處理功能,在設(shè)計(jì)DHTML和CSS方面表現(xiàn)得極為出色,它利用JavaScript和DHTML語言代碼輕松地實(shí)現(xiàn)網(wǎng)頁元素的動(dòng)作和交互操作。Dreamweaver還提供行為和時(shí)間線兩種控件來產(chǎn)生交互式響應(yīng)和進(jìn)行動(dòng)畫處理。9、超強(qiáng)的擴(kuò)展能力Dreamwe

13、aver還支持第三方插件,任何人都可以根據(jù)自己的需要擴(kuò)Dreamweaver的功能,并且可以發(fā)布這些插件。2.2 簡(jiǎn)介Adobe 是一個(gè)由Adobe Systems出品的專業(yè)圖像處理軟件。與該公司的其它軟件一樣,Photoshop適用于Mac OS及Microsoft Windows兩個(gè)操作系統(tǒng),同時(shí)公司也發(fā)布了Unix操作系統(tǒng)上的版本。Google也正在透過Wine資助Linux版Photoshop的研究。Photoshop最初是由托馬斯·諾爾(Thomas Knoll)和約翰·諾爾(John Knoll)這對(duì)兄弟于1987年制作的,但直到1990年后,這個(gè)軟件才由Ado

14、be公司首次發(fā)布。Photoshop最初用于處理那些在當(dāng)時(shí)價(jià)格不菲的掃描下來的圖像。特性:Photoshop主要處理以像素(Pixels)所構(gòu)成的數(shù)字圖像。利用其廣泛的編修與繪圖工具,可以更有效的進(jìn)行圖片編輯工作。獨(dú)特的歷史紀(jì)錄浮動(dòng)視窗和可編輯的圖層效果功能使用戶可以方便的測(cè)試效果。對(duì)各種的支持更令使用者能夠輕松創(chuàng)造出各種奇幻的效果。目前,Photoshop也正在被更多的用于處理圖片。Photoshop的幾個(gè)后續(xù)版本中捆綁了一個(gè)獨(dú)立的軟件ImageReady,加強(qiáng)了Photoshop對(duì)網(wǎng)絡(luò)圖像(主要是GIF圖像文件)的支持功能。而在CS3中ImageReady被Fireworks所代替。Pho

15、toshop CS3允許用戶更容易升級(jí)到最新的硬件平臺(tái),支持蘋果的Intel為內(nèi)核的系統(tǒng)。Photoshop被人們認(rèn)為是最好的圖像處理軟件,但與著名的3D Studio Max一樣,昂貴的價(jià)格使其難以普及。這也令Jasc Software公司的Paint Shop Pro,GIMP小組的GIMP和友立信息的Ulead PhotoImpact占領(lǐng)了相當(dāng)?shù)氖袌?chǎng)份額。為了爭(zhēng)奪市場(chǎng),Adobe發(fā)布了一個(gè)Photoshop的簡(jiǎn)易版本Photoshop Elements。雖然它對(duì)很多功能都作了限定,但繼承了原軟件的多數(shù)優(yōu)秀功能,價(jià)格比Photoshop便宜不少。2.3 Adobe Flash 簡(jiǎn)介Adob

16、e Flash,前稱Macromedia Flash,簡(jiǎn)稱Flash,前身FutureSplash,既指Adobe Flash Professional創(chuàng)作程序,也指Adobe 。自從Macromedia公司于2005年12月3日被Adobe公司收購,F(xiàn)lash也就成為了Adobe旗下的軟件。1、flash特性:(1)被大量應(yīng)用于因特網(wǎng)網(wǎng)頁的矢量文件格式。(2)使用矢量圖形(Vector Graphics)的方式,產(chǎn)生出來的影片占用存儲(chǔ)空間較小。(3)使用Flash創(chuàng)作出的影片有自己的特殊文件格式(swf)(4)該公司聲稱全世界97%的網(wǎng)絡(luò)都內(nèi)置(Flash Player)(5)是Adobe提

17、出的“富因特網(wǎng)應(yīng)用”(RIA)概念的實(shí)現(xiàn)平臺(tái)(6)Flash6之后版本納入面向?qū)ο蟪绦蚋拍?。與其他語言比較,不論是在、XML、PHP等各種平臺(tái)上,都能更進(jìn)一步的相互結(jié)合應(yīng)用。(7)從用戶體驗(yàn)的角度,是目前最好的前端技術(shù)。2、主要文件格式:(1)swf是Shockwave Flash的縮寫,這是一個(gè)完整的影片檔,無法被編輯。有時(shí)會(huì)被念作“swiff”或“swaif”。SWF在發(fā)布時(shí)可以選擇保護(hù)功能,如果沒有選擇,很容易被別人輸入到他的源文件中使用。然而保護(hù)功能依然阻擋不了為數(shù)眾多的破解軟件,有不少閃客專門以此來學(xué)習(xí)別人的代碼和方式。(2)flaFlash的源文件,只能用Adobe Flash打開

18、編輯。2.4 HTML語言簡(jiǎn)介HTML(Hyper Text Markup Language 超文本置標(biāo)語言)是一種用來制作超文本文檔的簡(jiǎn)單標(biāo)記語言。用HTML編寫的超文本文檔稱為HTML文檔,它能獨(dú)立于各種操作系統(tǒng)平臺(tái)(如UNIX,WINDOWS等)。自1990年以來HTML就一直被用作World Wide Web上的信息表示語言,用于描述Homepage的格式設(shè)計(jì)和它與WWW上其它Homepage的連結(jié)信息。HTML文檔(即Homepage的源文件)是一個(gè)放置了標(biāo)記的ASCII文本文件,通常它帶有.html或.htm的文件擴(kuò)展名。生成一個(gè)HTML文檔主要有以下三種途徑:1、手工直接編寫(例

19、如用你所喜愛的ASCII文本編輯器或其它HTML的編輯工具)。2、通過某些格式轉(zhuǎn)換工具將現(xiàn)有的其它格式文檔(如WORD文檔)轉(zhuǎn)換成HTML文檔。3、由Web服務(wù)器(或稱HTTP 服務(wù)器)一方實(shí)時(shí)動(dòng)態(tài)地生成。HTML語言是通過利用各種標(biāo)記(tags)來標(biāo)識(shí)文檔的結(jié)構(gòu)以及標(biāo)識(shí)超鏈(Hyperlink)的信息。雖然HTML語言描述了文檔的結(jié)構(gòu)格式,但并不能精確地定義文檔信息必須如何顯示和排列,而只是建議Web瀏覽器(如Mosiac,Netscape等)應(yīng)該如何顯示和排列這些信息,最終在用戶面前的顯示結(jié)果取決于Web瀏覽器本身的顯示風(fēng)格及其對(duì)標(biāo)記的解釋能力。這就是為什么同一文檔在不同的瀏覽器中展示的效

20、果會(huì)不一樣。目前HTML語言的版本是2.0,它是基于SGML(Standard Generalized Markup Language)標(biāo)準(zhǔn)廣義置標(biāo)語言,是一套用來描述數(shù)字化文檔的結(jié)構(gòu)并管理其內(nèi)容的復(fù)雜的規(guī)范)中的一個(gè)子集演變而來的。雖然下一版本的標(biāo)準(zhǔn)HTML3.0(也稱為HTML+)正在制訂之中,但其中某些部分的實(shí)驗(yàn)性標(biāo)準(zhǔn)草案已被廣泛采用,大多優(yōu)秀的Web瀏覽器(如Netscape等)都能解釋HTML3.0中的部分新標(biāo)記,因此在本章中介紹的一些HTML3.0新標(biāo)記均已被多數(shù)瀏覽器所接受。2.5 ASP介紹ASP是Microsoft公司開發(fā)的Web服務(wù)器端腳本開發(fā)環(huán)境,利用它可以生成動(dòng)態(tài)、高效

21、的web應(yīng)用程序。ASP為VB Script和java script等腳本語言提供了一個(gè)運(yùn)行環(huán)境,使開發(fā)人員可以在HTML代碼中使用腳本語言編寫程序。同時(shí),ASP自身也提供了一些很好的命令和內(nèi)置對(duì)象。ASP 內(nèi)含于 IIS 3.0 和 4.0 之中 , 通過 ASP 我們可以結(jié)合 HTML 網(wǎng)頁、 ASP 指令和 ActiveX 元件建立動(dòng)態(tài)、交互且高效的 WEB 服務(wù)器應(yīng)用程序。ASP所有的程序都將在服務(wù)器端執(zhí)行,包括所有嵌在普通 HTML 中的腳本程序。當(dāng)程序執(zhí)行完畢后,服務(wù)器僅將執(zhí)行的結(jié)果返回給客戶瀏覽器,這樣也就減輕了客戶端瀏覽器的負(fù)擔(dān),大大提高了交互的速度。 以下羅列了 Active

22、 Server Pages 所獨(dú)具的一些特點(diǎn): 1、使用 VBScript 、 JavaScript 等簡(jiǎn)單易懂的腳本語言,結(jié)合 HTML 代碼,即可快速地完成網(wǎng)站的應(yīng)用程序。 2、無須 compile 編譯,容易編寫,可在服務(wù)器端直接執(zhí)行。 3、使用普通的文本編輯器,如 Windows 的記事本,即可進(jìn)行編輯設(shè)計(jì)。 4、與瀏覽器無關(guān) (Browser Independence), 用戶端只要使用可執(zhí)行 HTML 碼的瀏覽器,即可瀏覽 Active Server Pages 所設(shè)計(jì)的網(wǎng)頁內(nèi)容。 Active Server Pages 所使用的腳本語言 (VBScript 、 Jscript)

23、均在 WEB 服務(wù)器端執(zhí)行,用戶端的瀏覽器不需要能夠執(zhí)行這些腳本語言。 5、Active Server Pages 能與任何 ActiveX scripting 語言相容。2.6 CSS簡(jiǎn)介CSS(Cascading Style Sheet,可譯為“層疊樣式表”或“級(jí)聯(lián)樣式表”)是一組格式設(shè)置規(guī)則,用于控制Web頁面的外觀。通過使用CSS樣式設(shè)置頁面的格式,可將頁面的內(nèi)容與表現(xiàn)形式分離。頁面內(nèi)容存放在HTML文檔中,而用于定義表現(xiàn)形式的CSS規(guī)則則存放在另一個(gè)文件中或HTML文檔的某一部分,通常為文件頭部分。將內(nèi)容與表現(xiàn)形式分離,不僅可使維護(hù)站點(diǎn)的外觀更加容易,而且還可以使HTML文檔代碼更加

24、簡(jiǎn)練,縮短瀏覽器的加載時(shí)間。1.層疊式表的特點(diǎn):(1)便于頁面的修改。(2)便于頁面風(fēng)格的統(tǒng)一。(3)減少網(wǎng)頁的體積。2. 采用CSS布局相對(duì)于傳統(tǒng)的TABLE網(wǎng)頁布局而具有的優(yōu)勢(shì): (1)表現(xiàn)和內(nèi)容相分離:將設(shè)計(jì)部分剝離出來放在一個(gè)獨(dú)立樣式文件中,HTML文件中只存放文本信息。這樣的頁面對(duì)搜索引擎更加友好。 (2)提高頁面瀏覽速度:對(duì)于同一個(gè)頁面視覺效果,采用CSS布局的頁面容量要比TABLE編碼的頁面文件容量小得多,前者一般只有后者的1/2大小。瀏覽器就不用去編譯大量冗長(zhǎng)的標(biāo)簽。 (3)易于維護(hù)和改版:你只要簡(jiǎn)單的修改幾個(gè)CSS文件就可以重新設(shè)計(jì)整個(gè)網(wǎng)站的頁面。第3章 網(wǎng)站開發(fā)過程及實(shí)現(xiàn)流

25、程根據(jù)前面的設(shè)計(jì)思想進(jìn)行分析,按照系統(tǒng)開發(fā)的基本觀點(diǎn)對(duì)網(wǎng)站進(jìn)行分解,從內(nèi)容上可對(duì)網(wǎng)站作如下劃分:(1)首頁:提供旅游信息。(2)精選路線:提供旅游線路及相關(guān)的費(fèi)用。(3)酒店預(yù)訂:需要用戶提供個(gè)人信息以備預(yù)訂酒店。(4)汽車租車:提供各種型號(hào)的汽車,以方便自駕游的游客使用。(5)風(fēng)光相冊(cè):展示的是我們旅游線路地沿途風(fēng)光。(6)會(huì)員中心:包括新用戶注冊(cè)、老用戶登陸(7)關(guān)于我們:是對(duì)鑫鑫旅行網(wǎng)的簡(jiǎn)介。(8)留言板:該模塊主要是方便用戶和管理人員進(jìn)行溝通和交流,用戶可以發(fā)表自己的看法也可瀏覽其他用戶的留言。3.2主頁設(shè)計(jì)主界面是一個(gè)網(wǎng)站的門面,如同公司的形象,特別注重設(shè)計(jì)和規(guī)劃。它是用戶首先見到的

26、界面,它的好壞直接影響到網(wǎng)站的訪問率。為此,我從以下幾個(gè)方面對(duì)主界面進(jìn)行了設(shè)計(jì)。1、在色彩搭配上,我用一種較明快的色彩為基調(diào),配以相關(guān)的其他色彩,給用戶一種鮮而不艷的美感。2、在字體選用上,大小適當(dāng),盡量使用常用字體,適當(dāng)配用藝術(shù)字。3、在網(wǎng)頁制作上,采用表格劃分區(qū)域的手法,方便文字和圖片的插入。4、在內(nèi)容上,主界面內(nèi)容充實(shí)而不繁雜,既體現(xiàn)本站特色,又能滿足用戶需要。5、在用戶操作上,簡(jiǎn)化用戶操作,刪去那些空洞的環(huán)節(jié)。例如,“用戶注冊(cè)”只須填寫簡(jiǎn)單信息即可。在主頁的基礎(chǔ)上我把主頁中加入了可編輯區(qū)域,并另存為了模板。以后的頁面都是在模板的基礎(chǔ)上進(jìn)行制作的。使用模板功能有助于用戶設(shè)計(jì)出風(fēng)格一致的網(wǎng)

27、頁。通過模板來創(chuàng)建和更新網(wǎng)頁,不僅可以大大提高工作的效率,而且維護(hù)網(wǎng)站也會(huì)變得更加輕松。鑫鑫旅行網(wǎng)首頁如下圖3-1:圖3-1:鑫鑫旅行網(wǎng)首頁3.3系統(tǒng)功能模塊設(shè)計(jì)根據(jù)需求分析的結(jié)果,按照“低耦合、高內(nèi)聚”的原則,本系統(tǒng)將劃分為以下主要功能模塊:用戶功能模塊;景點(diǎn)信息瀏覽功能模塊;酒店預(yù)訂/酒店信息查詢功能模塊;在線留言功能模塊。網(wǎng)站功能模塊圖如下圖3-2: 網(wǎng)站簡(jiǎn)介鑫鑫旅行網(wǎng)用戶留言精選路線酒店預(yù)訂汽車租車會(huì)員中心風(fēng)光相冊(cè)關(guān)于我們首頁留言板瀏覽留言新用戶注冊(cè)老用戶登陸酒店預(yù)訂酒店查詢信息提供旅游線路及收費(fèi)自駕游供車旅游路上沿途風(fēng)光圖3-2:網(wǎng)站功能模塊圖1.用戶功能模塊實(shí)現(xiàn)的主要功能包括新用戶

28、注冊(cè)、老用戶登陸。(1)用戶注冊(cè)。新用戶首次訪問本站,必須注冊(cè)。(2)用戶登陸。已注冊(cè)用戶在訪問本站,必須先登陸后訪問。登陸時(shí)需輸入用戶名和密碼。主頁會(huì)員中心查看服務(wù)條款填寫、確認(rèn)用戶密碼注冊(cè)成功,返回 填寫用戶信息用戶注冊(cè)模塊流程圖如下圖3-3:圖3-3:用戶注冊(cè)模塊流程圖網(wǎng)站會(huì)員注冊(cè)頁面如下圖3-4:圖3-4:會(huì)員注冊(cè)頁面2.在線留言模塊該模塊主要是方便用戶和管理人員進(jìn)行溝通和交流,用戶可以發(fā)表自己的看法也可瀏覽其他用戶的留言。為了讓旅游部門掌握各方面的反饋信息,本系統(tǒng)設(shè)置了留言簿模塊。留言信息包括:留言的用戶、留言時(shí)間及留言內(nèi)容。(1)瀏覽留言:用戶登陸后可以查看以前的留言。(2)發(fā)表留

29、言:用戶必須填寫好完整的信息后才可以留言,在本模塊中我使用了ASP腳本語言,方便提醒用戶填寫完整信息內(nèi)容。在制作留言板模塊時(shí),為使整個(gè)頁面給人一種賞心悅目、條理清晰的感覺,我用到了CSS樣式表。在當(dāng)前網(wǎng)頁設(shè)計(jì)中的CSS是一個(gè)必不可少的插件,它彌補(bǔ)了HTML對(duì)網(wǎng)頁格式化功能的不足,簡(jiǎn)化了網(wǎng)頁的源代碼,避免了重復(fù)操作,減輕了工作量。CSS代碼查看附錄<Style.css>代碼在線留言模塊流程圖如下圖3-5:留言板留言/查看留言主頁查看留言填寫留言信息填寫留言信息顯示留言簽寫留言查看留言 留言返回 圖3-5:用戶留言模塊流程圖將CSS樣式表加到頁面中的方法:1、定義外部樣式塊對(duì)

30、象你可以在你的HTML文檔的<HTML>和<BODY>標(biāo)記之間插入一個(gè)<STYLE>.</STYLE>塊對(duì)象。 定義方式請(qǐng)參閱樣式表語法。示例如下:<html><head><title>文檔標(biāo)題</title><style type="text/css"><!-body font: 10pt "Arial"h1 font: 15pt/17pt "Arial" font-weight: bold; color: maroon

31、h2 font: 13pt/15pt "Arial" font-weight: bold; color: bluep font: 10pt/12pt "Arial" color: black-></style></head><body>正文內(nèi)容</body></html>請(qǐng)注意,這里將style對(duì)象的type屬性設(shè)置為"text/css",是允許不支持這類型的瀏覽器忽略樣式表單。2、內(nèi)聯(lián)定義 (Inline Styles)內(nèi)聯(lián)定義即是在對(duì)象的標(biāo)記內(nèi)使用對(duì)象的style屬

32、性定義適用其的樣式表屬性。示例如下:<p style="color: sienna; margin-left: 20px">This is a paragraph</p>3、導(dǎo)入樣式(Import Styles)與鏈入外部樣式的功能基本相同,只是語法和實(shí)現(xiàn)方式上有差別<head><title>文檔標(biāo)題</title><style> import url(css.css);import url("css.css") ;/單引號(hào)也可以import css.css;import "

33、;css.css"/單引號(hào)也可以</style></head>以上幾種形式都可以。網(wǎng)站簽寫留言頁面如下圖3-6:圖3-6:簽寫留言頁面3.酒店預(yù)定該功能模塊主要是客戶瀏覽了相關(guān)資料后,可通過本模塊預(yù)定酒店定單。本模塊我也使用了ASP腳本語言,用戶必須將個(gè)人信息及預(yù)定的酒店填寫完整后,才能進(jìn)行預(yù)訂。在制作酒店預(yù)訂模塊時(shí)我添加了表單,運(yùn)用了大量的文本區(qū)域、下拉列表、單選按鈕、按鈕等,建立了一個(gè)較為詳細(xì)的酒店預(yù)訂表。酒店預(yù)定功能流程圖如下圖3-7:主頁酒店預(yù)定填寫預(yù)定信息檢查信息是否正確并提交返回圖3-7:用戶酒店預(yù)定模塊流程圖網(wǎng)站酒店預(yù)定頁面如下圖3-8:圖3-8

34、:酒店預(yù)定頁面5.信息瀏覽實(shí)現(xiàn)的主要功能包括查看站內(nèi)公告(最新公告及近期的所有公告)、點(diǎn)擊景點(diǎn),酒店,旅行社的信息,并且可以進(jìn)行查詢功能。(1)旅游新聞。通過“公告欄”可了解本站的最新信息,并可查看本站的近期的所有公告內(nèi)容。(2)景點(diǎn)信息。通過景點(diǎn)頁面進(jìn)行各個(gè)景點(diǎn)的信息瀏覽和查詢。(3)酒店信息。通過景點(diǎn)頁面進(jìn)行各個(gè)酒店的信息瀏覽和查詢。(4)聯(lián)系我們。通過簡(jiǎn)介讓用戶更加了解鑫鑫旅行網(wǎng)。第4章 結(jié) 論在做畢業(yè)設(shè)計(jì)之前,我對(duì)旅游網(wǎng)站系統(tǒng)的理解,是停留在感官和理論水平上的,是“紙上談兵”,缺乏實(shí)際的軟件開發(fā)經(jīng)驗(yàn)。這次通過做畢業(yè)設(shè)計(jì),完成了旅游網(wǎng)站系統(tǒng)的開發(fā)任務(wù)。在整個(gè)開發(fā)過程中,遇到了很多問題,但

35、“功夫不負(fù)有心人”,最終,問題都被一一解決了。對(duì)其中比較深刻的幾點(diǎn)體會(huì)總結(jié)如下:1.剛開始時(shí),我對(duì)旅游網(wǎng)站系統(tǒng)的認(rèn)知很膚淺,對(duì)其工作原理,實(shí)現(xiàn)的方式,開發(fā)的原則和方法,沒有一個(gè)明確、清楚的概念和思路。在指導(dǎo)老師的推薦下,我查閱了很多相關(guān)資料和文章,如ASP入門與提高、網(wǎng)絡(luò)程序設(shè)計(jì)ASP等。2.完成從“大而全”到“小而精”的轉(zhuǎn)變。當(dāng)我確定了做該課題,開始進(jìn)行系統(tǒng)分析、設(shè)計(jì)時(shí),總是想把系統(tǒng)的每一個(gè)細(xì)節(jié)都在程序上體現(xiàn)出來,結(jié)果使我感到工作了太大、力不從心,感到無從下手。后來經(jīng)過指導(dǎo)老師指點(diǎn)迷津,和自己的思考,抓住了本系統(tǒng)的主要功能,確定了軟件開發(fā)的方向,使畢業(yè)設(shè)計(jì)工作得以順利進(jìn)行下去。在此次設(shè)計(jì)過程

36、中我也遇到了不少的困難,也從中感受到了自己學(xué)的知識(shí)深度還不夠,只停留在表面,沒有真正深入下去。在設(shè)計(jì)主頁時(shí)就遇到了很多麻煩,首先就是要對(duì)界面結(jié)構(gòu)的設(shè)計(jì),怎樣的界面才能吸引讀者的眼球呢?這是我們所要考慮的第一要素,再接著就是對(duì)網(wǎng)站內(nèi)容的充實(shí)和擴(kuò)充,來增加網(wǎng)站的可讀性。雖然做一個(gè)網(wǎng)站沒有做一張網(wǎng)頁那么容易,但是在這個(gè)過程中我把所遇到的問題通過問同學(xué)、問老師和自己找資料看一點(diǎn)一點(diǎn)的解決了,這也是很有成就感,很愉快的一件事。總之,經(jīng)過幾個(gè)月的努力,最終完成了旅游網(wǎng)站系統(tǒng)的設(shè)計(jì)與建立,完成了論文的寫作。在這過程中,體驗(yàn)了其中的苦與樂,學(xué)會(huì)了如何面臨困難,如何解決問題,學(xué)會(huì)了團(tuán)結(jié)合作,達(dá)到了鍛煉的目的。同

37、時(shí),拓展了知識(shí)面,進(jìn)一步加深了對(duì)Dreamweaver、Flash、photoshop軟件的理解和認(rèn)識(shí)。參考文獻(xiàn)1 方春明,馬路. Dreamweaver MX 2004 精彩設(shè)計(jì)百例M. 北京:中國(guó)水利水電出版社, 2004.2 尚俊杰. 網(wǎng)絡(luò)程序設(shè)計(jì)ASP(第二版)M. 北京:清華大學(xué)出版社、北方交通大學(xué)出版社, 2002. 3 安雪梅. Adobe Photoshop CS 完全征服手冊(cè)M. 北京:中國(guó)青年出版社, 2004.4 鮑嘉,盧堅(jiān). Dreamweaver MX 2004完美網(wǎng)頁設(shè)計(jì)綜合實(shí)例篇M. 北京:中國(guó)青年出版社, 2005.5 戴斌.旅行社經(jīng)營(yíng)管理J.旅游教育出版社,

38、2005.6 薛華成.管理信息系統(tǒng)J.清華大學(xué)出版社, 2001.AbstractIn this paper, the design and establishment of tourist sites, a software engineering approach to the whole process of analysis and research, this paper mainly focused on: 1 Overview of WEB pages, mainly on the history and development of tourism websites were

39、reviewed, and the WEB page describes the definition and characteristics, and website design tools and techniques used in brief. 2 Building on the site mentioned in a simple explanation of terms, and the origin and development of the site discussed. 3 On the website of their own design from design co

40、ncept to the process of making a detailed analysis. 4 Using Dreamweaver + Flash + photoshop software such as the design approach for resolution. 5 On the website design and production put forward their views and recommendationsKey words: the site; Design tools; Design project; Creative; style致 謝近三個(gè)月

41、時(shí)間的畢業(yè)課題設(shè)計(jì)是我大學(xué)生活中忙碌而又充實(shí)一段時(shí)光。這里有治學(xué)嚴(yán)謹(jǐn)而又親切的老師,有互相幫助的同學(xué),更有積極、向上、融洽的學(xué)習(xí)生活氛圍。短短的時(shí)間里,我學(xué)到了很多的東西。不僅學(xué)到就更多的理論知識(shí),擴(kuò)展了知識(shí)面,提高了自己的實(shí)際操作能力;而且學(xué)會(huì)了如何去學(xué)習(xí)新的知識(shí),學(xué)會(huì)了面對(duì)困難和挑戰(zhàn),學(xué)會(huì)了團(tuán)結(jié)合作,互助互利。借此論文之際,向所有幫助、關(guān)心、支持我的老師、朋友同學(xué),表達(dá)我最真誠(chéng)的謝意。首先感謝指導(dǎo)老師。本論文是在老師耐心指導(dǎo)下多次修改完成的。在此,我對(duì)老師的耐心指導(dǎo)和幫助表達(dá)我最真誠(chéng)的謝意,感謝老師在這幾個(gè)月來所付出的努力。在這段時(shí)間里,我從老師身上,不僅學(xué)到了許多的專業(yè)知識(shí),更感受到了她

42、工作中的兢兢業(yè)業(yè),生活中的平易近人的精神。此外,她的嚴(yán)謹(jǐn)治學(xué)態(tài)度和忘我的工作精神值得我去學(xué)習(xí)。在此,請(qǐng)?jiān)试S我對(duì)說一聲:“老師,您辛苦了!”再次感謝您。非常感謝我的同學(xué)。當(dāng)我在畢業(yè)設(shè)計(jì)過程中遇到問題和困難時(shí),是他們給我提出許多關(guān)鍵性的意見和建議,使我對(duì)整個(gè)畢業(yè)設(shè)計(jì)的思路有了總體的把握,并耐心的幫我解決了許多實(shí)際問題,使我獲益良多。同時(shí),感謝三年來傳授我知識(shí)的老師們,更要感謝我的家人及朋友對(duì)我學(xué)業(yè)上的支持和鼓勵(lì),感謝所有關(guān)心、幫助過我的人??傊谝院蟮膶W(xué)習(xí)、工作、生活中我將更加努力,用自己的行動(dòng)回報(bào)社會(huì)、學(xué)校、老師及同學(xué)。附 錄<Style.css>代碼TD FONT-SIZE: 1

43、2px; TEXT-DECORATION: none.b BORDER-RIGHT: #a04310 1px solid; BORDER-TOP: #a04310 1px solid; FONT-SIZE: 11px; BORDER-LEFT: #a04310 1px solid; BORDER-BOTTOM: #a04310 1px solid.white FONT-SIZE: 12px; COLOR: #ffffff; TEXT-DECORATION: none.white A:link FONT-SIZE: 12px; COLOR: #ffffff; TEXT-DECORATION: n

44、one.white A:visited FONT-SIZE: 12px; COLOR: #ffffff; TEXT-DECORATION: none.white A:hover FONT-SIZE: 12px; COLOR: #ff9900; TEXT-DECORATION: none.white A:active FONT-SIZE: 12px; COLOR: #ff0000; TEXT-DECORATION: none.filter1 FILTER: Glow(Color=ffffff, Strength=1).filter2 FILTER: Glow(Color=cc66ff, Stre

45、ngth=1).filter3 FILTER: Glow(Color=ffff00, Strength=1).filter4 FILTER: Glow(Color=#3349C6, Strength=1).filter5 FILTER: DropShadow(Color=#, OffX=1, OffY=1, Positive=yes).filter6 FILTER: DropShadow(Color=#, OffX=1, OffY=1, Positive=yes)IMG BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-B

46、OTTOM: 0pxA:link FONT-SIZE: 12px; COLOR: #; TEXT-DECORATION: noneA:visited FONT-SIZE: 12px; COLOR: #; TEXT-DECORATION: noneA:hover FONT-SIZE: 12px; COLOR: #66ccff; TEXT-DECORATION: underlineA:active FONT-SIZE: 12px; COLOR: #; TEXT-DECORATION: none.text FONT-SIZE: 13px; COLOR: #.dd BORDER-RIGHT: # 1px ridge; BORDER-TOP: # 1px ridg

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會(huì)有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲(chǔ)空間,僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請(qǐng)與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

最新文檔

評(píng)論

0/150

提交評(píng)論