logo标签列表

开发者学习网页设计的最快方法

htmlcssfrontend
8
我是一名Web开发者，我注意到我的最薄弱环节是不擅长前端设计。如果其他设计师无法按照我想要的速度快速制作，那么依靠他们可能会很烦人。
我的HTML/CSS观点是基本上是一个奇妙运作的大Hack。有太多的CSS和浏览器特定的bug/问题要学习和记住，而不花费极大的时间来解决这些问题。是否有一条快速路线可以将CSS输入我的大脑? 我看过一些CSS书籍，但对我来说，它们实际上读起来就像是如何在IE6中正确渲染事物的长列表以及如何使角落变圆。 ( 说真的，为什么需要这么多技巧来使一个锐角变成圆角？在任何平台上除了Web这将被称为主要的疏忽. )
是否存在类似于jQuery对JavaScript的CSS类似物?使用jQuery，您无需深入了解JavaScript即可制作出工作的内容。
我不感兴趣了解IE6为什么以奇怪的方式处理事物，因为我根本不关心支持它。我更感兴趣的是一种学习如何使用CSS完成所需功能的方法，而不需要花费数小时阅读晦涩的博客。
你是否正在寻找有关为Web创建设计或编写实现该设计的代码（HTML，CSS等）的信息？虽然相关，但它们是不同的学科。 - Quentin
我发现自己更经常做后者。 - hekevintran
6个回答
5

用铅笔和纸来勾画你的想法（以方框为思考基础，而不是三角形或六边形），然后分解所有小部分并学习如何完成每一步。没有问题太大，不能分解。而且，像往常一样，TMTOWTDI（有多种方法做到这一点）！

寻找例子并从中学习——至少这就是我开始学习的方式。研究所使用的样式并尝试玩弄它们。当您发现某些东西能够实现您所需的功能时，请创建一个模型并进行测试以检查其跨浏览器兼容性。

如果您因为某些东西在Firefox和Chrome中有效，但在IE中无效而感到沮丧（这经常会发生），请不要放弃。我发现诅咒比尔·盖茨的名字及其所代表的一切是一种很好的减压方式。:-)

我喜欢使用的一个很棒的工具是Firebug，它是Firefox的一个插件，可以让您在浏览器中编辑CSS规则，并在您进行操作时立即看到结果，功能很多。

我同意，在网页设计领域中，CSS似乎是一种事后想法，但它确实是一个非常棒的发明，使开发变得更加容易和快捷。

3
是的，有一些CSS框架就像是“jQuery of CSS”。其中一些比较流行的包括960和Blueprint。我个人使用960，发现它可以很好地解决布局中的很多疑问。
正如其他人所说，通过阅读学习CSS是很难的。通常情况下，你需要通过大量的经验来培养对它的直觉感（这通常意味着大量的试验、错误和挫折）。正如你所强调的那样，这并不是一个理想的情况，但事实就是如此。
另一个困难在于，不同的人采用的方法或工作流程可能会有很大不同。有些人首先在Photoshop中制作模型，然后使用HTML/CSS精确地按像素进行“渲染”。还有一些人使用Photoshop、Illustrator或其他工具简单地勾画出自己的想法，然后从头开始在HTML/CSS中重新创建。还有一些人更喜欢直接使用HTML/CSS和一些缩略图草图来开始。找出哪种方法最适合你也是解决问题的重要一步。
2
它需要时间和实践。但是，如果您保持html干净且简单明了，就可以节省很多麻烦。以下是我能想到的几个规则，这些规则对我有所帮助:
  • 在您的html页面中使用DOCTYPE，从转换开始，因为它具有最宽松的规则，并验证您的html。如果将页面保持在标准模式而不是怪癖模式下，则整体上会遇到更少的问题。
  • 提前选择要支持的浏览器并以逻辑顺序支持它们。对我来说，我使用firefox进行开发，然后确保chrome / safari上的事情稳定。IE可以使用一种特殊的注释，该注释仅让您插入IE可见的html。使用它为IE7添加样式表，然后覆盖样式并修复这些浏览器中的任何显示问题。通常应该从最好的浏览器开始，然后向后工作。
  • 小心填充。那是我处理过的最麻烦的属性之一。当您可以时，请选择使用带有边距的小子容器元素代替填充。虽然这会增加标记，但跨所有浏览器处理边距要好得多。
  • 相对定位元素内的绝对定位元素。这解决了很多问题。当您相对定位一个元素时，它保持在其正常流中。当您在相对位置的父级内绝对定位元素时，绝对定位的项目将参考父级的位置。
1
在这种情况下，我认为书籍帮助不大。CSS非常容易学习，但要精通则极其困难。
我能建议的是边学边做。你需要很多经验！
或者，你可以放弃支持IE7，特别是IE6。如果你这样做，你会发现非常少且非常罕见的怪癖 :)
我认为说CSS易于学习和掌握是正确的，但某些浏览器的不兼容性使得实现变得困难。 - Dor
1

参加一些平面设计课程。没有任何一种编程语言可以让你成为艺术家，而艺术性是优秀用户界面设计所必需的。

[或者你也可以寻找更好的平面设计师来合作]

我觉得我没有很好地描述我的问题。我并不是试图创建新颖的美学网页设计。我正在尝试找出一种理解CSS如何产生某种外观的方法。 - hekevintran
1

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

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接