【问题标题】:How to get better at CSS, laying out designs and UI Programming? [closed]如何在 CSS、布局设计和 UI 编程方面做得更好? [关闭]
【发布时间】:2011-04-04 10:24:01
【问题描述】:

我对 CSS 非常熟悉,并且使用了相当多的 javascript 和 jquery,也很少有布局设计和与 Photoshop 密切合作的经验。但是,不知何故,我不像使用数据库或 C# 编程时那样自信,并且在我设计 UI 和按照我想要的方式布置元素时面临很多问题,例如比如说设计师给你的一个 .psd 文件......你想让你的页面看起来完全一样......

所以我知道我只需要更多地去做,并在此过程中学习。但是有没有人有什么好的建议或建议让我在 UI 编程方面做得更好...如果有一些网站有视频和教程或任何好书我应该参考改进..谢谢大家的帮助..

【问题讨论】:

    标签: css user-interface layout


    【解决方案1】:

    我在 2 年前安装了 firebug,并立即发现自己花了更多时间阅读其他人的代码 - 如果我看到我喜欢的网站或我想使用的技术,我只是 firebug 它 - 这是一个有点像音乐家阅读乐谱并想象它的声音

    我发现在这个网站上回答问题也对我有很大帮助 - 您可以准确地了解自己所知道的内容,并且更加了解需要改进的领域

    我认为了解 box-model 的工作原理以及如何使其适用于所有浏览器非常重要 - 有一些非常简单的基本规则,遵守这些规则会有所帮助你要确保你的 x-broswer 测试是无痛的——知道如何在不破坏布局的情况下为某些东西添加填充或边距可以让你的设计准确无误——我曾经在我的容器中留下 20 像素的额外水平空间作为使我的列永远不会掉出页面边缘的方法,但是现在我知道盒子模型是如何工作的,我可以使用我在模型中详细说明的确切宽度、高度、填充和边距给定

    我个人建议使用语义样式表框架 - 我建议使用蓝图语义(虽然 YUI 和 960 也很棒) - 事实上,切换到 CSS 框架可能是最重要的变化之一去年我采用了自己的编码风格,它帮助我意识到我遇到的几乎所有 x 浏览器问题都很容易解决,没有太多麻烦

    如果您还没有这样做,请将 "CSS""HTML" 添加到 stackoverflow 中的“有趣标签”列表中,并尽可能多地阅读.回答问题,在下巴上投反对票,品尝赞成票,并继续努力帮助他人解决问题

    很多人忘记的一件事是:CSS 实际上是一种非常复杂的语言。它还有很多让人眼前一亮的东西,而且很难掌握——just.keep.fighting.the.good.fight

    【讨论】:

    • +1 用于 Firebug。 UI设计师必备!
    • 我想说,抛弃 CSS 框架。它们只是一种发展辅助工具,实际上并不能帮助您学习任何东西。
    • ha @Yi - 从你的回答 here 我看到你对 CSS 了解很多 :) 我必须承认我需要框架的指导来学习最佳实践 - 我使用一个名为 Compass 的 Ruby gem 中的蓝图,它有关于某些事情如何以及为什么工作的优秀文档 - 但是,是的,你应该瞄准在没有框架的情况下进行编码 - 但是当你做得很好时,你意识到该框架只是为您节省了很多时间
    • +1 也适用于 Firebug。我在谷歌上问了一个类似的问题,然后来到了这个页面,即使它因为版主傲慢而被关闭。 :-)
    【解决方案2】:

    练习,练习,练习。

    我会在网上浏览现有模板或网站,并尝试复制它们以进行练习。

    显然,尊重作者的权利,不要重新创建某人的主题,然后在您的某个网站上使用它,除非它实际上已向公众发布。

    【讨论】:

      【解决方案3】:

      我会研究“语义 HTML”http://en.wikipedia.org/wiki/Semantic_HTML

      也在研究 Doctypes:http://htmlhelp.com/tools/validator/doctype.html

      曾经掌握的这两件事帮助我编写了合适的 x-browser css,当你需要它时,它看起来就像 comps。

      我会说避免模板化,除非你的设计师总是为 UI 制作相同的网站布局,你会希望比这更敏捷。

      一个对初学者也有帮助的好东西是一个很好的 reset.css:http://meyerweb.com/eric/tools/css/reset/

      【讨论】:

        【解决方案4】:

        我还会探索 UI 可用性领域。 useit.com 是一个很好的来源。

        【讨论】:

          【解决方案5】:

          如果您始终问自己是否可以以更好的方式做某件事,并在有疑问时使用 Google 查找这件事,您就可以边做边学。

          但是,您会发现书籍可以让您更全面地了解整个过程,并教给您很多个人博客文章无法教给您的东西。互联网就像一个参考;您必须知道要寻找什么,但本书将为您提供您可能没有想到的有用提示。

          【讨论】:

            【解决方案6】:

            我会看看CSS Zen Garden

            【讨论】:

              【解决方案7】:

              我也有过这种挫败感(我想很多人都有)。减轻这种挫败感的一件事是了解类和 id 的重要性(即 id 使 javascript 更容易,类促进大规模更改)。这听起来可能很简单,但这对我来说是一大步。我想我的意思是你只需要花时间来处理它。不要因为害怕或沮丧而回避。只是需要时间。

              【讨论】:

                猜你喜欢
                • 2011-02-16
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                • 2013-06-16
                • 1970-01-01
                • 2021-11-02
                相关资源
                最近更新 更多