旅游網(wǎng)站的實(shí)現(xiàn)

余萍

[摘 要] 隨著社會(huì)的發(fā)展，旅游業(yè)的發(fā)展越來(lái)越好?，F(xiàn)在人們都會(huì)利用節(jié)假日、雙休日旅游來(lái)釋放自己的壓力，由于目標(biāo)不確定都會(huì)選擇一些旅游網(wǎng)站來(lái)制定行程。但是，這些網(wǎng)站頁(yè)面太過(guò)繁雜，功能也太多不太適合那些想旅游又沒(méi)有計(jì)劃的人，所以我做了一個(gè)比較簡(jiǎn)潔的旅游網(wǎng)站，其中有景點(diǎn)介紹、適合當(dāng)季游玩的地點(diǎn)推薦，也增加了一些團(tuán)購(gòu)：可以團(tuán)購(gòu)酒店、景點(diǎn)門票以及當(dāng)?shù)孛朗场Ｏ到y(tǒng)主要實(shí)現(xiàn)用戶注冊(cè)、登錄，購(gòu)物車、景點(diǎn)酒店搜索等主要功能。在開發(fā)過(guò)程中，使用JQ語(yǔ)言編寫，數(shù)據(jù)存儲(chǔ)采用Cookie，整個(gè)系統(tǒng)外觀比較美觀大方。

[關(guān) 鍵 詞] JQ語(yǔ)言；旅游網(wǎng)站；AJAX

[中圖分類號(hào)] TP393 [文獻(xiàn)標(biāo)志碼] A [文章編號(hào)] 2096-0603（2018）07-0228-02

一、引言

（一）研究背景

隨著網(wǎng)絡(luò)的飛速發(fā)展，旅游行業(yè)也越來(lái)越熱門，現(xiàn)在市面上有很多的旅游網(wǎng)站。但是這些網(wǎng)站頁(yè)面不太適合那些想旅游但是沒(méi)有目標(biāo)的人，這些網(wǎng)站主要是機(jī)票酒店訂購(gòu)以及跟團(tuán)游比較商業(yè)化，并不怎么會(huì)有景點(diǎn)介紹，以及當(dāng)?shù)靥厣L(fēng)俗，這些都需要自己上網(wǎng)去查。所以大多數(shù)人只能選擇跟團(tuán)游，但是這樣太過(guò)拘束，不適合一些喜歡自由的小情侶、閨蜜、朋友等，所以本人設(shè)計(jì)了一個(gè)比較簡(jiǎn)潔的旅游網(wǎng)站，有景點(diǎn)介紹、團(tuán)購(gòu)以及一些適合各季節(jié)和各類人旅游的城市推薦。

（二）研究的應(yīng)用前景

該系統(tǒng)是一款旅游網(wǎng)站，用戶可以在上面查看當(dāng)季適合旅游的城市，上面也有其他用戶上傳的推薦旅游線路，用戶確定旅游城市也可以在該網(wǎng)站團(tuán)購(gòu)酒店、當(dāng)?shù)孛朗骋约熬包c(diǎn)門票省去了排隊(duì)的時(shí)間，此網(wǎng)站主要方便旅游的人查看當(dāng)?shù)氐奶厣包c(diǎn)、民俗風(fēng)情，省去了自己一個(gè)個(gè)查找。

二、開發(fā)環(huán)境及技術(shù)支持

（一）H5前端開發(fā)環(huán)境

HTML5是萬(wàn)維網(wǎng)的核心語(yǔ)言，它是標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言下的一個(gè)應(yīng)用超文本標(biāo)記語(yǔ)言的第五次重大修改。網(wǎng)頁(yè)前端主要是根據(jù)UI設(shè)計(jì)師提供的規(guī)劃布局好的設(shè)計(jì)圖，然后用代碼把它給展示出來(lái)再根據(jù)用戶的體驗(yàn)進(jìn)一步的優(yōu)化。這主要由HTML、CSS、JQ這三種語(yǔ)言完成。

（二）H5前端開發(fā)工具

1.Sublime Text

它是一個(gè)復(fù)雜的文本編輯器，用于代碼、標(biāo)記和散文。最主要的是他和其他開發(fā)工具相比他的體積比較小所以運(yùn)行速度比較快。

2.Fireworks

Fireworks是Adobe推出的一款網(wǎng)頁(yè)作圖軟件，它簡(jiǎn)化了圖形設(shè)計(jì)的工作難度，所以使網(wǎng)頁(yè)設(shè)計(jì)更加快速，使用它都能輕易地完成大量圖片的完美切割。

3.谷歌瀏覽器

（三）H5前端開發(fā)技術(shù)

1.JavaScript介紹

JS是一種直譯式腳本語(yǔ)言，一般都被用來(lái)為網(wǎng)站添加各種動(dòng)態(tài)功能，來(lái)達(dá)到用戶所想要的瀏覽效果，它是嵌入到html中來(lái)實(shí)現(xiàn)自己想要的功能的。

2.CSS介紹

CSS又名層疊樣式表，它是一種用來(lái)表現(xiàn)HTML、XML等文件樣式的計(jì)算機(jī)語(yǔ)言，它可以用來(lái)修飾網(wǎng)頁(yè)布局算是一種輔助修飾頁(yè)面的“工具”。

3.jQuery

jQuery是一個(gè)JavaScript函數(shù)庫(kù)也是一個(gè)輕量級(jí)的“寫得少，做得多”的JavaScript庫(kù)。

三、系統(tǒng)功能需求及可行性分析

（一）技術(shù)可行性分析

1.模塊分布

網(wǎng)站最重要最基礎(chǔ)的就是模塊的劃分，如果一個(gè)頁(yè)面布局不好很可能導(dǎo)致整個(gè)頁(yè)面癱瘓，所以在前期搭建框架的時(shí)候一定要做好這樣為后期做功能的時(shí)候省去了很多時(shí)間。

2.色彩搭配

色彩主要由紅、綠、藍(lán)，也就是RGB產(chǎn)生，由十六進(jìn)制00 00 00表示，采用相鄰的顏色設(shè)計(jì)網(wǎng)頁(yè)可以使網(wǎng)頁(yè)看起來(lái)舒服，整個(gè)頁(yè)面更加和諧統(tǒng)一。因?yàn)樽龅氖锹糜尉W(wǎng)站，所以我選擇了綠色，這樣會(huì)顯得很有生機(jī)，更加貼合主題。

文字部分大多數(shù)以灰色、黑色為主，搶購(gòu)頁(yè)面主要以紅色為主更加體現(xiàn)了搶購(gòu)的主題，選擇的圖片色彩也要和整個(gè)頁(yè)面顏色搭配，這樣才不會(huì)使整個(gè)網(wǎng)站顯得突兀。在旅游景點(diǎn)介紹時(shí)我采用了文字環(huán)繞圖片的方式來(lái)進(jìn)行排版，這樣不會(huì)顯得有太多空白。

3.CSS盒模型

CSS盒模型應(yīng)該都具備內(nèi)容（content）、填充（pad-ding）、邊框（border）、邊界（margin）這些功能，我們可以用日常生活中的盒子來(lái)理解這四個(gè)屬性：（1）內(nèi)容（content）：就是盒子里面裝的東西；（2）填充（padding）：就是怕盒子里裝的貴重的東西損壞而添加的泡沫；（3）邊框（border）：就是紙盒子本身的厚度；（4）邊界（margin）：就是盒子與盒子之間的空隙還有就是大盒子與嵌套在它里面的小盒子之間的空隙。

（二）需求分析原則

本旅游網(wǎng)站主要包括：首頁(yè)、目的地、酒店、團(tuán)購(gòu)、旅游攻略、名勝古跡等子網(wǎng)頁(yè)。制作過(guò)程過(guò)程如下：

1.首頁(yè)分析

首先利用fireworks把首頁(yè)logo圖片做出來(lái)，在對(duì)頁(yè)面進(jìn)行合理的分配布局。

2.其余頁(yè)面分析

剩余頁(yè)面的設(shè)計(jì)風(fēng)格基本和主頁(yè)一致，導(dǎo)航欄始終貼在登錄、注冊(cè)版塊下面，然后就是各大模塊內(nèi)容的顯示。

四、系統(tǒng)總體設(shè)計(jì)

設(shè)計(jì)該系統(tǒng)的主要目的是為了給用戶一個(gè)更好的旅游網(wǎng)站，為了給用戶提供一個(gè)更加快捷了解旅游線路的平臺(tái)，省去用戶查看的時(shí)間，也為用戶提供了更多的選擇，讓用戶了解各城市適合游玩的時(shí)間以及當(dāng)?shù)靥厣?。用戶還可以在網(wǎng)站團(tuán)購(gòu)當(dāng)?shù)鼐频旰兔朗?，省去了不少開銷。

參考文獻(xiàn)：

[1]Nicholas C.Zakas.JavaScript高級(jí)程序設(shè)計(jì)[M].3版. 人民郵電出版社，2012.

[2]Elizabeth Castro.HTML5與CSS3基礎(chǔ)教程[M].8版.人民郵電出版社，2014.

[3]董慶帥.UI設(shè)計(jì)師的色彩搭配手冊(cè)[M].電子工業(yè)出版社，2016.

[4]費(fèi)里曼.HTML5權(quán)威指南[M].人民郵電出版社，2014.

[5]張容銘.Javascript設(shè)計(jì)模式[M].人民郵電出版社，2015.

[6]曾探.JavaScript設(shè)計(jì)模式與開發(fā)實(shí)踐[M].人民郵電出版社，2015.

Implementation of Travel Network

YU Ping

Abstract：With the development of society， tourism is becoming more and more popular. Now people will use holidays， weekend travel to release their pressure， because the target is uncertain， will choose some travel sites to develop itinerary， such as Ctrip， the way cattle and so on. However， these web pages are too busy， too many functions are not suitable for those who want to travel and no plan， so I made a simple comparison of tourism website there are attractions， where seasonal seasons recommended to play， but also increased the number of group purchase group purchase： to hotels， attractions tickets and local delicacy. This system mainly realizes the user registration， login， shopping cart， attractions， hotel search and other main functions. In the development process， the use of JQ language， data storage using Cookie. The overall appearance of the system is beautiful and generous.

Keywords：JQ；Tourism website；AJAX