Blog

跟踪网页设计的bug的第一步是检查你的HTML 和CSS，检查打字或语法错误。某些显示错误是由于浏览器以混杂模式显示页面造成的。因此，最好检查使用的是否符合自己的标识语言的DOCTYPE，从而让页面以标准模型来显示。可以通过安装Firefox开发人员工具条，了解页面将以什么模式显示。 如果页面以混杂模式显示，那么工具条最右边的对钩符号是灰色的，如果页面以标准模式显示，那么对钩符号是绿色的。可通过单击对钩符合来获得页面更多信息，并且显示地定义显示模式。 许多Windows开发人员以前主要使用IE浏览器开发页面，所以每次修改页面后，他们会在IE中预览页面，看看效果是否正确。在页面差不多准备好之后，他们在各个浏览器中进行测试并尽可能修改任何的Bug，但是，这样做可能会导致许多长期的问题。IE6是一个名声狼藉的浏览器，有很多Bug和几个重要的CSS缺陷。 如果使用IE作为主要开发浏览器，许多开发人员会错误地把IE的表现解释为正确，因此反而认为现在浏览器“破坏”了他们精心布置的CSS布局。实际上是IE破坏，它与现代标准浏览器存在不兼容。 所以选择更符合标准的浏览器（例如Firefox或Safari）作为主要的开发浏览器是为更安全的开发方法。如果你的布局在这其中一个浏览器中工作正常，那么它可能在所有符合标准的浏览器中都会表现正常，这样的做法是正确的。 但在消除网页中的Bug的一个最好方法应该是从一开始就要避免问题。许多Bug是由过分复杂的HTML或CSS造成的。因此，应该尽可能使用简单的代码实现所需的结果。所以要避免使用过分花俏的技术，只在绝对必须的情况在才使用hack。 如果使实现同一个效果有许多方法，在花费数小时调试某种技术之前，应该考虑是否可以采用另一种方法，只有在确认了没有解决问题的简单办法之后，才应该开始考虑复杂的解决方案。 在设计过程中出现了Bug，就需要尽力隔离问题，通过隔离问题和识别症状，有可能查明问题的原因并修复它。隔离问题的一种方法就是在相关的元素上应用边框或轮廓，看看它们的反应；或者尝试修改几个属性，看看它们是否影响Bug，如果有影响，查明是怎么影响的；尝试使用Bug的效果扩大化是有帮助的；或者尝试一些常见的解决方案，例如将position属性设置为relative，将display属性设置为inline或者设置宽度等尺寸，就可以修复许多Bug. 如果问题比较棘手，应该考虑创建一个基本测试案例。具体做法，（待续）。