一、时下最流行的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. Lesson 1-1

    1.1常见难记的几种运算符 1.1.1 除运算 ‘/’ 除运算的结果为小数,即浮点数. >>> 10/3 3.3333333333333335 >>> 10/2 5 ...

  2. 《剑指offer》平衡二叉树

    本题来自<剑指offer> 反转链表 题目: 思路: C++ Code: Python Code: 总结:

  3. centos下设置开机启动程序

    首先,设置权限, 由于/etc/rc.local是/etc/rc.d/rc.local的软连接,所以必须确保/etc/rc.local和/etc/rc.d/rc.local都有x权限(可执行) 执行命 ...

  4. Object.defineProperty()属性介绍

    对象是由多对key/value组成得无序集合,通过object.key=value来设置属性外,还可通过Object.defineProperty定义新属性或修改原有的属性. 语法:Object.de ...

  5. UMeditor控制多张图片上传顺序

    多张图片上传的顺序,受到用户使用习惯.插件上传和插件插入页面顺序的影响. 估计是考虑到上传性能,官方没有提供UMeditor控制展示顺序的配置.在上传过程中,用户点击拖动的第一张图片,将作为文件数组中 ...

  6. Oracle-分析函数之sum(...) over(...)

    概述 Oracle函数 很久之前更新了一篇Oracle的函数博文http://blog.csdn.net/yangshangwei/article/details/51425458,分析函数并没有包括 ...

  7. 部署Mvc Core SSL网站到Centos并用Nginx作为反向代理

    1. 先在本地比如~/Downloads下建立MVC项目 2. 生成mvc使用的ssl证书
 2.1. 生成.key文件
 openssl genrsa -des3 -out server.key 2 ...

  8. 微信小程序支付遇到的坑

    1,微信公众号支付和微信小程序支付有差异 微信公众号:可以直接跳转走h5的微信支付 微信小程序:在测试环境.沙箱环境使用微信公众号的跳转支付没有问题,在线上存在支付异常 最后商讨的解决方法 openi ...

  9. SQL Server 优化

    SELECT TOP 10 [Total Cost] = ROUND(avg_total_user_cost * avg_user_impact * (user_seeks + user_scans) ...

  10. OO Unit 2 电梯调度

    目录 OO Unit2 博客作业 基于度量来分析⾃己的程序结构 复杂度分析 架构分析 改进和重构 发现过的BUG 简化问题 多线程初探 OO Unit2 博客作业 基于度量来分析⾃己的程序结构 自认为 ...