我們?cè)趯?shí)際工作當(dāng)中，針對(duì)web應(yīng)用程序，也就是經(jīng)常所說(shuō)的B/S系統(tǒng)，可以從如下方面來(lái)進(jìn)行用戶(hù)界面測(cè)試：
導(dǎo)航測(cè)試
導(dǎo)航描述了用戶(hù)在一個(gè)頁(yè)面內(nèi)操作的方式，在不同的用戶(hù)接口控制之間，例如按鈕、對(duì)話(huà)框、列表和窗口等；
不同的鏈接頁(yè)面之間，通過(guò)考慮下列問(wèn)題，可以決定一個(gè)web應(yīng)用系統(tǒng)是否易于導(dǎo)航；導(dǎo)航是否直觀？web系統(tǒng)的主要部分是否可通過(guò)主頁(yè)存取?web系統(tǒng)是否需要站點(diǎn)地圖、搜索引擎或其他的導(dǎo)航幫助；
當(dāng)然，這些同美工以及客戶(hù)需求有關(guān)。我們是根據(jù)已經(jīng)確認(rèn)的頁(yè)面進(jìn)行測(cè)試即可。
圖形測(cè)試
圖形包括圖片、動(dòng)畫(huà)、邊框、顏色、字體、背景、按鈕等
（1）要確保圖形有明確的用途，圖片或動(dòng)畫(huà)不要胡亂的堆在一起，以免浪費(fèi)傳輸時(shí)間，web應(yīng)用系統(tǒng)的圖片尺寸要盡量地小，并且要能清楚的說(shuō)明某件事情。一般都鏈接到某個(gè)具體的頁(yè)面
（2）驗(yàn)證所有頁(yè)面字體的風(fēng)格是否一致
（3）背景顏色與字體顏色和背景色相搭配
（4）圖片的大小和質(zhì)量，一般采用jpg或gif壓縮，最好能使用圖片的大小減小到30k以下
（5）演示文字回繞是否正確，如果說(shuō)明文字指向右邊的圖片，應(yīng)該確保該圖片出現(xiàn)在右邊，不要因?yàn)槭褂脠D片而使窗口和段落排列古怪或者出現(xiàn)骨性。
內(nèi)容測(cè)試
內(nèi)容測(cè)試用來(lái)檢驗(yàn)Web應(yīng)用系統(tǒng)提供信息的正確性、準(zhǔn)確性和相關(guān)性。信息的正確性是指信息是可靠的還是誤傳的。信息的相關(guān)性是指是否在當(dāng)前頁(yè)面可以找到與當(dāng)前瀏覽信息相關(guān)的信息列表或入口，也就是一般Web站點(diǎn)中的所謂"相關(guān)文章列表"。
表格測(cè)試
需要驗(yàn)證表格是否設(shè)置正確，用戶(hù)是否需要向右滾動(dòng)頁(yè)面才能看見(jiàn)產(chǎn)品的價(jià)格？
把價(jià)格放在左邊，產(chǎn)品細(xì)節(jié)放在右邊是否更有效？
每一欄的寬度是否足夠?qū)?，表格里的文字是否都有折行?/span>
是否因?yàn)槟骋桓竦膬?nèi)容太多，而將整行的內(nèi)容拉長(zhǎng)？
整體界面測(cè)試
整體界面是指整個(gè)Web應(yīng)用系統(tǒng)的頁(yè)面結(jié)構(gòu)設(shè)計(jì)，是給用戶(hù)的一個(gè)整體感。例如：當(dāng)用戶(hù)瀏覽Web應(yīng)用系統(tǒng)時(shí)是否感到舒適，是否憑直覺(jué)就知道要找的信息在什么地方？整個(gè)Web應(yīng)用系統(tǒng)的設(shè)計(jì)風(fēng)格是否一致？
對(duì)整體界面的測(cè)試過(guò)程，其實(shí)是一個(gè)對(duì)最終用戶(hù)進(jìn)行調(diào)查的過(guò)程。一般Web應(yīng)用系統(tǒng)采取在主頁(yè)上做一個(gè)調(diào)查問(wèn)卷的形式，來(lái)得到最終用戶(hù)的反饋信息。
現(xiàn)在大部分客戶(hù)對(duì)界面的要求非常高，所以對(duì)于測(cè)試人員來(lái)講，也必須特別注意界面的一些東西。從前幾個(gè)項(xiàng)目來(lái)看，個(gè)人認(rèn)為界面測(cè)試的測(cè)試點(diǎn)以及應(yīng)該注意的問(wèn)題：
界面的線(xiàn)條是否一致，每個(gè)界面中線(xiàn)條是否對(duì)齊，是否一致。（靜態(tài)頁(yè)面沒(méi)有確認(rèn)的情況下）
整個(gè)系統(tǒng)的界面是否保持一致
界面中是否存在錯(cuò)別字
界面所有的按鈕樣式是否一致
每個(gè)界面是否同原靜態(tài)頁(yè)面設(shè)計(jì)一致（靜態(tài)頁(yè)面確認(rèn)的情況下）
操作是否友好
界面所有的按鈕、下拉框是否有響應(yīng)
界面所有的鏈接是否正常
界面所有的輸入框是否都進(jìn)行校驗(yàn)（例如：搜索框、字段輸入框）
界面所有的列表頁(yè)標(biāo)題字是否會(huì)折行，標(biāo)題字是否統(tǒng)一居中等，當(dāng)然也可以居左，這需要同客戶(hù)溝通（折行的話(huà)影響美觀）
界面所有的展示圖片是否樣式一致
瀏覽器的兼容性問(wèn)題，檢查頁(yè)面在不同瀏覽器下是否會(huì)發(fā)生異常
每個(gè)頁(yè)面的提示字體的顏色、格式是否統(tǒng)一準(zhǔn)確
界面中所有字段后面是否都存在冒號(hào)，有冒號(hào)，查看是否冒號(hào)為統(tǒng)一的中文冒號(hào)還是英文冒號(hào)。
界面中的提示說(shuō)明敘述是否太啰嗦，有時(shí)候需要能簡(jiǎn)化盡量簡(jiǎn)化，并且字體顯示格式一致，顏色統(tǒng)一。
在web網(wǎng)站，一般經(jīng)常是后臺(tái)控制前臺(tái)的顯示，因此在對(duì)后臺(tái)進(jìn)行數(shù)據(jù)添加時(shí)，查看前臺(tái)是否有變化，并且查看界面的數(shù)據(jù)是否溢出框外。
當(dāng)然，我們?cè)谶M(jìn)行界面測(cè)試時(shí)，必須明確UI測(cè)試的目的，它是確保用戶(hù)界面通過(guò)測(cè)試對(duì)象的功能來(lái)為用戶(hù)提供相應(yīng)的訪問(wèn)或?yàn)g覽功能。
確保用戶(hù)界面符合公司和行業(yè)的標(biāo)準(zhǔn)。
界面測(cè)試的方法要點(diǎn)
一、界面的測(cè)試要點(diǎn)：
１、標(biāo)題欄
a、標(biāo)題文字描述的正確性
b、標(biāo)題欄中（最大化、最小化、關(guān)閉）按鈕，根據(jù)窗口的特性，如沒(méi)有最大化或者最小化狀態(tài)的窗口，應(yīng)該不顯示最大化和最小化按鈕，或者把按鈕Disable狀態(tài)顯示。
２、文字
（1）文字描述的準(zhǔn)確性：
a、檢查文字的描述和所對(duì)應(yīng)的功能是否一致；
b、檢查錯(cuò)別字。
（2）文字用語(yǔ)的一致性：
（菜單、界面按鈕或者Label等、ToolTip、窗口標(biāo)題）
比如選項(xiàng)設(shè)置，在主界面的有按鈕可以進(jìn)入選項(xiàng)設(shè)置對(duì)話(huà)框，或者菜單中有菜單項(xiàng)可進(jìn)入選項(xiàng)設(shè)置對(duì)話(huà)框中，那么，按鈕、菜單、對(duì)話(huà)框的標(biāo)題都應(yīng)該統(tǒng)一用詞，如用“選項(xiàng)”或者“設(shè)置”，而不能又用“選項(xiàng)”，又用“設(shè)置”，或者還有其他的的用詞。
（3）為了全面的檢查所有的文字，應(yīng)該檢查程序中的所有文字資源，因?yàn)橐恍?duì)話(huà)框可能比較難在黑盒測(cè)試的時(shí)候能全部都出現(xiàn)過(guò)。
３、控件
（1）控件對(duì)齊：
a、并排關(guān)系的控件間應(yīng)該左對(duì)齊，同行的控件應(yīng)該橫向?qū)R。
b、有所屬關(guān)系的控件應(yīng)該縮進(jìn)。
（2）控件狀態(tài)：
a、不能操作的的控件的狀態(tài)應(yīng)該為Disable，這樣界面也起到引導(dǎo)用戶(hù)使用操作的效果。
b、有依賴(lài)關(guān)系的控件，比如（幾個(gè)選項(xiàng)供選擇（CheckBox或者RadioBox），每個(gè)選項(xiàng)下面都有獨(dú)立的設(shè)置（其他的控件：Edit、ComboBox、CheckBox等），那么當(dāng)所屬的選項(xiàng)沒(méi)有選中時(shí)，其下面的控件應(yīng)該是Disable的，相反為Enable。
（3）控件的TabOrder
控件的TabOrder應(yīng)該依次從上到下、從左到右的順序，界面中默認(rèn)的TabOrder應(yīng)該落在界面上的第一個(gè)Enable狀態(tài)的控件上面。
（4）控件的右鍵菜單支持
允許輸入的控件都應(yīng)該支持右鍵菜單，方便習(xí)慣使用右鍵菜單的用戶(hù)復(fù)制、剪切、粘貼、全選等操作。
（5）控件的操作方式
a、單行文本的Edit輸入框中，對(duì)回車(chē)符的支持：回車(chē)默認(rèn)操作是本窗口中的“確定”按鈕的功能。
b、在可操作的列表控件（List、ListView）中，鼠標(biāo)雙擊的操作、鍵盤(pán)操作都應(yīng)該有對(duì)應(yīng)的默認(rèn)操作。比如下面的圖中，雙擊列表中某一項(xiàng)，默認(rèn)操作就是Modify按鈕的操作；雙擊列表中的空白處，默認(rèn)操作應(yīng)該是Add按鈕的操作；選中列表中的項(xiàng)的情況下，按下Delete鍵，默認(rèn)操作應(yīng)該是Remove按鈕的操作。
（6）Edit控件對(duì)輸入的有效性判斷
a、類(lèi)型判斷：整型、浮點(diǎn)型的數(shù)據(jù)輸入框中，不允許輸入非表示數(shù)據(jù)的其他字符串（如：abcd或者其他字符等）；
b、大小判斷：數(shù)據(jù)類(lèi)型的數(shù)據(jù)如有大小范圍限制的，要對(duì)輸入的大小進(jìn)行判斷（如：表示月份的輸入框中，只能允許輸入1－12的數(shù)字。
c、長(zhǎng)度判斷：如果是程序處理的字符串有長(zhǎng)度限制，但是輸入框中沒(méi)有對(duì)輸入的數(shù)據(jù)長(zhǎng)度進(jìn)行限制，將有可能會(huì)造成程序錯(cuò)誤，或者處理后的結(jié)果和輸入的不相符合。
d、正確性判斷：表示路徑的或者文件名全路徑的輸入框，要對(duì)輸入的路徑是否為有效的路徑進(jìn)行判斷，如：輸入aaaa或者 C:////等為不正確的輸入。
４、圖片
圖片顯示的篇幅不要太大。
５、界面整體的顏色搭配
６、窗口在任務(wù)欄上的系統(tǒng)菜單
每個(gè)應(yīng)用程序，如窗口在系統(tǒng)任務(wù)欄上有縮小圖標(biāo)的，都應(yīng)該有系統(tǒng)右鍵菜單的支持（還原、最大化、最小化等），要測(cè)試右鍵菜單中各個(gè)項(xiàng)的Enable和Disable狀態(tài)的正確性以及功能的正確性。
二、提示對(duì)話(huà)框測(cè)試要點(diǎn)：
1、文字描述的正確性
2、圖標(biāo)顯示的正確性：
a、程序錯(cuò)誤、操作錯(cuò)誤、禁止操作等的提示：MB_ICONHAND, MB_ICONSTOP，MB_ICONERROR
b、詢(xún)問(wèn)的提示：MB_ICONQUESTION
c、感嘆、警告的提示：MB_ICONEXCLAMATION ，MB_ICONWARNING
d、普通信息的提示：MB_ICONASTERISK，MB_ICONINFORMATION
三、界面測(cè)試準(zhǔn)則：界面的正確性、一致性、友好性、易用性。
用戶(hù)界面測(cè)試是從最終的使用者用戶(hù)的角度來(lái)看軟件，軟件難以理解，不易使用就是軟件缺陷?？梢詮囊韵聨讉€(gè)方面重點(diǎn)來(lái)檢查用戶(hù)界面：
1、易用性檢查：確保軟件易于理解，方便使用。
2、一致性檢查：
A、注意系統(tǒng)頁(yè)面的風(fēng)格是否一致，如字的大小、顏色、字體要相同。
B、提示信息的表達(dá)方式是否一致。
C、按鈕排列順序是否一致。
D、back, cancel等按鈕跳轉(zhuǎn)頁(yè)面處理是否一致。
E、各字段的名稱(chēng)，位置、長(zhǎng)度、類(lèi)型是否和設(shè)計(jì)文檔要求一致，如Employee No和LoginName不一致。
3、正確性檢查：檢查頁(yè)面上的form, button, table, header, footer,提示信息，還有其他文字拼寫(xiě)，句子的語(yǔ)法等是否正確。
4、友好性檢查：
A、提示信息是否友好.
B、系統(tǒng)應(yīng)該在用戶(hù)執(zhí)行錯(cuò)誤的操作之前提出警告，提示信息.
C、頁(yè)面分辨率檢查，在各種分辨率瀏覽系統(tǒng)檢查系統(tǒng)界面友好性。
5、合理性檢查：做delete, update, add, cancel, back等操作后，查看信息回到的頁(yè)面是否合理。
6、檢查本地化是否通過(guò)：英文版不應(yīng)該有中文信息，英文翻譯準(zhǔn)確，專(zhuān)業(yè)。
7、頁(yè)面最大化檢查：測(cè)試最大化/最小化/還原時(shí)頁(yè)面是否做了對(duì)應(yīng)的處理。
聯(lián)系客服
