一.H5功能測(cè)試

1、關(guān)注頁(yè)面請(qǐng)求。對(duì)于每個(gè)頁(yè)面，要查看發(fā)送的請(qǐng)求是否正確，請(qǐng)求的接口是否有重復(fù)，接口請(qǐng)求是否正確返回等?？赏ㄟ^(guò)chrome中自帶的開(kāi)發(fā)工具查看網(wǎng)絡(luò)請(qǐng)求。

關(guān)注是否有冗余接口請(qǐng)求，是否有不必要的重復(fù)接口刷新請(qǐng)求。 冗余和重復(fù)的接口請(qǐng)求會(huì)導(dǎo)致流量浪費(fèi)和響應(yīng)速度變慢。

2、關(guān)注application cache

（http://www.html5rocks.com/zh/tutorials/appcache/beginner/）, local storage（http://www.html5china.com/HTML5features/LocalStorage/20120519_3711.html）, cookie中值是否正確，頁(yè)面是否有使用application cache, local storage存放數(shù)據(jù)。清除這些數(shù)據(jù)后功能是否正確，獲取數(shù)據(jù)失敗后是否有重試機(jī)制。（可以用下圖Chrome開(kāi)發(fā)工具，進(jìn)行查看和清除，也可用postman,soupUi等）。 注意：老版chrome開(kāi)發(fā)者模式下在resource下查看cache，新版chrome在application下查看。

3、session失效機(jī)制。對(duì)于要登錄的，需要用到session的地方，要注意模擬session失效時(shí)，功能業(yè)務(wù)邏輯是否正常。

4、返回邏輯：對(duì)于頁(yè)面中的返回，以及瀏覽器自帶的返回的測(cè)試。 頁(yè)面中的返回要考慮業(yè)務(wù)邏輯，友好返回到相應(yīng)層次，需要從用戶角度考慮返回的轉(zhuǎn)跳邏輯，不能出現(xiàn)死循環(huán)。并要注意返回后是否需要刷新頁(yè)面請(qǐng)求，比如支付完后返回訂單列表，最好刷新

展示上一步購(gòu)買的訂單。

5、頁(yè)面刷新，刷新時(shí)的請(qǐng)求鏈接是否正確。

（1）下拉刷新是否仍然處于當(dāng)前頁(yè)面

（2）用戶主動(dòng)點(diǎn)擊刷新按鈕是否仍然處于當(dāng)前頁(yè)面

（3）刷新頁(yè)面或者加載新內(nèi)容時(shí)頁(yè)面是否有抖動(dòng)。

6、圖片適配，是否根據(jù)不同屏幕和分辨率做適配，高端機(jī)取雙倍尺寸的圖；是否對(duì)于2G網(wǎng)絡(luò)，或低端機(jī)單獨(dú)處理，不取高清圖或減少一些特效動(dòng)畫(huà)效果；最好加上webp圖片的支持，可減少流量；在中低端機(jī)上考慮是否需要讓前端單獨(dú)處理，去掉復(fù)雜處理。并

對(duì)中低端機(jī)只取原圖，不取高清圖。注意：webp格式只對(duì)android有效，放在IOS上反而會(huì)起反作用。

7、是否要增加轉(zhuǎn)場(chǎng)動(dòng)畫(huà)，loading動(dòng)畫(huà)，點(diǎn)擊動(dòng)畫(huà)等。以提升體驗(yàn)。需要在動(dòng)畫(huà)效果和卡頓上衡量。

8、對(duì)于隱私模式，不存cookie，不開(kāi)javascript執(zhí)行等，測(cè)試是否功能正常，或給出提示。

9、接口降級(jí)，接口異常時(shí)如何處理，前端要給出友好提示。

10、對(duì)于請(qǐng)求比較慢時(shí)，要有l(wèi)oading圖案，圖案在數(shù)據(jù)出來(lái)后要消失，且不能與轉(zhuǎn)場(chǎng)動(dòng)畫(huà)等其它有沖突。

11、輸入框的校驗(yàn)：特殊字符顯示，過(guò)濾黑詞，js是否會(huì)執(zhí)行，一連串長(zhǎng)字母是否會(huì)換行等。 比如只輸入空字符的處理。

12、弱網(wǎng)絡(luò)降級(jí)：處于2G/3G網(wǎng)絡(luò)省流量模式的一些特殊處理，比如2G網(wǎng)絡(luò)下測(cè)試，圖片多時(shí)是否要懶加載等。網(wǎng)絡(luò)狀況差的場(chǎng)景，可提示文案，但不能閃退。

13、網(wǎng)絡(luò)切換：從wifi切換到2G/3G網(wǎng)絡(luò)、從2G/3G網(wǎng)絡(luò)切換到wifi等

14、H5與Native切換：切換時(shí)登錄信息是否記錄、流程是否順暢、是否出現(xiàn)中斷閃退等問(wèn)題。 注意驗(yàn)證 登錄信息是否能互通。 不能出現(xiàn)native已經(jīng)登錄，進(jìn)入h5后繼續(xù)讓登錄，實(shí)在技術(shù)實(shí)現(xiàn)不了的可toast提示用戶繼續(xù)登錄。

（1）若客戶端已登錄，那么進(jìn)入H5后仍然是登錄狀態(tài)。

（2）若客戶端未登錄，進(jìn)入H5，點(diǎn)擊對(duì)應(yīng)按鈕OR鏈接，如果需要登錄，須拉起native登錄。若取消登錄，是否可再次拉起登錄，或者停留在的頁(yè)面是否有對(duì)應(yīng)的登錄提示。 （注：本次測(cè)試過(guò)程中就發(fā)現(xiàn)，第一次點(diǎn)擊鏈接，可以拉起登錄，第二次卻不能）

15、Pad上測(cè)試需要注意：橫屏和豎屏下的顯示效果可能不同，還有橫屏換成豎屏、豎屏換成橫屏。注意橫豎屏切換時(shí)輸入框的不同。

16.返回功能

通過(guò)H5頁(yè)面（非手機(jī)自帶返回鍵）的返回功能鍵返回，可以返回到正確的頁(yè)面（上一級(jí)/退出h5）

點(diǎn)擊返回與back鍵，回退頁(yè)面是否是期望頁(yè)面

17.屏幕切換

橫屏豎屏相互切換，能適應(yīng)，布局不亂，或頁(yè)面只支持橫或豎屏限制

18.分辨率適配更好

建議采用響應(yīng)式設(shè)計(jì)（如：offerlist頁(yè)面大屏顯示3行，小屏顯示2行）

1）分辨率高（如720*1280，重點(diǎn)關(guān)注頁(yè)面背景是否完全撐開(kāi)頁(yè)面，刷新是否有抖動(dòng)）、分辨率低（如320*480，重點(diǎn)關(guān)注下彈框樣式和文案折行）

2）android4.2版本以上的設(shè)備隨便測(cè)試一兩臺(tái)即可

3）蘋(píng)果近幾年常用的系統(tǒng)版本手機(jī)

19.頁(yè)面打開(kāi)形式

建議頁(yè)面在手機(jī)上從list點(diǎn)擊進(jìn)入detail頁(yè)面，要在原窗口打開(kāi)，通過(guò)頁(yè)面頁(yè)頭返回按鈕返回，不需要通過(guò)手機(jī)返回鍵返回，交互體驗(yàn)好

20.頁(yè)面請(qǐng)求驗(yàn)證

關(guān)注頁(yè)面請(qǐng)求，是否會(huì)有多余的請(qǐng)求，或者請(qǐng)求后有多余的數(shù)據(jù)返回，盡量精簡(jiǎn)，否則會(huì)浪費(fèi)流量。

21.圖片適配

圖片適配測(cè)試，根據(jù)不同屏幕和分辨率做適配，以及適配后的清晰度，高端機(jī)取雙倍尺寸的圖

22.用瀏覽器chrome f12進(jìn)行測(cè)試

H5的頁(yè)面在PC端也是能訪問(wèn)的，chrome對(duì)H5支持最好，功能的測(cè)試可以在PC端chrome下先測(cè)試，也可以在手機(jī)上直接測(cè)試，這個(gè)看個(gè)人習(xí)慣。（ie系列**ie8,及以下都支持的不好，這個(gè)可以與PD確認(rèn)H5頁(yè)面在這些PC瀏覽器上不支持）

23、滑動(dòng)、定位

手指滑動(dòng)是否流暢，手指點(diǎn)擊時(shí)焦點(diǎn)是否定位正確，不同機(jī)型會(huì)不一樣。焦點(diǎn)定位點(diǎn)擊是靈敏。

24、對(duì)于類似公司名稱、offer名稱長(zhǎng)度的問(wèn)題，在手機(jī)上最好能根據(jù)屏幕大小自適應(yīng)而不是截?cái)?，因?yàn)槭謾C(jī)上是不會(huì)有tips可以看的。截?cái)鄬?dǎo)致大屏幕下也只能顯示幾個(gè)字，交互不好

25、手機(jī)測(cè)試要特別關(guān)注交互是否友好，與PC機(jī)的事件模型不一樣，可能會(huì)導(dǎo)致一些體驗(yàn)的問(wèn)題，比如：彈出層的點(diǎn)擊，是否會(huì)穿透，影響到彈出層下面的頁(yè)面。

26、對(duì)于一些浮層做的頁(yè)面，例如地圖、產(chǎn)品分類等浮層，注意拖動(dòng)后是否可以看到它下面的頁(yè)面，拖動(dòng)后邊緣是否有留白

27、手機(jī)端的瀏覽器測(cè)試的時(shí)候也要清除一下緩存，因?yàn)閳D片和文件會(huì)被緩存下來(lái)，所以首次訪問(wèn)和二次訪問(wèn)體驗(yàn)不一樣。例如UC瀏覽器的清楚緩存在設(shè)置-》系統(tǒng)設(shè)置-》基本設(shè)置--》清除記錄中。

28.關(guān)注頁(yè)面首屏加載時(shí)間。

29、文件導(dǎo)入導(dǎo)出：

1、模板下載功能：

　　一般導(dǎo)出導(dǎo)出功能會(huì)有一個(gè)模板下載功能，此功能需要檢查模板是否可以正常下載，正常打開(kāi)，檢查Excel模板文件和網(wǎng)站中的數(shù)據(jù)字段是否一致即可。

2、文件導(dǎo)入功能

1) 錯(cuò)誤提示，

　　如果導(dǎo)入的excel表格中中某一行或者某一字段格式不對(duì)或者數(shù)據(jù)為空，是否可以正常導(dǎo)入正確部分的數(shù)據(jù)，對(duì)錯(cuò)誤的數(shù)據(jù)進(jìn)行提示。

2）導(dǎo)入其他格式的文件

　　當(dāng)導(dǎo)入的文件格式不正確時(shí)，系統(tǒng)是否做出正確的判斷，并給出對(duì)應(yīng)的錯(cuò)誤提示。

3）重復(fù)導(dǎo)入相同的文件

　　重復(fù)導(dǎo)入相同的文件是否可以導(dǎo)入成功，如果可以導(dǎo)入成功，數(shù)據(jù)將如何處理，比如覆蓋或者忽略？

4）不使用下載的模板，自己新建excel導(dǎo)入

　　自己手動(dòng)新建excel或者對(duì)其他excel進(jìn)行修改，使excel格式和模板一致，這種情況下數(shù)據(jù)填寫(xiě)正確的話，應(yīng)可以正確的導(dǎo)入系統(tǒng)。

5）表頭檢查：包括去掉、修改、新增列、列之間切換等

3、文件導(dǎo)出功能

1）導(dǎo)出的excel表格的格式檢查，主要檢查導(dǎo)出的excel格式是否符合預(yù)期，各字段是否正確。另外導(dǎo)出的excel文件名是否有要求。如果有要求，是否正確。

2）數(shù)據(jù)檢查，導(dǎo)出全部數(shù)據(jù)功能是否正確，到處部分?jǐn)?shù)據(jù)功能是否正確，選擇數(shù)據(jù)為空時(shí)是否可以導(dǎo)出。導(dǎo)出的數(shù)據(jù)內(nèi)容是否與網(wǎng)頁(yè)中的內(nèi)容一致。

二.適配測(cè)試

1）H5機(jī)型適配

在項(xiàng)目測(cè)試計(jì)劃給出時(shí)，確認(rèn)是否要確定測(cè)試機(jī)基線，即是否要以幾款機(jī)型作為最低適配需求。可參考目前應(yīng)用市場(chǎng)占有分布。

操作系統(tǒng)適配范圍：ios 8-10固件版本的iphone必須覆蓋，ios7可選覆蓋，android 4.4-6.x必須覆蓋，4.0-4.3可選覆蓋，4.0以下可以不care。像小米，魅族這種自定義os版本的機(jī)子，其實(shí)底層也對(duì)應(yīng)著標(biāo)準(zhǔn)的谷歌os系統(tǒng)版本。

對(duì)于ios, android大版本一定要覆蓋，對(duì)于系統(tǒng)版本，先看大版本占用情況，再選擇大版本中占用率較高的小版本。如4.3, 5.0大版本中選幾個(gè)占用率較高的小版本測(cè)試。常用的有：ios：8.x.x, 9.3.5；android: 4.3.1, 4.4.2 等。

機(jī)型品牌適配范圍：參考集團(tuán)內(nèi)后端統(tǒng)計(jì)的top機(jī)型。對(duì)于ios，要覆蓋iphone 6/6s/6p, iphone 7,iphone5等。

對(duì)于android,如三星、小米、華為，htc, lenovo，中興，魅族，阿里云等。屌絲機(jī)型 華為，中興，vivo，oppo,魅族占有率很高，所以這幾個(gè)屌絲機(jī)型一定要覆蓋到。三星上的H5問(wèn)題防不勝防，相當(dāng)極品。小米近一兩年的機(jī)型適配問(wèn)題不想2s那么多了。

三星常見(jiàn)的H5適配問(wèn)題：css加載不出來(lái)，控件操作無(wú)響應(yīng)。小米常見(jiàn)的H5適配問(wèn)題是UI，比如button會(huì)把這個(gè)按鈕四個(gè)角冗余顯示，tab切換異常。 實(shí)時(shí)滾動(dòng)信息時(shí)卡死等。

對(duì)于有些手機(jī)廠商有自已定制操作系統(tǒng)，要單獨(dú)適配，如小米，魅族。注意三星的假系統(tǒng)版本。

在選擇機(jī)子時(shí)，要兼顧屏幕尺寸和分辨率。覆蓋到主流的屏幕尺寸和分辨率，并組合一下，現(xiàn)在主流是1920大屏，但一定要找?guī)卓钚∑潦謾C(jī)覆蓋。注意三星的

適配時(shí)不能光選性能好的機(jī)子，一定要適配幾款中低端機(jī)。華為和中興的國(guó)產(chǎn)機(jī)，可選擇適配一下。

2）手機(jī)瀏覽器適配

需要覆蓋：自帶瀏覽器（默認(rèn)的瀏覽器內(nèi)核）為主，有足夠時(shí)間時(shí)再覆蓋chrome,UC瀏覽器（最新版）和QQ瀏覽器（最新版）。

3）容易出現(xiàn)適配問(wèn)題的機(jī)型：

三星i9100G，對(duì)于按鈕樣式，輸入框的區(qū)域要重點(diǎn)關(guān)注。

android 5.X 谷歌原生的nenux系列。

大屏高分辨率手機(jī)要適配一款，如三星galaxy note4

對(duì)于支持webp的機(jī)子要測(cè)試。如三星galaxy note2,或三星s3

4）工具

1.市面上各種云測(cè)平臺(tái)，一般都可以單獨(dú)測(cè)試H5適配。

2.可借助瀏覽器的開(kāi)發(fā)者模式。

三.性能測(cè)試

1) 需要關(guān)注的性能指標(biāo)：

頁(yè)面加載時(shí)間/頁(yè)面大小/頁(yè)面請(qǐng)求數(shù)/ DomReady時(shí)間/圖片等資源文件大小/請(qǐng)求錯(cuò)誤數(shù)

2) 各種云測(cè)平臺(tái)

3) 其他性能測(cè)試工具：dyna trace，yslow，page speed，firebug等等

4）免費(fèi)公共測(cè)試web：

http://www.webpagetest.org/ 免費(fèi)測(cè)試。

2）翻頁(yè)測(cè)試：

當(dāng)遇到翻頁(yè)加載的頁(yè)面，需要注意內(nèi)容為1頁(yè)或者多頁(yè)的情況。

（1）數(shù)據(jù)分頁(yè)加載時(shí)，注意后續(xù)頁(yè)面請(qǐng)求數(shù)據(jù)的正確。

注：這個(gè)需要注意在快速操作場(chǎng)景中，請(qǐng)求頁(yè)數(shù)是不是依次遞增，快速操作（如第一頁(yè)尚未loading出來(lái)的時(shí)候仍然繼續(xù)上拉操作）時(shí)是否發(fā)出去對(duì)應(yīng)的請(qǐng)求了。

四.安全測(cè)試

1）明確投放渠道都有哪些 ：

如獨(dú)客、主客、wap，是否對(duì)未投放渠道做了限制，直接通過(guò)url請(qǐng)求是否攔截等

2）評(píng)估是否需要接入集團(tuán)安全，如mtee黑白名單等

3）是否需要接入支付寶實(shí)名認(rèn)證：

涉及到金錢相關(guān)，如天貓積分，紅包等，為了防刷，一般都需要判斷是否支付寶實(shí)名認(rèn)證

4）是否接入windvane，所有請(qǐng)求通過(guò)native發(fā)出

1)、從代碼層級(jí)分析html5新特性帶來(lái)的安全漏洞。常見(jiàn)的：

通過(guò)formaction屬性進(jìn)行XSS

通過(guò)autofocus屬性執(zhí)行本身的focus事件

多個(gè)autofocus競(jìng)爭(zhēng)焦點(diǎn)來(lái)觸發(fā)blur事件

通過(guò)的poster屬性執(zhí)行Javascript

通過(guò)autofocus觸發(fā)的onscroll執(zhí)行Javascript

具體原理和其他漏洞可見(jiàn)http://html5sec.org/#html5

2)、從手機(jī)用戶角度列舉手機(jī)網(wǎng)頁(yè)存在的一些安全問(wèn)題（非測(cè)試角度）,大致有以下：

惡意url。包括html鏈接、短鏈接、短信中的url、掃二維碼產(chǎn)生的url

通過(guò)XSS竊取數(shù)據(jù)庫(kù)內(nèi)容。各種XSS可參見(jiàn)http://html5sec.org/#html5

自BeEF的攻擊（BeEF有點(diǎn)類似fiddler，具體可見(jiàn)

https://github.com/beefproject/beef）。包括cookie竊取、披露設(shè)備地理位置、打騷擾電話、不需要的下載

訪問(wèn)不安全的web服務(wù)。

竊聽(tīng)移動(dòng)網(wǎng)站流量。

五. H5上線后回歸

H5涉及到的各種資源文件，在測(cè)試環(huán)境（包括預(yù)發(fā)環(huán)境），一般都是內(nèi)域，正式上線，RD童鞋有把資源文件（或者說(shuō)url中的鏈接忘了修改）漏發(fā)的風(fēng)險(xiǎn)，所以上線后一定要用外網(wǎng)環(huán)境再快速回歸下。最簡(jiǎn)單的就是用自己的4G網(wǎng)絡(luò)回歸跟蹤線上。

六.H5測(cè)試與PC端測(cè)試不同的點(diǎn)

1、通過(guò)H5網(wǎng)頁(yè)（非手機(jī)的返回功能）的返回功能可以返回，不會(huì)出現(xiàn)無(wú)法返回的情況。

2、橫屏豎屏相互切換，能自適應(yīng)，并且布局不會(huì)亂掉；

3、為能在不同分辨率的手機(jī)上能更好的展示，建議采用響應(yīng)式設(shè)計(jì)（如：offerlist頁(yè)面在大屏?xí)r顯示3行，小屏?xí)r顯示2行）

4、在手機(jī)上從list點(diǎn)擊進(jìn)入detail頁(yè)面，要在原窗口打開(kāi)，這樣可以通過(guò)頁(yè)頭的返回按鈕返回，而不需要通過(guò)手機(jī)的返回鍵返回，這樣交互上更友好。

5、關(guān)注頁(yè)面請(qǐng)求，是否會(huì)有多余的請(qǐng)求，或者請(qǐng)求后有多余的數(shù)據(jù)返回，盡量精簡(jiǎn)，否則會(huì)浪費(fèi)流量。

6、圖片適配測(cè)試，根據(jù)不同屏幕和分辨率做適配，以及適配后的清晰度，高端機(jī)取雙倍尺寸的圖

7、H5的頁(yè)面在PC端也是能訪問(wèn)的，chrome對(duì)H5支持最好，功能的測(cè)試可以在PC端chrome下先測(cè)試，也可以在手機(jī)上直接測(cè)試，這個(gè)看個(gè)人習(xí)慣。（ie系列包括ie8,及以下都支持的不好）

8、手指滑動(dòng)是否流暢，手指點(diǎn)擊時(shí)焦點(diǎn)是否定位正確，不同機(jī)型會(huì)不一樣。焦點(diǎn)點(diǎn)擊是否靈敏。

9、對(duì)于類似公司名稱、offer名稱長(zhǎng)度的問(wèn)題，在手機(jī)上最好能根據(jù)屏幕大小自適應(yīng)而不是截?cái)?，因?yàn)槭謾C(jī)上是不會(huì)有tips可以看的。截?cái)鄬?dǎo)致大屏幕下也只能顯示幾個(gè)字，交互不好

10、手機(jī)測(cè)試要特別關(guān)注交互是否友好，與PC機(jī)的事件模型不一樣，可能會(huì)導(dǎo)致一些體驗(yàn)的問(wèn)題，比如：彈出層的點(diǎn)擊，是否會(huì)穿透，影響到彈出層下面的頁(yè)面。

11、對(duì)于一些浮層做的頁(yè)面，例如地圖、產(chǎn)品分類等浮層，注意拖動(dòng)后是否可以看到它下面的頁(yè)面，拖動(dòng)后邊緣是否有留白

12、手機(jī)端的瀏覽器測(cè)試的時(shí)候也要清除一下緩存，因?yàn)閳D片和文件會(huì)被緩存下來(lái)，所以首次訪問(wèn)和二次訪問(wèn)體驗(yàn)不一樣。例如UC瀏覽器的清楚緩存在設(shè)置-》系統(tǒng)設(shè)置-》基本設(shè)置–》清除記錄中。

七、H5各種測(cè)試總結(jié)：

（1）需求設(shè)計(jì)測(cè)試：

盡早的了解需求熟悉需求、參與需求評(píng)審與設(shè)計(jì)，通過(guò)原型圖以及真實(shí)用戶體驗(yàn)和用戶習(xí)慣來(lái)檢查需求的合理性以及是否有更好地實(shí)現(xiàn)方法等。

這樣能把問(wèn)題發(fā)現(xiàn)在源頭，減少后期因需求變更引起開(kāi)發(fā)和測(cè)試的迭代成本。

在需求階段即介入測(cè)試功能點(diǎn)的編寫(xiě)和記錄，也符合盡早介入測(cè)試的原則。

（2）接口測(cè)試

根據(jù)開(kāi)發(fā)同學(xué)提供的接口文檔，可以通過(guò)Jmeter 等工具進(jìn)行測(cè)試。

主要關(guān)注點(diǎn)為：

接口返回的數(shù)據(jù)期望的是否一致；

接口入?yún)⒌倪吔缰敌ｒ?yàn) ；

檢查接口的容錯(cuò)性 比如對(duì)于傳輸數(shù)據(jù)類型錯(cuò)誤能否處理等，整型的輸入小數(shù)、中英文等；

接口的性能情況，調(diào)用接口數(shù)據(jù)返回的時(shí)間，接口反應(yīng)慢肯定影響用戶體驗(yàn)。

接口的安全性：接口部分敏感信息是否加密傳輸?shù)?/span>

mtop接口返回處理：

發(fā)現(xiàn)這個(gè)出現(xiàn)問(wèn)題的地方有很多，但是只要有意識(shí)的去處理，就很容易避免，主要是有以下幾種情況：

（1）請(qǐng)求成功，且返回有數(shù)據(jù)，測(cè)試mtop接口返回?cái)?shù)據(jù)的各種場(chǎng)景。

（2）請(qǐng)求成功，但data內(nèi)容為空。

（3）請(qǐng)求接口異常，出現(xiàn)ERR_SID_INVALID::SESSION過(guò)期，拉起登錄。

（4）請(qǐng)求接口發(fā)生除C中提到的異常之外的異常，通?？蓺w結(jié)為一類進(jìn)行處理。

（3）功能測(cè)試

測(cè)試重點(diǎn)，根據(jù)業(yè)務(wù)邏輯和功能進(jìn)行測(cè)試，主要是可用性。

（4）用戶界面測(cè)試

根據(jù)測(cè)試和評(píng)審修改過(guò)的UED（用戶體驗(yàn)設(shè)計(jì)），測(cè)試開(kāi)發(fā)遞交的測(cè)試包。

風(fēng)格、樣式、顏色是否協(xié)調(diào)，不僅包括HTML5本身，因?yàn)镠TML5會(huì)嵌入App里面，所以要考慮 H5 的風(fēng)格、樣式、顏色是否與app本身協(xié)同，不至于格格不入，包括用戶習(xí)慣等也最好保持一致或相近，最好在設(shè)計(jì)初期就有顏色、按鈕、圖片、背景、邊框等詳細(xì)規(guī)劃和統(tǒng)一。

但是正是由于H5的可移植性，同一服務(wù)會(huì)嵌入到N家客戶的產(chǎn)品中，難以與各家都完全統(tǒng)一，所以在設(shè)計(jì)中就應(yīng)該考慮這些問(wèn)題。

（5） 兼容性測(cè)試

手機(jī)HTML5主要應(yīng)用是嵌入在app或者微信公眾號(hào)里面，所以兼容性主要是iOS、Android 2個(gè)系統(tǒng)各種主流機(jī)型的適配。

A、手機(jī)屏幕大小

B、主流手機(jī)機(jī)型

C、手機(jī)操作系統(tǒng)，iOS和Android各版本

D、瀏覽器：系統(tǒng)自帶瀏覽器和主流瀏覽器

（6）網(wǎng)絡(luò)測(cè)試

由于H5系統(tǒng)很多是云服務(wù)，所有響應(yīng)速度普遍較慢。我們測(cè)試的時(shí)候一般會(huì)用Wifi，速度會(huì)相對(duì)可觀點(diǎn)。

我們應(yīng)該觀察在4G、3G、甚至2G的網(wǎng)下，弱網(wǎng)測(cè)試，看響應(yīng)時(shí)間是否在忍受范圍內(nèi)。

時(shí)間過(guò)長(zhǎng)的話，需要提示優(yōu)化代碼做改善。

（7） 安全測(cè)試

由于我們對(duì)應(yīng)的產(chǎn)品部利用HTML5把一些通用功能做成了云服務(wù)，可以嵌入多家客戶的App，根據(jù)渠道劃分，所以安全性顯得尤為重要。

（8） 性能測(cè)試

隨著對(duì)接客戶的增加，對(duì)服務(wù)的性能方面的要求也會(huì)增加。對(duì)于云服務(wù)的模塊需要做性能測(cè)試。

原文鏈接：https://blog.csdn.net/weixin_42359436/article/details/82733078

關(guān)于我們：

Infocode藍(lán)暢信息技術(shù)有限公司成功為多家世界財(cái)富500強(qiáng)企業(yè)以及其他著名品牌提供優(yōu)質(zhì)服務(wù)，是您靠譜的互聯(lián)網(wǎng)開(kāi)發(fā)供應(yīng)商。

服務(wù)客戶遍及北京、上海、杭州、深圳、廣州、天津、青島、南京、寧波、蘇州、無(wú)錫、廈門(mén)、重慶、西安等大中型城市及地區(qū)    為您提供：H5開(kāi)發(fā)，小程序開(kāi)發(fā)，H5外包，微信開(kāi)發(fā)外包，H5商城開(kāi)發(fā)，小程序商城開(kāi)發(fā)，網(wǎng)站開(kāi)發(fā)外包，H5游戲開(kāi)發(fā)，小程序開(kāi)發(fā)外包，小程序設(shè)計(jì)、APP開(kāi)發(fā)外包，UI設(shè)計(jì)，SEO優(yōu)化，SEO外包，視頻后期制作等優(yōu)質(zhì)服務(wù)