学习开发人员Web设计的最快方法

Question

我是一名Web开发人员，在我的项目中，我注意到我最薄弱的一点是不擅长前端设计。如果他们无法按照我想要的速度生产，那么依赖其他设计师会很烦人。

我对HTML / CSS的看法是它基本上是一个令人惊讶的大黑客。有太多的CSS和浏览器特定的错误/怪癖要学习和记住它们，而不花费大量的时间来解开一切。是否有快速通道将CSS引入我的大脑？我看了一些CSS书籍，但对我来说，他们真的阅读了如何在IE6中正确渲染事物以及如何使角落四舍五入的长列表。 （严重的是，为什么需要这么多技巧来制作一个尖锐的角落呢？在任何平台上，除了网络，这将被称为主要的疏忽。）

是否存在类似于jQuery为JavaScript做的CSS的东西？使用jQuery，你不需要很好地了解JavaScript就可以使它有效。

我对学习为什么IE6以奇怪的方式做事情并不感兴趣，因为我根本不关心支持它。我更感兴趣的是学习如何使用CSS来做我想做的事情，而不花费数小时阅读晦涩的博客。

Answer 1

铅笔和纸张勾勒出你的想法（用盒子思考，而不是三角形或六边形），然后分解所有的小部分并学习如何做每一部分。没有问题太大，无法分解。并且，像往常一样，TMTOWTDI！

查找示例并从中学习 - 至少这是我开始学习的方式。研究使用的风格并与它们一起玩耍。当你找到符合你喜欢的东西时，创建一个模型并玩弄它。然后测试它是否兼容跨浏览器。

如果你感到沮丧，因为某些东西在Firefox和Chrome中有效，但在IE中却没有（这会发生很多），不要放弃。我发现诅咒比尔盖茨的名字，他所代表的只是一个很好的缓解压力的人。 ： - ）

我喜欢使用的一个很棒的工具是Firebug，这是一个Firefox插件，它允许您在浏览器中编辑CSS规则，并在您完成后立即查看结果。

我同意CSS在网页设计世界中是一种事后的想法，但它是一个发明的地狱，使事情变得更加容易和快速。

Answer 2

是的，有CSS框架是'jQuery of CSS'。一些较受欢迎的内容包括 960 和 Blueprint 。我个人使用960并发现它需要大量的布局猜测。

正如其他人所说，通过阅读很难学习CSS。它最终成为你需要通过大量经验（通常意味着大量的试验，错误和挫折）发展本能所需要的东西之一。正如你所强调的那样，这不是一个理想的情况，但事实就是如此。

另一个困难是所采用的方法或工作流程在个人之间可能确实不同。有些人首先在Photoshop中进行模拟，然后使用HTML / CSS生成精确的逐像素“渲染”。其他人使用Photoshop，Illustrator或其他工具来简单地勾勒出想法，然后在HTML / CSS中从头开始重新创建它。还有一些人更喜欢直接使用HTML / CSS和一些缩略图草图。弄清楚哪种方法最适合你是蚂蚁的重要组成部分。

Answer 3

这需要时间和练习。但是如果你保持你的html干净和直截了当，你可以省去很多麻烦。以下是我能想到的一些帮助我的规则：

• 在您的html页面中使用DOCTYPE，从过渡开始，因为它具有最宽松的规则，并验证您的HTML。如果您将页面保持在标准模式而不是怪癖模式，那么您将全面解决问题。
• 选择您最早会支持的浏览器并按逻辑顺序支持它们。对我来说，我在firefox中开发，然后确保chrome / safari上的东西是坚实的。 IE可以使用一种特殊的注释，允许您插入仅对IE可见的html。使用它来添加IE7的样式表，然后IE6覆盖样式并修复这些浏览器中的任何显示问题。您通常应该先从最好的浏览器开始，然后向后工作。
• 小心填充。这是我处理过的最棘手的问题之一。如果可以，请选择使用带有边距的小子容器元素代替填充。它的标记更多，但所有浏览器的边距处理得更好。
• 相对定位元素内部的绝对定位元素。这解决了很多问题。当你相对定位一个元素时，它会保持在它的正常流程中。当绝对位置元素位于相对父级内部时，绝对项目将引用父级的位置。

Answer 4

在这种情况下，我认为书籍不会有多大帮助。 CSS非常容易学习，而且很难掌握。

我所能建议的就是随时随地学习......你需要很多经验！

或者，您可以放弃对IE7，尤其是IE6的支持。如果你这样做，你会发现很少甚至非常罕见的怪癖：）

Answer 5

参加平面设计课程。没有任何编程语言可以使你成为一名艺术家，并且良好的用户界面设计需要艺术性。

[或者你可以找到更好的图形设计师来使用]

Answer 6

订阅css-discuss，解决常见问题，并与其他人讨论您的进展。 wiki也是非常有用的资源。