7.5 网站测试

网站的开发是一个系统工程，涉及到很多人共同完成，这么多人同时完成一个网站，可能会出现许多问题，如整个网站在设计上是否统一和谐、链接地址是否有错、不同的浏览器打开同一网页是否能正常显示等，这就需要我们对网站进行测试。网站经过成功测试之后，就要把它发布到Web服务器上，才能侈让别人欣赏。

1.页面效果是否美观

一个网站做的好坏很大程度上取决于页面效果，尤其是对那些不懂网站建设技术的人，他们就看你做的网站是否漂亮、美观、大方，所以一个网站中的页面效果对此网站的成功具有举足轻重的作用。对于页面效果是否美观，不同的人有不同的看法，那怎么办？没关系，一个网站不能保证所有的人都说美观，但是只要保证大部分人都说漂亮就行。

页面效果是否美观，其实是有据可依的，可以从“结构清晰，美观大方，用户界面良好，浏览方便快捷，实用性、创新性、交互性”等方面去判断，然后来完善、美化我们制作的页面。

2.链接是否完好

(1) 检查单个页面链接

若要检查单个页面链接，先打开此站点，接着将该文档打开，然后选择“文件”一“检查页”一“检查链接”命令，系统自动打开“结果”面板显示“链接检查器”面板，并显示链接报告，如图1所示，该报告为临时文件，用户可通过单击“保存报告”按钮将报告保存起来。

“显示”下拉列表框中共包含3种类型的链接报告：

● “断掉的链接”选项：显示含有断裂超链接的网页名称。

● “外部链接选项”：显示包含的外部超链接的网页名称（可从此网页链接到其他网站中的网页）。

● “孤立文件”选项：显示网站中没有被使用到的或未被链接到的文件，即孤立的文件。

如果为单个文件或是选定文件及文件夹应用“孤立文件”选项，则会弹出提示对话框，提示用户孤立文件报告是一个独立的属性，只能将其应用于整个网站，如图2所示。

图2 提示对话框

(2) 检查整个站点中的链接若要检查整个站点中的链接，先从“文件”面板中选择一个站点，然后单击“链接检查器”面板中的“检查链接”按钮，从弹出的菜单中选择“检查整个当前本地站点的链接”命令，在“链接检查器”面板中的列表框中显示链接报告，如图3所示。

图3 打开“检查链接”菜单

3.测试不同浏览器的兼容性

【1】 设置希望检查的浏览器及其版本

(1) 在“文档”工具栏中的“目标浏览器检查”菜单中选择“设置”命令，如图4所示。出现“目标浏览器”对话框，如图5所示。

(2) 选择每个您要检查的浏览器旁边的复选框，在这里我们选择Firefox和Microsoft IE(Mac)浏览器，如图5所示。

          

(3) 对于每个选定的浏览器，在其同行右边有个下拉列表框，从相应的弹出选项中选择要检查的浏览器的最低版本。

(4) 最后单击“目标浏览器”对话框中的“确定”按钮，即选定了希望检查的浏览器及其版本。

【2】 检查单个页面或整个站点的兼容性

(1) 在“文件”面板上的“本地”视图中，选择单个页面或包含整个站点的文件夹。

(2) 选择“文件”一“检查页”一“检查目标浏览器”命令。报告将显示在“结果”面板组中的“目标浏览器检查”面板中，如图6所示。

图6 检查单个页面不兼容报告

(3) 如果想了解不兼容的原因，请您在图7中的“目标浏览器检查”面板中选中一个列表项，然后右击鼠标，在弹出的菜单中选择“在浏览器中打开结果”命令，就可以打开一个页面，在此页面中可以查看到被检查网页中的元素不兼容的详细原因。

图7 查看不兼容的详细原因

点击下载第七章案例及作业资源 返回《HTML入门经典》教程列表