基于H5技术的交互页面在旅游景区导览系统中的应用

马妮 周润苗

摘要：移动互联网的快速发展，带来了生活方式的巨大变革，形成了“移动生活形态”，基于H5技术的交互页面也渗透到人们生活的各个方面。通过H5的内涵、H5交互页面的介绍，在智慧旅游的背景下，探索基于H5的交互页面在旅游导览中的应用方式；借助H5交互页面的优势及传播特点，来实现景区智能导游、传播推广及数字化便捷服务，以满足游客的个性化需求，提升景区的服务水平。

关键词：H5技术；交互式页面；景区导览系统

中图分类号：TU984.18 文献标识码：A 文章编号：1007-9416（2018）06-0080-02

随着移动社交媒体的迅猛发展，尤其是微信的普及使用，H5以迅雷不及掩耳之势兴起，基于H5的交互式页面如燎原之势发展蔓延。H5给传媒方式带来新的变革，也带来了信息传播的新模式。

1 H5解读

1.1 H5是什么

HTML是Hyper Text Markup Language 的简写，即“超文本标记语言”，HTML的第五代版本，简称H5。H5从2008年1月发布第一份正式方案开始，经过8年时间，到2014年10月才最终发布规范标准。H5将互联网的表现语义化，能更好地被人类和设备解读，并能更好地兼容在移动设备上，实现多媒体的整合。

通俗地说，H5是为了在移动设备上运用多媒体而开发的高级网页技术，适用于跨平台应用程序、视频、动画、图形、风格、排版和其他数字内容发布，在内容呈现上与PC端网页无异。随着以微信为代表的移动社交媒体的迅速发展和广泛应用，基于H5技术的内容和产品日趋流行。

1.2 H5的特点和优势

相比于APP，H5投入成本较低，具有本地储存和跨平台打开功能；对用户而言，其操作简便；用户可以直接浏览体验无须下载储存；H5能根据用户移动端的设备，自动切换页面的分辨率、图片尺寸及相关脚本功能等；同时，H5 具有优良的交互性，符合互联网社交分享和移动信息传播的规律。

（1）本地存储。H5的本地储存功能使得H5 页面中所有的元素都不占用手机等移动终端的内存，可减少内存压力。本地存储功能也可以缩短网页启动时间，提升访问速度。

（2）免插件。在PC端，用户观看视频，必须借助视频插件或者APP的应用才能实现。而H5则能直接承载图像、音效、视频等多媒体类型，用户无需下载插件就能轻松流畅的观看高清酷炫视频、图文配套音频，感受到极好的视听体验。

（3）灵活性。H5可在网页上进行直接调试和修改，灵活方便，避免繁琐的编码、调试和运行工作；用户在使用过程中也无需进行反复的更新，即可获取修改后的内容。

（4）超强绘图功能。H5 强大的绘图功能和三维效果为互动页面带来丰富的感官体验，并为交互形式提供技术支持。H5技术的绘图功能用脚本来完成实际的绘图任务，制作出的动画效果可在移动端浏览。

2 基于H5的交互式页面

H5交互式页面是基于新媒体平台将内容在手机、平板电脑等移动终端上进行开发、使用和传输，通常以互联网营销或宣传为目的，通过扫二维码或者分享链接的方式进行传播。H5交互式页面一般由多个页面组成，以图文、视频、音频、动画等多种方式进行呈现，通过点击、滑动等手势作为第一接触方式和翻页方式。H5交互页面凭借精美的设计风格、新鲜的交互体验以及强烈的社交属性，容易对用户产生极强的分享驱动力，容易在移动社交环境中形成病毒式传播。

2.1 H5交互页面的类型

H5交互页面大致有这样几种类型：基于传感器、基于触摸屏操作、基于画面呈现、基于内容。

（1）基于传感器。手机上的传感器有陀螺仪、GPS、摄像头、麦克风、震动传感器、光线传感器、距离传感器等。陀螺仪和重力感应、地理位置、用人脸和H5进行互动的人脸识别在体感H5中用的比较多。

（2）基于触摸屏操作。在触摸屏上的操作也有多种，如单屏滚动、手势操作、全景交互及多屏互动。单屏滚动是很常见的交互形式。翻屏时可以加上一些转换的动画，使得翻页效果生动不单调，也可以加上重力感应，让手机在转动时产生视差效果。手势操作我们和屏幕交互，除了有点击、滑动外，还有很多手势操作，如拖拽、放大、所辖、旋转、画图。多屏互动指在多个屏幕上体验活动，各自的操作会同时反应到其他屏幕上，一般以双屏互动为主。全景交互指将用户置于一个360度环绕的图片/视频环境下进行沉浸式的体验，用户可以通过转动手机或滑动屏幕来看这个环境里不同角度的内容并进行交互。如果将内容分成左右两个屏，带上VR眼镜，则可以进行VR体验。

（3）基于画面呈现。一般展现一段比较酷炫有趣的画面内容，如视频、动画、特效，给用户带来视觉上的感官享受，用户也可以通过与画面内容互动，看自己想看的内容。

（4）基于内容。基于内容的H5主要是用图文混排展示内容，答题类游戏等与内容相关，实际上基于内容的H5类型与前面三种类型有较大的关联，常融合在一起来进行内容的呈现。

2.2 H5交互页面的传播特点

（1）交互方式双向化。H5交互页面在传播过程是与 受众进行信息或行为的交互过程，基于互联网多向传播的特性，H5页面革新了传统媒体的单向传播方式，充分发掘目标人 群的潜在需求和阅读习惯，有针对性地进行交互体验的优化，让阅读者在接受共性信息的同 时获得个性化的体验，提升了用户的参与感，增强了互动性。

（2）信息载体多样化。H5交互页面丰富了信息载体的形式，从传统媒体简单的图文呈现方式发展成为图文、视频、动画、特效等一种或多种形式的结合，表现形式更加多元化和形象化，能更加精准的达到营销目的，提升用户的感官刺激，有效提升信息传播效率。

（3）傳播方式多元化。H5交互页面传播途径的变革使得传播的方式变得多元化。在互联网时代，新媒体的出现和应用，彻底颠覆了传统传播效率低而范围狭窄的传播路径。

3 基于H5的交互式页面在旅游导览系统中的应用

景区的导览系统是用于环境定位、资讯获取等的系统模块，由导览牌、标识牌、手册等资料组成，主要为 受众提供便捷有效的引导、讲解等服务，方便游客的参观游览。伴随着互联网和 智能终端的普及，传统景区旅游导览系统不再满足游客个性化的需求，智慧旅游已经开始应用到了旅游服务中，旅游类APP是常见的智慧旅游产品。而相较于APP来说，H5交互页面的启动时间更短，联网速度更快，且无需下载，不占用存储空间，使用户用较少的流量就可以欣赏到炫酷的视觉听觉效果。

基于H5交互页面的自身优势，将H5交互页面应用到旅游景区的导览系统中，有利于提升游客的旅途体验、也利于扩大旅游景区的影响力，激发潜在的旅游客户。H5交互页面在旅游导览中，可以应用于如下几方面：

3.1 智能导游

早期的电子导游系统，已经足够智能化，具备了语音提示和景点信息自动播报功能，但仍需携带导游设备或者是在移动端安装应用，而H5交互页面则让游客解放出来，拿着着手机扫描一下当前游览的景点二维码，就可以听到解说和浏览详细信息。

H5交互页面的智能导游功能主要是把景区范围内的景点或展览品的解说录音、详细介绍、图片、故事等内容以图文、音频、视频、动画等多媒体方式编辑并录入系统资源库，生成单个景点或展览品的二维码。游客只需用微信对感兴趣的展览品标牌上或景点指示牌上的二维码进行扫描，就能获取相关展品或景点详细而直观生动的信息。

3.2 景区推广

H5交互页面在移动终端上直接向目标受众定向和精确地传递个性化即时信息，方便、快捷、传播性强的特征已经成为各类企业最心仪的营销方式。

景区机构可以把景区的特色用H5交互页面的方式，通过微信公众号进行图文群发推广、微信群推广、线上线下 二维码推广，还可以将H5页面与其他社交平台如QQ、微博 联合起来，打造多元化H5营销渠道，以期达到对景区多元化的营销。

结合景区的节庆活动，开展H5页面、微信互动O2O营销，促进景区的传播推广。可以根据景区 的地方特色开发微信H5互动游戏，让景区与游戏无缝链接，利用 微信的强关系链，分享、转发制造朋友圈传播效应，形成扩散式传播。通过线上线下营销活动，吸引更多的潜在游客。

3.3 便捷服务

H5交互页面亦可以提供数字化的便捷服务，在景点H5页面中，植入景点周边的服务信息，游客在扫描二维码的同时，就能获得相关的服务信息。借助H5交互页面把“吃住行游购娱”旅游六要素以更加快捷、便捷的方式传递给自助游客，自助游、自驾游游客不仅可以更详细地了解和景区有关的各种旅游信息，还能预订门票、餐馆和酒店。

4 结语

移动互联网的不断发展，游客对景区了解的模式正发生改变，旅行体验需求也在不断提升，景区构建以服务游客为核心的智慧旅游体系，是大势所趋。作为智慧旅游的重要实现手段的H5为景区提升服务水平，提供了足够的空间。本文探讨了基于H5的交互页面自身的类型及传播特点，如何将H5交互页面运用到景区的导览系统之中，以期更好地满足游客个性化的需求。旅游景区实现智慧旅游之路还需更多依赖H5技术，实现数字化服务，将旅游景区打造成独居特色的智慧旅游精品景区。

参考文献

[1]胡晓林，马振龙.基于H5 技术的微信交互式广告在交互设计方面的“优势整合”创新思考[J].包装工程，2016，37（24）：124-129.

[2]张扬.基于“H5+微信”的科技期刊新媒体融合[J].中国科技期刊研究，2017，（10）：936-940.

[3]杜蔚苗.移动终端 H5 广告互动页面设计研究[D].湖北工业大学，2017.

[4]豆晓宁，王小辉，雷可为.基于智慧旅游的丝路经济带手机导游平台发展研究[J].科技视界，2015，（12）：52+154.

[5]李云鹏，黄超.北京智慧旅游公共管理与服务建设现状与对策分析[J].城市管理与科技，2015，（01）：65-67.

[6]韩旭，高鹏宇，李雪峰.从“互联网+”的角度浅析旅游景点自助导游平台的发展[J].中国新通信，2015，（23）：55.

[7]錢政.基于微信公众平台的交互式移动导览系统设计[J].湖南理工学院学报（自然科学版），2015，（01）：29-32.

Abstract：The rapid development of the mobile Internet has brought about a tremendous change in the way of life and formed a “mobile lifestyle”. The interactive pages based on H5 technology also penetrated into all aspects of peoples lives. Through the intension of H5 and the introduction of H5 interaction page， in the context of smart travel， explore the application of interactive pages based on H5 in tourism guides； use the advantages and propagation characteristics of H5 interactive pages to realize intelligent guides and dissemination of scenic spots. Promote and digitize convenient services to meet the individual needs of tourists and enhance the service level of scenic spots.

Key words：H5 technology； interactive pages； scenic navigation system