基于移动互联网的应用研究

2022-12-08

HTML+CSS的组合,实现了web页面内容与样式的分离,不仅实现web页的布局、格式的多元化,更有利于页面的格式修改。随着技术的改进,HTML增加了功能强大的新元素,诞生了HTML5,并且成为web新标准,各大浏览器都支持HTML5核心技术。同时在原有版本Css的基础上产生了Css3,其新增的属性可以使web页更加美轮美奂。

一、HTML5的新技术及应用优势

HTML5是一种用于结构化和描述互联网中内容的新核心技术。它是HTML标准的最新版本。HTML5的新功能不仅有丰富的媒体支持(音频和视频),还为开发Web应用提供了支持。Html5的新功能和APIs满足了商家和用户的需求。它的主要目的是为Web开发者提供一种与供应商保持中立的语言,以更低的成本实现有竞争性的应用。这些应用不会依赖于用户设备,也不需要安装软件或者插件。Html5实现了实时Web应用程序,比如声频和视频服务的管理,实现了设备的信息萃取,比如地理定位。通过APIs还实现了非http通信,如实现双向实时通信的Websocket(简称Web RTC),Web RTC实现了p2p通信和web消息[1]。

HTML5为复杂的web应用引进了应用程序接口(API),支持开发互动的、跨浏览器的、无缝跨设备的应用。它为互联网提供的新技术及优势包括:

(1)语义:更恰当的描述内容。(2)联通性:用新的和创新的方式与服务器联系;(3)离线和存储:在客户端存储数据和离线操作;(4)多媒体:无需外部插件为视频和音频文件提供支持;(5)2D/3D图形和效果;(6)性能和集成度:提供速度优化和更好的使用计算机硬件;(7)设备访问:允许使用各种输入和输出设备;(8)造型:提供更灵活的文件内容。

二、HTML5的本地存储和新增表单元素

Html5本地存储就是客户端存储,依靠存储web应用数据在客户端设备中,而不再是服务器端,因此一部分应用代码从服务器端移植到客户端。之前,本地存储依靠的是cookies或者专有的解决方案。它有多个优点:首先,web应用在离线状态下还可运行。因为所有的数据存储在本地,即使在离线状态下用户能够继续实现应用交互;其次,APIs提供了更丰富且更具交互性的用户接口。最后,数据传输到客户端去掉了客户端与服务器端不必要的信息交换。因此为用户带来更好的体验。本地存储减少了服务器端的加载,增加了服务器的可用性。HTML5本地存储API定义为将数据存储在用户机器上的一组HTML5 API,其中包括在浏览器端存储键值对数据的WEB存储。根据用户要求,它可用实现两种存储。首先是Local Storage API实现的永久存储,数据能被不同的标签共享,也能被用户或者应用删除,另一方面,Session Storage API实现临时存储,数据会在标签关闭后删除。本地存储中,数据存储在一个存储极限达到至少5MB的name-valued对中,并且只能被存储数据的页面访问。本地存储的作用是保证数据在浏览器关闭后可用,应用系统可以在应用程序启动时减少启动延迟立即使用[2]。新增表单元素分别是datalist、keygen、output,其中datalist可以为其他输入控件提供一个预定义的选项列表,这个功能在HTML5之前只能通过javascript语音实现。Keygen客户端访问服务器时的安全认证,当提交表单时会生成私钥和公钥,私钥存于客户端,公钥发至服务器作为客户端证书可用于验证用户。Output元素主要用于显示javascript脚本输出[3]。

三、Css3的新功能及应用优势

Web页面采用Css层叠样式表可以使页面中的内容与样式分离,方便对页面进行格式的修改,Css3是Css2改进后的版本,它的显著特点是“模块化”,Css3重要的模块有选择器、框模型、背景和边框、文本效果、2D/3D转换、动画、多列布局、用户界面。在以往的web页制作中,块级元素的边框样式简单,圆角边框需要借助设计软件先行制作圆角图片,Css3技术后,块级元素的边框样式更加丰富,可以使用Css3的border-radius属性便可轻而易举的实现圆角边框效果,另外,Css3还添加了box-shadow属性用于向边框添加阴影,以及border-image属性,可以使用图片来创建边框,有了这些属性,web页面将变得更加美观。Css3添加了很多文字效果,已经被主流浏览器支持并常用的属性有文本阴影text-shadow、text-overflow、word-break、word-wrap。使用Css3的过渡transition属性,使HTML元素在不同的状态之间进行平滑的转换,也可以实现简单动态效果及交互。

四、HTML5和CSS3对移动互联网发展的影响

(一)移动互联网的发展趋势

到2017年为止,全球使用90%新设备是智能手机和平板电脑,4/5的软件产品应用于移动设备。随着无线网络覆盖范围的扩张,移动互联网的应用正朝着多元化的方向发展:(1)移动电子商务:近年来,在用户规模和市场规模都十分庞大的电子商务领域,随着移动终端的普及和移动网络环境的改善,人们使用移动购物、移动支付、手机银行的概率逐年上升。(2)移动社交:用户通过使用微信可以更好的沟通、分享,足以说明移动社交带来的便利,今后移动社交还可朝推荐、关联服务和通讯等方向发展。(3)移动搜索:需求场景多样化,各大搜索引擎纷纷把浏览器转向移动终端,促进了移动搜索的发展。(4)移动游戏:2017年中国移动游戏市场达554.13亿,目前移动游戏规模处于高增长时期。

(二)移动互联网发展现状

目前移动终端设备使用的操作系统并不统一,主流的有苹果的IOS、Google的Android、黑莓的Black Berry,windows的windows phone,而IOS操作系统使用IOS Safari浏览器,Android使用Android Browser,Black Berry使用webkit浏览器,windows phone使用IE浏览器。其中IOS Safari、Android Browser、webkit浏览器的核心都是基于webkit,都支持HTML5和Css3的多项特性,就算是核心没有基于webkit的IE浏览器,版本升级至IE10.0以后,也都支持HTML5和Css3的多项特性。

(三)HTML5和Css3对于移动互联网应用开发的影响

(1)移动终端设备使用不同的操作系统,之前的移动应用开发者为了获得更多的用户群不得不针对不同操作系统进行重复开发,HTML5凭借其良好的跨平台性,使应用移植变得简单;(2)HTML5和Css3解决了移动web页中使用flash视频需要安装插件的尴尬,使用HTML5中和Css3以及javascript就可以实现页面动态和交互效果;(3)使用HTML5开发移动应用程序,开发周期短,成本低,可以在web页中修改、调试、完善。(4)web离线应用和本地存储,加快移动应用的数据读取,提高了访问速度。

(四)HTML5和Css3进行移动互联网应用开发的不足

HTML5和Css3为移动互联网的发展产生了巨大的推动作用,然而它们开发的应用需要浏览器的支持,主流浏览器并没有完美的支持HTML5和Css3,所以在今后的一段时间内,HTML5和Css3还不能取代其他应用开发技术的地位。目前,HTML5适合开发的web应用类型是基于信息流及类似方式的应用,如微博、社交、新闻、地图、导航等。