我国6个知名旅游网站的设计特点比较

旅游网站毕业设计论文第三篇：我国6个知名旅游网站的设计特点比较

　　摘要：依托四通八达的网络，很多多姿多彩的旅游网站落地生根，以其方便快捷和信息共享等强大优势赢得消费者喜爱，为旅游行业带来了新的经济增长点。在这样的背景下，如何建设受消费者青睐的旅游网站成了旅游行业从业者不得不钻研和思考的问题。根据当下热门的六大旅游网站（携程、同程、途牛、艺龙、马蜂窝、去哪儿），笔者主要从界面设计、信息技术、内容布局的角度解读和分析旅游网站的建构与设计。

　　关键词：旅游网站; 界面设计; 信息技术; 内容布局;

　　Construction and Design of Tourism Websites——Taking Six Domestic Tourism Websites as Examples

　　Huang Juan Bao Zhengde Li Chenxi

　　School of Computer and Software, Jincheng College of Sichuan University

　　Abstract：Relying on the network extending in all directions, the various tourist websites have taken root, and have won the consumers' love with the powerful advantages such as convenience and information sharing, bringing new economic growth points to the tourism industry. In this context, how to build a tourist website favored by consumers has become a problem that the travel industry practitioners have to delve into and think about. This article relies on the current six major travel websites(Ctrip, Travelgo, Tuniu, Elong, Mafengwo, Qunar), mainly from the perspective of interface design, information technology, content layout to interpret and analyze the construction and design of travel websites.

　　0 引言

　　据国家文化旅游部官方数据，2019年国庆假期前4天全国共接待国内游客5.42亿人次，同比增长8.02%，显示出我国旅游经济强大的生命力及活力。旅游行业生机勃勃，消费升级要求旅游行业从传统线下转向线上线下联纵并举，以“互联网+旅游”的全新态势助力中国新经济。

　　信息是旅游业发展的核心，旅游活动会涉及众多的旅游设施(旅游交通、饭店等)、旅游服务部门(旅行社、保险等)[1]。如今，产品多样化的综合性在线旅游平台越来越受到消费者的喜爱。而如何建构好一个旅游网站是从业者们亟待解决的问题与难题。本文以当前市场上六大旅游网站（携程、同程、途牛、艺龙、马蜂窝、去哪儿）为基点，探究旅游网站的网页布局和界面设计等问题。

　　1 六大旅游网站的布局及设计

　　1.1 网页基本布局和代码架构

　　目前，国内大型旅游网站几乎都是综合性网站。综合性意味着信息繁多庞杂，如果没有清晰的框架，难免显得杂乱无章，损害用户体验。六大旅游网站大体都使用了以顶部大图banner+层级/栅栏为主的综合型网页布局，它能在有限区域内有效整合大量信息。网页布局的代码较为简单，一般用DIV和CSS就可以实现，而针对这种形式的代码设计通常是给整体一个固定值的DIV盒子，将内容都放到盒子里面即可。

　　值得注意的是，一般栅栏型或多或少都会采用流式布局，长度、宽度单位用百分数计量，而非我们一般使用的px，其好处在于能够避免网页布局在不同分辨率下发生改变，适配各种的屏幕分辨率。而网页内部元素的高度和文字大小依旧使用px固定，方便排版和阅读。技术人员应根据具体情况把握网站页面建构框架，实现盒子并列和嵌套的科学性和逻辑性。

　　1.2 顶部banner的设计

　　Banner是指投放于线上（PC端、移动端）的广告图，顶部banner的作用相当于我们看报纸时的最大标题，能够直接抓住人的眼球。据统计，电商平台60%的文字信息用户是不会仔细阅读的，banner文案表达也直接关系到利益点的表达，文案是否清晰易懂直接影响着用户的决策时间[2]。笔者以艺龙、马蜂窝、途牛、同程4家旅游网站为例简要说明顶部banner设计与网站定位的密切关系。

　　1.2.1 艺龙

　　基于发展历史等多方面的原因，艺龙旅游网相较于其他几个旅游网站来说定位更加简单和清晰，即成为“中国在线和移动住宿服务提供商”。艺龙拥有微信钱包的酒店入口，酒店住宿是其主营业务。故首页顶部7张banner图全部围绕酒店的折扣和活动来宣传展示。同时在banner背景图的左侧设置了一个盒子用于酒店和机票、火车票的选择，直白明了。

　　1.2.2 同程

　　同程定位为“一家专业的一站式旅游预订平台”，其主打服务为机票和火车票的订购。与艺龙相对应，同程网络拥有微信钱包中机票、火车票的入口。Banner主要为国内和国外的风景和宣传词。左侧也和艺龙一样设置了盒子，不过将机票和火车票两个元素放在了最前面，同时增加了“景点”“周边游”“境内游”“出境游”以及“邮轮”。

　　1.2.3 途牛

　　途牛的整个顶部banner是“国字型”布局，内容更加详实，这也与途牛的定位“中国知名在线旅游预订平台”有关，途牛主要提供跟团游、自助游等。这种旅游线路一体式的服务不同于机票、火车票等单一场景服务，需要与消费者建立极强的信任感，故途牛顶部banner上的广告词较艺龙和同程更具诱导性，右边增加了用户满意度等要素，无一不是为了获得消费者对其产品的认同。

　　1.2.4 马蜂窝

　　以旅游游记和攻略起家、增加了社交功能和内容输出的马蜂窝在一众旅游网站中显得独树一帜，其定位为“靠谱的旅游攻略、自由行、自助游分享社区”。顶部的banner图除了一个搜索框和简单的文字外再没有别的内容，4张banner图大多来自用户的原创拍摄，根据时间先后进行排序，用户点击banner图即可进入相应的游记或攻略，淋漓尽致地展示了“社区”的魅力。
 

　　1.3 网页主区域设计

　　网页主区域是呈现给用户看的主要区域，也就是html中的body区，顶部banner区如果能够第一眼吸引用户眼球，起到提纲挈领的作用，那么下面的body区便是留住用户和变现流量的关键。综合比较六大旅游网站，主要有3种框架布局组合模式。

　　1.3.1 层级型

　　代表网站：携程、同程、去哪儿

　　携程、同程以及去哪儿这三个旅游网站都采用逐层划分的方式，即几个盒子均匀地从上到下垂直并列。使用这种排列方式的好处是能够让用户一目了然地看出每部分所展示的内容，各元素之间分配匀称、结构清晰。携程和同程旅游网站还增加了左侧边导航栏，侧边栏位置及响应标题会随着用户浏览位置的变化而变化，辅助用户精准定位长页面的信息。

　　1.3.2 栅栏型

　　代表网站：马蜂窝

　　马蜂窝旅游网站用的是很典型的栅栏式结构，这种结构适合内容输出型的网站，如新浪博客、知乎等网站。栅栏式结构的核心是将内容进行与垂直排列相对的横向切割，从内容上来看，左边一列均匀分布为旅行家专栏、旅游攻略推荐等，右边一列则全是游记的内容，且所占整个页面的比重比左列大了两倍有余。总的来说，栅栏式布局通过对不同内容的比例分配，可以很好地凸出主题。

　　1.3.3 组合型

　　代表网站：途牛、艺龙

　　途牛和艺龙这两个旅游网站较于其他四个网站有层级和栅栏混合的特点，故将它们称为组合型。以途牛网站为例，首先，它是一个两列栅栏型结构，右侧有热门头条和新的导航栏元素等，左侧为旅游商品。在左侧之内，又划分了“当季热玩”“出境长线”“出境短线”“境内旅游”等板块，层级和栅栏式交错融合。这种结构适用于内容较多、分类繁杂的旅游网站。

　　1.4 网页配色

　　网页配色包括网页底色、字体颜色、盒子颜色等的组合统一，除了相应的审美能力，其还遵守一些基本的原则和规律。（1）底色选用白色或浅灰色，包括六大旅游网站在内的无数我们熟悉的知名网站，几乎都是采用白底或者浅灰色底，百搭经典。（2）配色可参考logo颜色，例如携程、去哪儿、同程的旅游网站导航栏设计便与其logo颜色相得益彰。网页配色的设计要依据色彩搭配的基本原则（鲜明性、独特性、艺术性、合理性），还可以使用一些基本的色彩搭配方法，如同种色彩搭配、对比色彩搭配等[3]。

　　2 网站建构和设计建议

　　2.1 找准自己的定位

　　正式开始建构和设计网站之前，所做的第一步便是找准自己独特的定位。综观六大旅游网站，无不是各有所长、各具特色，例如马蜂窝正是依靠“内容+交易”的特质俘获市场。尤其对于旅游业新兴从业者来说，因为旅游业并不是新兴产物，而是传统服务业中的一环，在资本力量上始终不敌久经沙场的大企业，要想异军突起，必须另辟蹊径。

　　2.2 排版布局符合产品特性

　　设计必须符合产品特性和定位。可以借鉴同类型的网站架构，尤其是国内大型旅游网站，取长补短。知名综合性旅游网站的网页设计和布局，看似内容繁杂，实则轻重有序，条理明晰。在前期内容简单的情况下建议采用简单层级型或栅栏型排列布局，易于增加和删改内容，切忌杂乱无章没有重点，内容应求精不求多。

　　2.3 注重用户体验，细节决定成败

　　网站在用户心中的好感度来源于用户体验。从心理学角度理解，体验是当一个人的情绪、体力、智力，甚至精神达到某一特定水平时，意识中所产生的美好感觉[4]。提升用户体验要从细节下工夫，例如就登录、注册这两个按钮来说，携程的按钮文字分别为“你好，请登录”和“免费注册”，这就比其他旅游网站的“登录”“注册”更添亲切感，拉近了和用户的距离。

　　3 结语

　　“互联网+旅游”并非新事，不过要想真正实现旅游业的信息化、科学化，仍然还有很长的一段路要走。对于行业从业者来说，如何建构和设计一个令人满意的旅游网站，是一个需要不断努力探索的课题。“知己知彼，百战不殆”，只有先清楚自身的定位与发展，才能准确把握整个网站的框架；只有先了解市场的形势与对手的优势、劣势，才能更有底气地大踏步前行。而所谓设计，从来没有最好的，只有最适合自己的。

　　参考文献

　　[1]胡云.我国旅游业的信息化建设与发展[J].城市问题,2004(2):50-52.
　　[2]陆丽芳.电商Banner设计策略研究[J].工业技术与职业教育,2018,16(1):83-89.
　　[3]张丽萍.网页配色与版式布局的设计[J].产业与科技论坛,2015,14(3):57-58.
　　[4]（美）B.约瑟夫·波恩,詹姆斯H.吉尔摩.体验经济[M].北京:机械工业出版社,2012:66-201.