如何预览你的HTML网页

桌面上的web浏览器图标

Alexander Hassenstein /职员/盖蒂图片新闻/盖蒂图片

许多人没有意识到当您在计算机上构建网页时,您就不必将其发布到web服务器为了查看它。当您在硬盘上预览web页面时,所有与浏览器相关的功能(如JavaScript、CSS和图像)应该与它们在web服务器上的工作完全相同。因此,在发布Web页面之前在Web浏览器中测试Web页面是个好主意。

  1. 构建您的网页并将其保存到硬盘驱动器。

  2. 打开Web浏览器,进入文件菜单并选择开放

  3. 浏览到你保存在硬盘上的文件。

测试问题

当在硬盘上而不是在web服务器上测试web页面时,有一些事情可能会出错。请确保您的页面被正确设置为测试:

  • 为链接使用完全限定的绝对路径。您可以使用页面相对路径对于您的链接,但是在页面上线之前测试链接的最好方法是使用您所链接的页面的完整路径。换句话说,在你的链接中包含域名。
  • 为图像使用与页面相关的路径。虽然您可以为图像使用完整的URL,但如果您正在测试的页面是新的,那么很可能您的图像不会像HTML一样上传到服务器。通过使用相对于当前页面的图像路径,当您在硬盘上测试文件时,它们就会显示出来。
  • 检查CSS和JavaScript外部文件的路径。对于脚本和CSS文件,使用完整路径或相对路径的url并没有一个好的经验法则——这取决于你的站点以及什么最适合你。相反,您应该验证您所指向的文件是否具有最新的信息。例如,如果您发布了CSS的全路径URL,那么您需要在测试时将该文件上传到服务器。

确保在多个浏览器中进行测试

一旦您在一个浏览器中浏览到您的页面后,您可以从浏览器中的位置栏中复制URL并将其粘贴到同一计算机上的其他浏览器中。当我们在Windows机器上构建网站时,在上传任何内容之前在以下浏览器中测试页面:

  • Internet Explorer
  • 歌剧
  • 火狐
  • Safari
  • 铬合金

一旦确定页面在硬盘上的浏览器中看起来是正确的,就可以上传页面并从Web服务器再次测试它。一旦它被上传,你应该与其他计算机和操作系统连接到页面,或者使用浏览器模拟器,如BrowserCam来做广泛的测试。

这个页面有用吗?