解决网页设计中的问题

当您遇到设计问题时采取的步骤

如果你曾经建立过一个网站,你可能会发现事情并不总是按计划进行。 成为一名网页设计师意味着您需要熟悉您构建的网站的调试问题。

有时,搞清楚你的​​网页设计出了什么问题会非常令人沮丧,但是如果你对你的分析有系统的理解,你通常可以找到问题的原因并更快地解决问题。 这里有一些提示可以用来实现这一点。

验证您的HTML

当我的网页出现问题时,我所做的第一件事就是验证HTML。 验证HTML有很多原因,但是当你遇到问题时应该是你做的第一件事。 已经有很多人自动验证每个页面。 但即使您习惯了这种习惯,在出现问题时检查HTML的有效性也是一个好主意。 这将确保它不是一个简单的错误,就像造成您的问题的拼写错误的HTML元素或属性。

验证你的CSS

下一个最有可能发生问题的地方就是你的CSS 。 验证你的CSS提供的功能与验证你的HTML相同。 如果有错误,这将确保您的CSS是正确的,这不是问题的原因。

验证您的JavaScript或其他动态元素

与HTML和CSS一样,如果您的页面使用JavaScript,PHP,JSP或其他动态元素,则应确保它们也是有效的。

在多个浏览器中测试

这可能是因为您看到的问题是您正在查看的Web浏览器的结果。如果您在每个可以测试的浏览器中都出现问题,那么会告诉您一些有关修复问题的信息。 例如,如果您知道问题只发生在某个浏览器中,那么您可以深入了解为什么只有一个浏览器可能会导致问题,而其他问题则可以。

简化页面

如果验证HTML和CSS没有帮助,那么您应该缩小页面以查找问题。 做到这一点的最简单方法是删除或“注释掉”页面的某些部分,直到剩下的部分成为问题的部分。 你也应该以类似的方式削减CSS。

简化背后的想法并不是说您只会留下固定元素的页面,而是要确定导致问题的原因并进行修复。

减去然后再加回来

一旦你缩小了网站的问题范围,就开始从设计中扣除元素,直到问题消失。 例如,如果您已将问题缩小到特定的

和对其进行了设置的CSS,请首先删除一行CSS。

每次移除后测试。 如果您已删除修复程序或完全删除问题,那么您知道需要修复的问题。

一旦你确切地知道是什么导致问题开始将其添加回已更改的项目。 务必在每次更改后进行测试。 当你在做网页设计的时候,很少有事情能够改变它,这是令人惊讶的。 但是,如果您不测试每次更改后页面的显示效果,即使看起来很小,也可能无法确定问题出在哪里。

首先设计符合标准的浏览器

Web设计师面临的最常见问题是围绕在大多数浏览器中使页面看起来相同。 尽管我们已经讨论过要让Web页面在所有浏览器中看起来都一样,但如果不是不可能的话,它可能非常困难,但它仍然是大多数设计师的目标。 所以你应该首先设计最好的浏览器,其中包括符合标准的浏览器。 一旦你有他们的工作,你可以与其他浏览器一起玩,让他们工作,包括可能仍然与您的网站的观众有关的旧浏览器。

保持你的代码简单

一旦你找到并解决了你的问题,你应该保持警惕,以防止他们以后再次出现问题。 避免问题的最简单方法是尽可能简化HTML和CSS。 请注意,我并不是说你应该避免做一些类似创建圆角的事情,因为HTML或CSS很复杂。 当一个简单的解决方案出现时,你应该避免做复杂的事情。

得到一些帮助

可以帮助您调试网站问题的人的价值不会被夸大。 如果你一直在看相同的代码,很容易错过一个简单的错误。 对代码的另一个眼睛往往是你可以为它做的最好的事情。

由Jeremy Girard于2/3/17编辑