H5 App设计者需要注意的问题】的更多相关文章

我们通常在做H5 APP设计的过程中,遇到很多看似很小,且很容易被忽略的问题,正是这些小问题,一次次的撩拨用户的耐心,让用户对你的APP心生怨念.现在WeX5君呕血为大家整理出H5 APP设计的21条禁忌,希望与H5 APP设计者的您共勉. 1. 不要在没有流程图之就前开始设计或者画线框图 即便一个简单的H5  APP 也要有一个思虑周全的流程图,以确保在H5  APP 有合乎逻辑的.合理的导航结构.另一点值得关注的是确保核心功能所在的屏幕位于上层而不是被埋没在多层导航元素之下. 跳过流程图直接…
我们通常在做H5 APP设计的过程中,遇到很多看似很小,且很容易被忽略的问题,正是这些小问题,一次次的撩拨用户的耐心,让用户对你的APP心生怨念.现在WeX5君呕血为大家整理出H5 APP设计的21条禁忌,希望与H5 APP设计者的您共勉. 1. 不要在没有流程图之就前开始设计或者画线框图 即便一个简单的H5 APP也要有一个思虑周全的流程图,以确保在H5 APP有合乎逻辑的.合理的导航结构.跳过流程图直接进进入开发会让开发变得复杂.不可控,很容易让用户迷茫,最后选择关掉或者卸载你的 App.…
1.ios h5 app avalon tap事件失效 使用MUI制作app界面,使用avalon.js渲染数据,发现在(Android上正常)ios上运行时容器div的avalon的ms-on-tap被内容遮住不执行.用MUI的on tap事件可以执行但改动较大,于是改为ms-on-click.(但是click事件有300ms延迟,解决方法在标题2处),搜索到以下解决方法: 解决办法有 4 种可供选择:(来自:https://happycoder.net/solve-ios-safari-cl…
随着各种应用的全面App化,因App而起的合作纠纷也日益增多,其中不乏最终对簿公堂的情形.WeX5(html5开发工具)为您汇总了三个典型的真实案例,方便您体会甲乙方冲突情景. 在围观别人争吵之余,您是否有了足够的警觉?是否想到了方法去规避这些争议? 围观之一:手机APP到底能干嘛?两万款是“打水漂”了吗? 据广州市高小姐讲诉,自己2014年初与一家信息科技公司签了合约,委托他们开发手机APP,并当场支付2.7万元.后来怀疑是骗局,想要追回预付款,却遭拒绝. 2014年1月20日,高小姐参加了一…
Jeffrey Way曾发表过一篇博文<28 HTML5 Features, Tips, and Techniques you Must Know >讲述了28个HTML5特征.窍门和技术,张鑫旭将本文进行了翻译,并做了适当编辑整理,本楼楼现转载于此,并附上一个H5实际演示案例,大家直接点击即可体验H5的强大效果.H5 App已势不可挡,希望本文帮助大家更了解移动应用开发.全文如下: 前端的发展如此之迅猛,一不留神,大侠你可能就会被远远地甩在后面了.如果你不想被HTML5的改变/更新搅得不知所…
2015年的最后几天,移动开发圈里最为火爆的话题之一无疑是“iOS程序员月薪降至12K”这则报道. 有人认为这是O2O创业遇冷所致,也有人认为这是iOS生态过于封闭致使智能硬件等新领域对iOS开发者的需求量不足所致.还有人认为是相关培训机构过多导致的结果等等. 其实,以上这些原因分析都只停留在了现象层面,未能触及本质. 当前是一个由技术来驱动社会变革的时代,所有社会和产业变革的根本驱动力一定都来自于某种技术变革.同样,所谓iOS开发者降薪这个业界现象,背后的根本原因依然是技术变革:移动开发的原生…
做H5 App页面时,有时候,按钮可能会放到页面的最底下,这个时候可能会用到绝对定位(position: absolute),但是,当input 输入框被点击时,弹出的软键盘会顶起底部的按钮,就像这样: 这个时候,可以给 底下的 Button 或者包含这个Button的Div  添加一个CSS样式:z-index: -1…
MUI:http://dcloudio.github.io/mui/(使用H5+app模式,号称是最接近原生,但是目前在手机和电脑浏览器无法使用) app-framework:http://app-framework-software.intel.com/ (有Android.iOS等主题样式可供选择,有强大的XDK编辑器支持) Ratchet:http://goratchet.com/ (同样有Android.iOS等主题样式可选,与Bootstrap类似的框架) Monaca.IO: Ion…
手把手教你用Vue2+webpack+node开发一个H5 app ​前一篇vue2 + webpack + node 开发一个小demo说到了用vue的一些基本用法,这一篇就讲一个复杂一点的更完整的例子,仿制一个H5 APP,这个APP就叫[one.一个],在百度搜索 one 就能找到啦[为什么仿这个呢,因为这是我用了很久的一个app呀…
基于vuecli3构建的一个快速开发h5 APP的模板,集成了高德地图.mint-ui,以及antv-f2可视化框架 vue-cli3安装 查看vue cli版本 vue --version 要求nodejs版本8.9以上 如安装了旧版,使用npm uninstall vue-cli -g卸载旧版本 安装vue-cli3.0 npm install -g @vue/cli 创建项目 vue create hello-world 选择安装配置选项 ◉ Babel ◯ TypeScript ◯ Pr…
H5+app 自动删除安装包 一.前言 之前做好的app自动更新,遗留下了一个问题,就是自动更新后安装包没有自行删除掉. 好像现在的手机的系统是有安装完自动清理安装包的.想我这个H5+的app安装完后是没有自动删除的,所以就需要用代码去删除掉. 二.解决方式 使用html5+plus,提供的IO模块来操作自动更新后遗留下来的apk文件. 参考文档: http://www.html5plus.org/doc/zh_cn/io.html IO模块:管理本地文件系统,用于对文件系统的目录浏览.文件的读…
1.前阵子在做系统的h5+ app为满足手机端也能进行业务操作,例如:提货,扫描入库之类的.所以就要将做接口,从手机端调用后台系统的方法. 2.例如这样的请求格式,但是呢,每次请求它都直接跳到error,刚开始还以为是网络问题,就连上wifi试了试,发现还是直接跳error.然后就开始怀疑请求格式了... 如下: function openScan(data) { mui.ajax(OPENSCAN, { data: data, dataType: 'json', type: 'post', t…
H5+app项目,在HBuilderX中设置 详情参考官方 https://ask.dcloud.net.cn/article/64 给h5+app设置scheme值,作用:在其它app和h5页面中启动该app,如下 在manifest.json文件的"plus"->"distribute"->"apple"下添加urltypes节点数据如下: "plus": { "distribute": {…
h5 app的全屏和沉浸式状态栏是不一样的 全屏模式 常见使用场景:如果页面是全屏游戏,一般会直接让状态栏消失,也就是页面全屏.webview高度全屏了,状态栏没有了.写法: 终端支持:没有终端类型限制高度处理:与状态栏透明相同,webview高度=屏幕高度,状态栏高度为0且不显示前景内容.需要注意dom里fix元素的调整. 使用方法 勾选全屏模式即可,也可以直接才配置文件manifest.json文件中添加的根节点下添加字段 "fullscreen":true 根节点应该理解吧 {…
H5 APP 页面移动端适配方案 https://segmentfault.com/a/1190000011586301 https://juejin.im/post/5cbdee71f265da03b57b5866 https://www.jianshu.com/p/2e20f868f385 https://github.com/BoleLee/mobile-web-pagefit https://segmentfault.com/a/1190000008767416 https://juej…
js & h5 & app & object storage API https://developer.mozilla.org/en-US/docs/Web/API Storage https://www.html5rocks.com/en/features/storage IndexedDB https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API https://caniuse.com/#feat=index…
一.最近做了一个app自动更新功能,用的基本都是网上找得到的. 1.h5+ 规范 :  http://www.html5plus.org/doc/zh_cn/maps.html 2.环形进度条插件:http://www.jq22.com/jquery-info4495(不知道什么原因,下载的时候,没有显示任何提示,所以人为加个下载的提示) 二.本来用的mui框架也有进度条提示,但是好单调,又不显眼. 1.效果如下,虽然说超方便的.mui 样式:http://dev.dcloud.net.cn/m…
  为期半个月的项目实践开发,已完整告一段落,团队小组获得第一名,辛苦总算没有白费,想起有一天晚上,整个小组的人,联调到12点才从公司回去,真是心酸.这里总结一下,项目过程中遇到的问题 和感悟.哈哈,放张集体照.嘿嘿,项目所有的不同的team的小伙伴,一群优秀的小伙伴(大多都来自高校211,985)么么哒.下面介绍下我们组的产品和问题. 项目已放在github上:https://github.com/foreverjiangting/myApp/tree/master/myApp/myApp 一…
这里详细介绍下如何用ionic+cordova+angularjs搭建自己的移动端app,包括环境搭建,框架使用等,具体项目已放置在github上,可下载下来自行启动. 下载地址:https://github.com/foreverjiangting/myApp/tree/master/myApp 一:环境搭建 1.配置java的运行环境,包括path变量的路径,这里不再详细讲解,请自行百度. 2.下载Android  Studio,并配置path变量,以及sdk路径.这个下载比较麻烦,请自行去…
if(window.plus) { plusReady(); } else { //plusready事件(自带事件)调用了才可使用h5+API document.addEventListener("plusready", plusReady, false); } // 扩展API准备完成后要执行的操作 function plusReady() { var ws = plus.webview.currentWebview(); //获取当前窗口对象 // ... code } func…
本文系博主原创,未经许可不得转载.如未经本人同意,私自转载或盗取资源提供下载,本人保留追究其法律责任的权利. 调试基于WebView的Hybrid App最舒服的工具当然是Chrome自带的开发者工具,其中有我们熟悉的Dom树调试,JS调试,Network监视等等功能. Google提供的调试Android上WebView的步骤: 开启手机上的USB调试功能 打开Chrome浏览器,地址栏输入:Chrome://inspect,回车 Chrome会自动检测手机上打开的App,并列出可调试的Web…
定位功能有两种方法: 首先要初始化内置地图: var map = new plus.maps.Map("map"); 这里黄色的map是html里面的id: <div id="map">地图加载中...</div> 1.调用GPS定位API(注意,使用了baidu和bd09ll参数,无需转换坐标) plus.geolocation.getCurrentPosition(function(p) { console.log(p.addresses…
在自己的一个用h5开发的项目中, 环境 IDE HBuilderX 打包工具 Hbuilder线上打包 开发语言 JS 现象 从一个列表进入详细页之后一直转圈圈.因为是调用系统原生的等待组件,界面无法操作(卡死). 分析 因为详细页和另一个页面功能相似,这个页面是从另一个页面拷贝过来略作修改,但是修改很小.另一个页面能够操作,但是这里却一直转圈圈. 结束等待操作是在页面执行了一个ajax请求后.所以有可能是ajax报错. 两个页面的函数\引用都是一样.另一个页面正常,这里却不对.... 这个页面…
直接上代码吧,你竟然搜到了我的文章就应该知道了,为什么要热更新 //app热更新下载 //假定字符串的每节数都在5位以下 function toNum(a) { //也可以这样写 var c=a.split(/\./); var c = a.split('.'); var num_place = ["", "0", "00", "000", "0000"], r = num_place.reverse();…
上个月,和朋友一起参加wex5的分享会,因为对cordova有些了解,始终不相信wex5的广告.五一假期,小试一下,果然不出我所料,有不少坑. 想下载IDE,竟然有1.7G,虽然现在网速快但是文件太大,很难用. 简单操作下,发现wex5更像是工具的组合,而不是整套的.在拼接的过程中,对于整个代码运行的周期没有做任何优化,仅是提供了一个开发工具和整合的框架. 为了弥补Cordova的缺陷,wex5自行制定的一系列“标准”,个人看来很难与主流融合. 1. 使用xid替换标准的id,但是导致代码的很难…
流应用开发 1.前端是HBuilder 编写的html页面,UI控件用MUI: 2.后台用Eclipse开发的Servlet做控制器: 3.前后台交互用MUI的Ajax. 在Hbuilder中选择在安卓手机(我的手机是安卓的)运行编写好的移动应用,前端写好登陆页面:后台使用Eclipse编写,采用MVC设计模式分层设计,包括连接数据库和操作数据库的UserDAO层,模型层User,控制层Servlet命名为UserAction,客户端发出的请求均经过Servlet拦截处理,业务包括增加用户,查询…
用H5开发微信还是开发APP? 随着技术的飞速发展,HTML第五版技术标准的更新,在移动端,由于其相对较低的开发成本及强大的跨平台运行能力,越来越多的信息型产品也开始选择这样轻量级的H5页面进行快速迭代,同时借用微信等平台快速触达用户. 如今App的红利时期早己消失殆尽,大家下载应用的热情已经不再像刚开始那么火热,再加上那么多烧钱BAT产品大佬培养的用户习惯,没点补贴很难吸引用户.直接在应用市场推App的成本也很高,这时web的优势就体现出来了,它很轻,迭代还快,而且现在有微信这么好的入口.坐拥…
现观目前市场上的APP横行,不同行业.不同类目的APP在国内各大应用市场挤爆的满满了,那么作为一个程序员或者一个企业如何能从容的把握住制作一款实用又符合用户体验的APP呢? 自从接触APP也有四年多了,这里我想简单的介绍下这两者的区别和程序猿.企业应如何正确又快速的做出此款APP的制作时涉及的技术方面的决定. 图1 以下我将以最通俗的说法分7点讲述: 一.概念 a) H5:即Html5,接触过互联网的都知道html,所以很明显h5是html的第5次重大修改的一项超文本标记语言的标准协议. b)…
最近项目中因各种客观因素,移动端都是默认用的纯H5 APP,感受最深的就是各种坑啊,好大的坑啊.产品上线后,带着各种坑后的总结原因方发现很多人都说纯H5 APP一次编写就能支持android和IOS两种不同的APP,大大降低了开发成本.可实际的工作中却发现并不是如此,既不省事儿,又有很多BUG,而且各种css的兼容性的问题一大堆,更不要说动画点不到这些问题啦,真是一个坑比一个坑深啊.即使如此,虽然还是有很多问题没有很好的解决,为什么还是有很多H5汇合APP开发的人呢.这里要提到一个刚刚当了奶爸不…
一.概念 a) H5:即Html5,接触过互联网的都知道html,所以很明显h5是html的第5次重大修改的一项超文本标记语言的标准协议. b) 原生:使用原生制作APP(Native app),即在基于目前的智能手机的操作系统(如安卓android.苹果IOS,另外还有windows phone)的基础上并且搭配原生的编程编写运行的第三方的移动应用程序,简称原生APP. 二.用户使用角度 一款APP展现给用户的时候,用户最关心的事是用户用最简单的操作完成我想要的东西或者是完成一些操作,用户不管…