WEB测试之UI测试

对于主页、门户及广告等网页，为确保用户界面能为用户来提供相应的访问或浏览功能，进行WEB界面测试显得非常重要。
界面测试就是指，布局是否合理、整体风格是否一致、各个控件的放置位置是否符合客户使用习惯，此外还要测试界面操作便捷性、导航简单易懂性，页面元素的可用性，界面中文字是否正确，命名是否统一，页面是否美观，文字、图片组合是否完美等。
一般情况下，WEB界面测试可以直接跟据产品原型图以及UI切图/效果图，进行对比验证，确认是否一致。当不存在原型图或UI切图/效果图时，可参考网络上同类型的成熟产品来做界面对比，且主要考虑以下几个方面：
· WEB整体页面测试
· WEB导航测试
· WEB图形测试
· WEB内容测试
· WEB表格测试
· WEB兼容性测试（平台兼容性/浏览器性）

※ WEB整体界面测试
整体界面是指整个Web应用系统的页面结构设计，是给用户的一个整体感。
Q1、当用户浏览Web应用系统时是否感到舒适？（带有主观性）
Q2、是否凭直觉就知道要找的信息在什么地方？
Q3、整个Web应用系统的设计风格是否一致？

※WEB导航测试
导航是指位于页面顶部或者侧边区域的，它起着链接站点或者软件内的各个页面的作用。
Q1、是否易于导航？导航是否直观？
Q2、Web系统的主要部分是否可通过主页存取？
Q3、Web应用系统导航帮助是否准确？
Q4、Web系统是否需要站点地图、搜索引擎或其他的导航帮助？
Q5、Web页面结构、导航、菜单、连接的风格是否一致？

※WEB图形测试
图形可以包括图片、动画、边框、颜色、字体、背景、按钮等。
Q1、要确保图形有明确的用途。比如banner页图片的广告宣传。
Q2、所有页面字的风格、颜色、格式是否一致？
Q3、背景颜色是否与字体颜色和前景颜色相搭配？——通常情况下不使用背景
Q4、图片的大小和质量也是一个很重要的因素，一般采用JPG或GIF压缩
Q5、需要验证的是文字回绕是否正确？——如果说明文字指向右边的图片，应该确保该图片出现在右边。

※WEB内容测试
用来检验Web应用系统提供信息的正确性、准确性和相关性。
Q1、信息的正确性是指信息是可靠的还是误传的。比如XXX实际面积有2W平方米，但网页信息显示为3W平方米，那信息就有误导性。
Q2、信息的准确性是指是否有语法或拼写错误。
Q3、信息的相关性是指是否在当前页面可以找到与当前浏览信息相关的信息列表或入口。

※WEB表格测试
表格经常和其他界面元素一起协同使用，主要承载数据的归纳、展示与对比的功能，是列表的一种。如大学选课页面。
Q1、界面表格布局、颜色、风格是否统一？
Q2、存在筛选条件、搜索控件，是否列于页面上方？
Q3、对于日期筛选条件，是否单独处理，展示出来？
Q4、对于多个搜索条件的场景，是否采用高级搜索按钮并将其打包收起？
Q5、对于多个搜索条件的场景，是否配置重置按钮，便于一键清空所有搜索条件？
Q6、在数据显示超过多条时(一屏无法完全显示，需要滚动查看时)，且表格中的数据不能直观的展示出数据类型，是否采用固定表头的形式，时刻显示数据类型？
Q7、当字段数量过多，需要横向滚动表格，且需要对比数据时，采用固定属性列字段？
Q8、是否支持排序？——上下箭头指示排序，一般上下空心箭头默认，上箭头为升序，下箭头为降序。

※WEB兼容性测试（平台兼容性/浏览器性）
Q1、平台兼容性：PC端和手机端的WEB兼容性测试。
Q2、浏览器兼容性：同一平台不同浏览器的WEB兼容性测试。

今天的文章WEB测试之UI测试分享到此就结束了，感谢您的阅读。