《HTML5+CSS3网页设计入门必读》——1.10 关于测试Web内容的提示

简介:

本节书摘来自异步社区《HTML5+CSS3网页设计入门必读》一书中的第1章,第1.10节,作者: 【美】Julie Meloni更多章节内容可以访问云栖社区“异步社区”公众号查看。

1.10 关于测试Web内容的提示

无论何时把文件传输到Web服务器上或者把它们存放在可移动媒体上以便于本地浏览,都应该立即彻底地测试每个页面。下面的检查表有助于确保Web内容像你期望的那样工作。注意:此时,有一些术语你可能还不熟悉,但是在你逐步学习本书并创建更大的项目时,可以回过头来看看这个检查表。

  • 在传输文件之前,要在本地机器上测试它们,以确保链接都会工作,并且内容反映了你想要的视觉设计。在把页面传输到Web服务器或可移动设备上之后,要把它们都再次测试一遍。
  • 利用尽可能多的浏览器执行这些测试,Chrome、Firefox、Internet Explorer、Opera和Safari就构成了一个良好的列表,并且要同时在Mac和Windows两种平台上执行测试。如果可能,要在低分辨率(800×600像素)和高分辨率(1920×1080像素)下检查页面。
  • 在开始测试之前,要关闭Web浏览器中的自动图像加载功能,以便可以查看每个页面在没有图形时的外观。检查alt标签的消息,然后再打开图像加载功能以加载图像,并且再次仔细地检查页面。
  • 使用浏览器的字体大小设置,以不同的字体大小查看每个页面,如果用户利用他们自己的字体规范覆盖了你的字体规范,确保你的布局不会散架。
  • 等待每个页面完全加载完成,然后一直向下滚动,以确保所有的图像都出现在它们应该出现的位置。
  • 测定每个页面在加载时要花多长的时间。它要花几秒钟以上的时间才能加载完吗?如果是这样,那个页面上的信息是否有足够的价值,从而可以使用户在页面加载完之前不会去往别的地方?诚然,宽带连接很普遍,但是这并不意味着应该加载带有1MB图像的页面。

如果你的页面通过了所有这些测试,你就可以高枕无忧了,你的站点已经准备好被公众查看。

相关文章
|
10天前
|
前端开发 JavaScript 开发工具
【HTML/CSS】入门导学篇
【HTML/CSS】入门导学篇
21 0
|
1月前
|
前端开发
web前端开发-----CSS样式设置
web前端开发-----CSS样式设置
30 0
|
1月前
|
前端开发
web前端开发---CSS基础选择器
web前端开发---CSS基础选择器
20 1
|
5天前
|
移动开发 前端开发 JavaScript
CSS选择器 前端开发入门笔记(十)
CSS选择器 前端开发入门笔记(十)
16 1
|
5天前
|
前端开发 搜索推荐 数据安全/隐私保护
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
14 1
|
5天前
|
PHP
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
|
23天前
|
移动开发 监控 数据可视化
组态软件之万维组态介绍(web组态、html组态、vue2/vue3组态)
组态软件之万维组态、web组态、html组态、vue2/vue3组态,组态在工业自动化领域越来越重要,但由于市面上组态软件费用昂贵、集成复杂,使用技术门槛高,万维组态就应运而生;万维组态是一款功能强大的基于Web的可视化组态编辑器,采用标准HTML5技术,使用Vue2和Vue3语言,基于B/S架构进行开发,支持WEB端显示;支持快速集成,集成简单方便;支持在浏览器端完成便捷的人机交互,简单的拖拽即可完成可视化页面的设计;可快速构建和部署可扩展的SCADA、HMI、仪表板或LoT系统;
组态软件之万维组态介绍(web组态、html组态、vue2/vue3组态)
|
1月前
javaWeb服务详解(含源代码,测试通过,注释) ——web.xml
javaWeb服务详解(含源代码,测试通过,注释) ——web.xml
7 0
|
1月前
|
安全 测试技术 API
请描述在 Python WEB 开发中常用的测试方法。
请描述在 Python WEB 开发中常用的测试方法。
16 0
|
1月前
|
Web App开发 前端开发 测试技术
Web应用程序测试工具Selenium用法详解
Web应用程序测试工具Selenium用法详解
37 0