《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图像的页面。

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

相关文章
|
2月前
|
测试技术 持续交付 开发者
探索自动化测试的无限可能:从入门到精通
在软件开发领域,确保产品质量是至关重要的。自动化测试作为一种高效、可靠的测试方法,正逐渐成为行业标准。本文将带你深入了解自动化测试的世界,从基础概念到实践技巧,帮助你掌握这一强大的工具。无论你是初学者还是有经验的开发者,都能从中获得宝贵的知识和启发。
|
2月前
|
Java 测试技术 开发者
初学者入门:掌握单元测试的基础与实践
【10月更文挑战第14天】单元测试是一种软件测试方法,它验证软件中的最小可测试单元——通常是单独的函数或类——是否按预期工作。单元测试的目标是确保每个模块在其自身范围内正确无误地运行。这些测试应该独立于其他模块,并且应该能够反复执行而不受外部环境的影响。
68 2
|
20天前
|
Java 开发者 微服务
Spring Boot 入门:简化 Java Web 开发的强大工具
Spring Boot 是一个开源的 Java 基础框架,用于创建独立、生产级别的基于Spring框架的应用程序。它旨在简化Spring应用的初始搭建以及开发过程。
38 6
Spring Boot 入门:简化 Java Web 开发的强大工具
|
1月前
|
Java 测试技术 持续交付
【入门思路】基于Python+Unittest+Appium+Excel+BeautifulReport的App/移动端UI自动化测试框架搭建思路
本文重点讲解如何搭建App自动化测试框架的思路,而非完整源码。主要内容包括实现目的、框架设计、环境依赖和框架的主要组成部分。适用于初学者,旨在帮助其快速掌握App自动化测试的基本技能。文中详细介绍了从需求分析到技术栈选择,再到具体模块的封装与实现,包括登录、截图、日志、测试报告和邮件服务等。同时提供了运行效果的展示,便于理解和实践。
95 4
【入门思路】基于Python+Unittest+Appium+Excel+BeautifulReport的App/移动端UI自动化测试框架搭建思路
|
1月前
|
Java 测试技术 Android开发
探索自动化测试的奥秘:从入门到精通
【10月更文挑战第37天】本文将带你进入自动化测试的世界,从基础知识到实战案例,逐步揭示自动化测试的神秘面纱。我们将一起探讨如何利用代码来简化测试过程,提高效率,并确保软件质量。无论你是初学者还是有经验的开发者,这篇文章都能为你提供有价值的见解和技巧。让我们一起踏上这段探索之旅吧!
|
1月前
|
机器学习/深度学习 自然语言处理 前端开发
前端神经网络入门:Brain.js - 详细介绍和对比不同的实现 - CNN、RNN、DNN、FFNN -无需准备环境打开浏览器即可测试运行-支持WebGPU加速
本文介绍了如何使用 JavaScript 神经网络库 **Brain.js** 实现不同类型的神经网络,包括前馈神经网络(FFNN)、深度神经网络(DNN)和循环神经网络(RNN)。通过简单的示例和代码,帮助前端开发者快速入门并理解神经网络的基本概念。文章还对比了各类神经网络的特点和适用场景,并简要介绍了卷积神经网络(CNN)的替代方案。
113 1
|
1月前
|
JSON 移动开发 数据格式
html5+css3+js移动端带歌词音乐播放器代码
音乐播放器特效是一款html5+css3+js制作的手机移动端音乐播放器代码,带歌词显示。包括支持单曲循环,歌词显示,歌曲搜索,音量控制,列表循环等功能。利用json获取音乐歌单和歌词,基于html5 audio属性手机音乐播放器代码。
110 6
|
2月前
|
测试技术 网络安全
什么是软件测试? 软件测试都有什么岗位 ?软件测试和调试的区别? 软件测试和开发的区别? 一位优秀的测试人员应该具备哪些素质? 软件测试等相关概念入门篇
文章全面介绍了软件测试的基本概念、目的、岗位分类、与开发和调试的区别,并阐述了成为优秀测试人员应具备的素质和技能。
266 1
什么是软件测试? 软件测试都有什么岗位 ?软件测试和调试的区别? 软件测试和开发的区别? 一位优秀的测试人员应该具备哪些素质? 软件测试等相关概念入门篇
|
2月前
|
前端开发 JavaScript 开发者
探索现代Web前端技术:React框架入门
【10月更文挑战第9天】 探索现代Web前端技术:React框架入门
|
1月前
|
前端开发
HTML 样式- CSS3
内部样式表适用于单个文件的特别样式,通过<head>部分的<style>标签定义;外部样式表适用于多个页面,通过<link>标签引用外部CSS文件;<style>定义样式,<link>引用资源;已弃用的标签有<font>、<center>、<strike>,属性有color和bgcolor。
下一篇
DataWorks