webapp webapp-界面,webapp-优点

WebApp是指基于Web的系统和应用,其作用是向广大的最终用户发布一组复杂的内容和功能。 从一个简单的帮助消费者计算汽车租借费用的网页,到为商业人员和度假者提供全套旅游服务的大型复杂的WEB站点,都是WebApp。它包括一些完整的WEB站点,WEB站点的专门功能以及在Internet、Intranet或ExtraNet上的信息处理应用。 webapp 框架是一种简单的与WSGI兼容的网络应用程序框架,可以与 App Engine 配合使用。不必为了使用 App Engine 而使用 webapp:网络服务器支持任何使用 CGI 的 Python应用程序。webapp 提供一种简单的方式来开始为 App Engine 开发应用程序。 响应式网页设计的大部分技术,是可用在WebApp开发中的。 移动端Web App和WAP有什么不同?最直接的区别就是功能层面。WAP更侧重使用网页技术在移动端做展示,包括文字、媒体文件等。而Web App更侧重“功能”,是使用网页技术实现的App。总的来说,Web App就是运行于网络和标准浏览器上,基于网页技术开发实现特定功能的应用。

webapp_webapp -界面

元素变化

力求简洁明了是用户界面设计的重要原则。在同一时间给用户展示的功能越多,用户需要寻找和思考的时间也就越多。同样,界面中存在的选项越少,可用功能就越明显、越容易浏览。不过简化界面并非轻而易举,尤其是你不想减少应用程序功能的情况下。将高级功能隐藏起来是一种有效的简化方法。搞清楚在界面中用户最经常用的是哪些功能,然后把其他功能隐藏处理。这些可由下拉式菜单和控件完成。例如,搜索栏中的高级过滤器可以做成尾部的特殊下拉菜单样式。当用户需要这些过滤器的时候只需要几次点击就可以使用。决定哪些功能保留展示哪些需要隐藏起来,并不是一个简单的工作,需要取决于功能控件的重要程度和被使用的频繁程度。

增加阴影

弹出式菜单和窗口周边的阴影不仅仅是为了视觉美观。阴影一方面增大了菜单或窗口的尺寸,有助于将菜单或窗口从背景中区别开来;另一方面通过灰度化的边缘阴影可以屏蔽背景内容的噪音干扰。

这个技巧根植于传统桌面程序,帮助用户将注意力集中在弹出的窗口。由于很多模态窗口不容易从桌面程序内容页面中凸显出来,阴影可以使它们看起来具有立体效果、仿佛悬浮于其他内容之上,于是拉近了模态窗口与用户的距离。为实现这样的效果,设计师往往将透明的PNG背景图片作为容器,再把内容填充到容器中,同时等距离填充弹出框各边缘。或者使用具有透明边框的背景图片,并将内容框绝对定位在其中。另外,也可以使用基于JavaScript的lightboxes命令或者CSS3中的drop shadows命令,但需要注意浏览器是否支持。

提醒用户

当设计web app的时候,不仅需要关心一般情况下的信息展示,还要确保界面在空白状态时表现良好、具有指引作用。页面中还没有产生任何信息的时候,可以在空白区域放置一条帮助信息告诉用户如何开始。例如,一个项目管理的应用程序主页会列出用户的项目,假如还没有什么项目信息,可以为用户提供一个项目创建页面的链接。即使这个页面上已经存在了这样一个功能按钮,一个额外的帮助并不会有什么妨碍。这个技巧可以有效地鼓励用户试用该服务,并在注册后立即进行使用。通过应用程序的单一操作步骤可以帮助用户理解这个应用的优势以及对他们是否有用。

此外,只为用户展示最重要的功能选项也很关键。一股脑的将众多功能倾泻给用户并没有什么实际意义。需要牢记的是,用户通常想从应用中获得或多或少的信息,但却不想跳进细节中,用户没有时间也没有兴趣。在空白状态中激励用户,可以显着地降低用户的流失率,并帮助潜在的用户更好的理解程序系统是如何工作的。

Button

许多web app拥有自定义样式的按钮。默认的输入按钮可能不适合某些情景,文字链接有时候看起来又太含蓄。需要注意的是,把链接做成Button样式的时候,它们就应该有button的表现形式。比如,在点击button的时候它们应该会出现被“压”过的样子。这不仅仅是纯粹的视觉变化。及时反馈给用户,可以使web app感觉起来更灵敏,与桌面应用程序的用户体验更接近。可以使用CSS添加按钮的“pressed”等状态,实现在不同状态下显示不同背景图片的功能。

情境导航

在既定的情境下考虑用户希望看什么、需要什么是非常重要的。不需要在每一个地方都放置相同的导航控件,因为用户不是在任何情况下都需要它们。

上下文情境导航最好的一个例子就是Office 2007中,原先默认的工具栏集合被换成了带状控件形式。每一项tab控制着一组相关联的功能,如编辑图形、校对或者简单书写。Web app可以从这种上下文情境导航中获益,仅展示用户需要的、而不是所有可用的功能,从而保持用户界面的整洁清爽。

关键功能

并不是所有的控件都拥有相同的重要性。例如创建一个新的条目,页面中会有“创建”“取消”两个button. 这里的“创建”就要更加重要些,因为这是大多数情况下用户即将要做的事情。极少的情况下用户才会去点击取消。虽然这两个控件并排放置,但是不要给予相同的重视程度。

为了将注意力引导到“创建”上,我们可以尝试使用不用的风格或样式。一种方式是将“创建”设计成button样式,“取消”设计成文字链接样式。另一种方式是在视觉上使用使用不同的颜色,并使button略有凸起的效果。这样便于抓住用户的目光。

webapp_webapp -优点

第一、使用W3C标准的HTML(标准通用标记语言下的一个应用)语言开发,能够轻松实现跨平台,移动应用开发者不再需要考虑复杂的底层适配和跨平台开发语言的问题。与此同时,使用HTML来开发的Web App在投入上会大大的低于传统的Native App。

第二、基于当下开始普及流行的HTML5,Web App可以实现很多原本Native App才可以实现的功能,比如LBS的功能、本地数据存储、音视频播放的功能,甚至还有调用照相机和结合GPU的硬件加速功能。

第三、移动应用的迭代周期平均不到1个月,用户需要频繁的重新下载与升级。而Web App则无需用户下载,并且和传统网站一样可以动态升级。

第四、Web App有App的特性,更有Web的特性。每一个Native App在当前的用户使用场景下是相对孤立的,而Web App则可以像传统互联网网页那样相互链接,从一个Web App直接跳转到另外一个Web App。这无论是从用户的使用体验层面还是从应用之间的数据传输来看都是非常不错的选择。

webapp_webapp -简介

webapp webapp-界面,webapp-优点

WebAPP

基于浏览器开发并运行应用程序,是Google在设计Chrome时提出的概念,这是Google推广云计算的其中一步。Facebook也正在秘密开发一项名为“斯巴达”(ProjectSpartan)的项目,该项目将基于下一代浏览器标准HTML5开发WebApp应用。

所谓HTML5是互联网行业最新版本的Web标准,可以让网页能表现出更丰富的内容,包括一些更便捷的音乐、视频播放、玩游戏等。对于移动互联网行业来说,HTML5则带来了全新概念WebAPP―――一种页面直接适配于手机屏幕,且免安装免更新的APP,其实质是通过浏览器打开了某网站,而该网站能在手机上为用户带来类似于APP客户端的体验。

webapp_webapp -传统App的缺陷

对用户来说,传统App体验有明显缺陷。每个用户都会安装数十个App,但最常用的通常不超过5个。而且传统App的安装与更新必须需要通过应用程序商店,很多用户对此不胜其扰,而且非常耗费流量,而互联网软件是以更新频繁为特点的。

对开发者来说,App客户端跨平台成本高,暂且不论现在的终端平台五花八门,未来移动互联网很可能出现Google、Apple、Microsoft三足鼎立。开发者不得不需要针对上述所有的系统开发不同的版本。而开发不同平台和机型上的应用,占据的资金与精力投入,与开发一款新应用几乎相同。

AppStore新版本提交苹果进行审核至少需要两个星期,而用户下载使用之后的回馈,则至少需要一个月才能到开发者手里,这对于崇尚快速迭代的互联网产品来说,无疑是一个巨大打击。

webapp_webapp -优势

WebApp不仅弥补了传统App的缺陷,并且自身优势明显:

随着移动设备在硬件性能上的提升和浏览器效率的提高,基于浏览器开发的应用,其运行效率和展现效果,将很快追上基于操作系统的客户端App。更重要的是,建立在HTML5基础上的WebApp弥补传统App几乎所有的缺点,有望让移动设备的应用回到浏览器的平台之上。如基于浏览器的应用能够实现自动更新;HTML5的通用性使得WebApp可以在所有支持HTML5的浏览器上运行,形成巨大的平台优势。一旦苹果的APPStore中的应用不再具有数量和品质上的优势,苹果在移动设备上目前压倒性的优势也将逐渐失去。

另外,HTML5自身大大加强了对图像显示、视频播放的支撑能力,同时还提供了基于Javascript的2D绘图功能和基于WebGL的3D绘图功能,这意味着HTML5可以实现良好的网页游戏功能,而不需要任何插件或者扩展的帮助。

随着下一代协议标准HTML5的推出与普及,基于浏览器的WebApp有望在未来取代客户端App,成为移动互联网主流的应用模式。

当然组建WebApp模式的门槛也不低,由于HTML5还没有一个统一的标准,拥有浏览器内核才能为浏览器所支撑的应用提供最强的表现力和体验,目前拥有浏览器内核技术的厂商不多,国外的Chrome、Safari、Firefox、IE和国内的UC浏览器。

WebAPP的优势在于不需要去匹配各种操作系统和终端。因为UC优视的拳头产品手机浏览器,将成为这场WebAPP市场争夺战的主战场―――用户用哪种浏览器打开WebAPP,就等于为这种浏览器增加用户和流量。

打开最新Android版本的UC浏览器8.3,你会发现许多熟悉的APP图标出现在其中,包括网易邮箱、QQ空间、淘宝网、豆瓣电台等等。实际上,这些图标相当于浏览器内的“书签”,点击后会进入相关网站,但其中的内容看上去和客户端没什么两样。通过浏览器,你还能将这些图标移到手机桌面上,变成“真正”的App.

webapp_webapp -制作webapp的工具

常用工具


制作webapp的工具

ASP,PHP,HTML,JAVA等。使用这些常见的网络开发工具,可以制作绝大部分的webapp程序,使其在网站页面上实现传统的C/S架构软件的功能,也就是我们常说的SaaS模式。

其他工具

CBX,AthTekWebAPPKit等。CBX和AthTekWebAPPKit都是国产软件,它们的主要功能就是以将使用传统编程语言如C,C++,Delphi等开发的C/S架构客户端软件工程,以所见即所得的方式,快速部署到网络服务器上,让传统的编程语言也能够实现基于web的互联网应用程序开发。

快速创建

进入towebapp.com,可以免费快速创建webapp。有精美的模板和丰富的功能可以选择,有一个免费的二级域名,同时可以绑定自己的独立域名。

webapp_webapp -监测性能

测试工具:

qtestin,Keynote,YouMonitor等。通过这些在线监测可以对webapp的性能指标如:不同地区不同设备的响应时间、可用性、用户体验等进行监测。当然,有些服务是需要付费的。其中qtestin(又名云测宝)是国产,其他两家是国外的。

本地测试:

如在不同设备上测试webapp的兼容性等等,需要自己布置设备和收集反馈结果,特点是真实有效。

Web App、Hybrid App、Native APP对比


Web App(网页应用)Hybrid App(混合应用)Native App(原生应用)开发成本低中高维护更新简单简单复杂体验差优优Store或market认可不认可认可认可安装不需要需要需要跨平台优优差

webapp_webapp -开发

在iOS上开发APP,需要通过Objective-C那样精细复杂的语言去开发,这对广大的开发者而言是个不小的难题。值得庆幸的是,开发者们也可以通过开发Web APP来达到曲线救国的目的。也就是说,可以通过HTML、 CSS或者JavaScript来进行Web APP的开发。

其实Web APP说白了就是一个针对Iphone、Android优化后的web站点,它使用的技术无非就是HTML或HTML5、CSS3、JavaScript,服务端技术JAVA、PHP、ASP。

需要注意的是web app开发还是比较有限的。因为Web APP开发不能整合设备的核心功能,比如发文本信息,也不能充分使用APP Store进行销售和更新。但是Web APP开发也有其优势所在。

首先它解决了iphone APP的可扩展性问题,因为它是可以跨平台使用的。比如你开发了一款Web App,那么它既可以在手机iphone上使用,也可以再平板ipad上使用,而不像iphone APP那样只针对某个平台。

其次web APP也绕开了APP store严格的提交和更新审查规则。众所周知,随着APP store中的APP逐渐增多,APP store也推出了一系列的提交和审查规则,可谓相当之严格。而web APP则绕开了这些提交和更新审查规则,从而使得web APP的升级和维护变得更容易。因为它是一个独立的站点,而不是依附于app store上的,不管是升级还是维护在客户端进行即可,无需提交审核。

最后则是开发语言了。相比较Objective-C而言,HTML、CSS以及JavaScript学起来要容易多了。且对于传统开发者来说,HTML、CSS以及JavaScript基本都是可以直接上手的,省去了前期的培训工作。

  

爱华网本文地址 » http://www.413yy.cn/a/8103290103/47286.html

更多阅读

ie11 for win7优点缺点 ie11兼容性问题 win7优缺点

2、有些地方文件无法上传:如百度经验就无法上传文件,但是其它地方却可以上传。如下图:百度识图上传一张图片一下子就上传好了;而百度经验这边的上传很多年过去了还是一片空白(我试了很多次都无法上传,具体是什么问题不知);还有一些其它

怎样把QQ界面皮肤变成全透明 qq透明头像变成白色

怎样把QQ界面皮肤变成全透明——简介QQ透明皮肤很多人喜欢,可以DIY自己想要的皮肤,而且美观。以前还要下载插件才可以做到,不过腾讯为了满足用户的需要就自己设计了透明皮肤的功能。还不知道怎么设置的小伙伴快来围观哦怎样把QQ界面皮

怎样修改xp登陆界面 xp更改登陆界面

? ? 本文主题带给大家最新的电脑操作技巧:怎样修改xp登陆界面?高手请略过,希望以下内容能给您带来帮助,让你学习到更多实用的电脑应用技巧!? ? 提到更换Windows开机画面,很多朋友都会,不就是找一个eXeScope之类的工具修改、替换可执行文件

小米手机的优点与缺点? 小米手机的优点和缺点

小米手机的优点与缺点?——简介 小米3已经开始了几波的预订,小米3的手机希望能有所改进,不要辜负各国内同胞们的支持,自从前几代的小米概括,我们看看小米有哪些优点和缺点呢?这些优缺点都是大众评审们的总结,小编就拿来跟大家分享下。希望

思科模拟器:2 入门之界面简介

思科模拟器:[2]入门之界面简介——简介思科模拟器是网络工程师经常使用的网络实验模拟软件,它可以很快捷的模拟网络中的各种设备(交换机、路由器、台式电脑、笔记本电脑、服务器、网络云),搭建各种网络环境,模拟网络拓扑结构等。下面天

声明:《webapp webapp-界面,webapp-优点》为网友学渣无罪分享!如侵犯到您的合法权益请联系我们删除