一、时下最流行的H5到底是什么 ?有什么优势和劣势?

(1)H5 即HTML5,其实就是:移动端Web页面。

(2)优势:

    1. H5可以跨平台使用,开发成本相对较低
    2. H5可随时上线就更新版本,适合快速迭代
    3. H5可以轻量的触达用户,提供更便捷的服务
  • 在微信入口或者浏览器上,用户只需点开链接就可以获取我们锁提供的服务
         劣势:
  1. H5->app的转化强依赖于浏览器
  2. H5目前基本无法将数据存储在本地,依赖实时性数据,网络状态不好的时候卡到哭。
  3. 性能相对较低,影响用户体验
(3)如何判断是否是H5页面:

基本上只要对那个view长按,然后看是不是有反应,比如手机震动(Android)、或者出现文字选择粘贴(Android/iOS),那么就是WebView!

二、测试点总结:

(1)需求设计测试:

尽早的了解需求熟悉需求、参与需求评审与设计,通过原型图以及真实用户体验和用户习惯来检查需求的合理性以及是否有更好地实现方法等。
这样能把问题发现在源头,减少后期因需求变更引起开发和测试的迭代成本。
在需求阶段即介入测试功能点的编写和记录,也符合尽早介入测试的原则。

(2)接口测试

根据开发同学提供的接口文档,可以通过Jmeter 等攻距进行测试。
主要关注点为:
接口返回的数据期望的是否一致;
接口入参的边界值校验 ;
检查接口的容错性 比如对于传输数据类型错误能否处理等,整型的输入小数、中英文等;
接口的性能情况,调用接口数据返回的时间,接口反应慢肯定影响用户体验。
接口的安全性:接口部分敏感信息是否加密传输等

(3)功能测试

测试重点,根据业务逻辑和功能进行测试,主要是可用性。

(4)用户界面测试

根据测试和评审修改过的UED(用户体验设计),测试开发递交的测试包。
风格、样式、颜色是否协调,不仅包括HTML5本身,因为HTML5会嵌入App里面,所以要考虑 H5 的风格、样式、颜色是否与app本身协同,不至于格格不入,包括用户习惯等也最好保持一致或相近,最好在设计初期就有颜色、按钮、图片、背景、边框等详细规划和统一。
但是正是由于H5的可移植性,同一服务会嵌入到N家客户的产品中,难以与各家都完全统一,所以在设计中就应该考虑这些问题。

(5) 兼容性测试

手机HTML5主要应用是嵌入在app或者微信公众号里面,所以兼容性主要是iOS、Android 2个系统各种主流机型的适配。

A、手机屏幕大小
B、主流手机机型
C、手机操作系统,iOS和Android各版本
D、浏览器:系统自带浏览器和主流浏览器

(6)网络测试

由于H5系统很多是云服务,所有响应速度普遍较慢。我们测试的时候一般会用Wifi,速度会相对可观点。
我们应该观察在4G、3G、甚至2G的网下,弱网测试,看响应时间是否在忍受范围内。
时间过长的话,需要提示优化代码做改善。

(7) 安全测试

由于我们对应的产品部利用HTML5把一些通用功能做成了云服务,可以嵌入多家客户的App,根据渠道划分,所以安全性显得尤为重要。

(8) 性能测试

随着对接客户的增加,对服务的性能方面的要求也会增加。对于云服务的模块需要做性能测试。

关于H5页面的测试总结与分析的更多相关文章

  1. Hybrid App中原生页面 VS H5页面

    Hybrid App中原生页面 VS H5页面   现有3类主流APP,分别为:Web App.Hybrid App(混合模式移动应用,Hybrid有"混合的"意思). Nativ ...

  2. [转]h5页面测试总结

    转自http://www.blogjava.net/qileilove/archive/2014/07/24/416154.html?utm_source=tuicool H5页面测试总结 其实经过几 ...

  3. H5页面测试总结

    前言 在最近几个项目中,小编接触了较多关于H5页面的测试,H5页面的测试除了业务逻辑功能测试外,其他部分的测试方法基本是可以通用的,在此对H5页面的一些通用测试方法进行总结分享给大家. H5页面介绍 ...

  4. 【原】让H5页面适配移动设备全家 - 前端篇 - PPT

    7月份在部门内给设计中心的同事们带来<让H5页面适配移动设备全家 - 设计师篇 - PPT>的分享,在视觉和交互稿上提出页面适配的建议及提升页面体验的好处,促进前端和设计双方更好的合作,同 ...

  5. 【原】让H5页面适配移动设备全家 - 设计师篇 - PPT

    上一篇文章<pageResponse - 让H5适配移动设备全家>中分享了一个小插件让一套H5页面适配几乎所有移动设备,得到了一些同学的推荐和认可,这里感谢大家的支持. 在此之前也在部门前 ...

  6. 移动端H5页面高清多屏适配方案

    背景 开发移动端H5页面 面对不同分辨率的手机 面对不同屏幕尺寸的手机 视觉稿 在前端开发之前,视觉MM会给我们一个psd文件,称之为视觉稿. 对于移动端开发而言,为了做到页面高清的效果,视觉稿的规范 ...

  7. 那些过目不忘的H5页面

    原文链接:http://isux.tencent.com/great-mobile-h5-pages.html 从引爆朋友圈的H5小游戏<围住神经猫>,到颠覆传统广告的大众点评H5专题页& ...

  8. 领导让我重新做一个微信H5页面!

    leader:我们需要做一个微信H5页面,效果如图,功能如描述,时间越快越好. 需求是不是很简单呢?2015-11-24 12:44:00文末有最新更新 背景描述 前几天微信转发相关项目开发后,这是第 ...

  9. [转]:移动端H5页面高清多屏适配方案

    原文链接:http://www.tuicool.com/articles/YJviea 背景 开发移动端H5页面 面对不同分辨率的手机 面对不同屏幕尺寸的手机 视觉稿 在前端开发之前,视觉MM会给我们 ...

随机推荐

  1. LoadRunner基础知识

    什么是自动化性能测试?利用产品.人员和流程来降低应用程序.升级程序或补丁程序部署风险的一种手段 什么是自动化性能测试的核心?向预部署系统施加工作负载,同时评估系统性能和最终用户体验 LoadRunne ...

  2. swoole TCPsever

    <?php //创建Server对象,监听 127.0.0.1:9501端口 $serv = new swoole_server("127.0.0.1", 9501); $s ...

  3. 依赖背包——cf855C好题

    比较裸的依赖背包,但是想状态还是想了好久 转移时由于边界问题,虽然可以倒序转移,但当容量为0|1的时候,由于有初始值的存在 很难再原dp数组上进行修改,所以额外用tmp数组来保存修改后的值 #incl ...

  4. 运行Scrapy程序时出现No module named win32api问题的解决思路和方法

    有小伙伴在群里边反映说在使用Scrapy的时候,发现创建项目一切顺利,但是在执行Scrapy爬虫程序的时候却出现下列报错:“No module named win32api”,如下图所示,但是不知道怎 ...

  5. 原生JS插件(超详细)

    作为一个前端er,如果不会写一个小插件,都不好意思说自己是混前端界的.写还不能依赖jquery之类的工具库,否则装得不够高端.那么,如何才能装起来让自己看起来逼格更高呢?当然是利用js纯原生的写法啦. ...

  6. 使用docker 部署rabbitmq 镜像

    1.使用带有web管理功能 sudo docker pull rabbitmq:management 2.运行镜像文件创建容器 sudo docker run -d --name rabbitmq - ...

  7. IBOS云办公系统二次开发之功能介绍(PHP技术)

    IBOS自动化办公系统是我见到的功能.架构最好的开源自动化办公系统,功能与企业需求吻合度之高.架构之灵活,让我不得不将之介绍给大家,让跟多需要学习PHP开发的朋友来了解她,拥抱她! 如果您还没有很好的 ...

  8. 今天分享三种方法实现Linux系统调用,感兴趣的朋友可以参考一下

    系统调用(System Call)是操作系统为在用户态运行的进程与硬件设备(如CPU.磁盘.打印机等)进行交互提供的一组接口.当用户进程需要发生系统调用时,CPU 通过软中断切换到内核态开始执行内核系 ...

  9. Jmeter函数助手

    1.__Random:产生0-10之间的随机数[__RadomString:随机生成字符函数同__Random]

  10. Linux文件名匹配和输出重定向--2019-4-24

    1.文件名匹配 例:rm *.bak;   删除结尾是.bak的文件 rm *4*.bak; 删除名称中有“4”的.bak文件 ls *.????; 查找结尾是“.”后有四个字母的文件 2.管道 先进 ...