启动网页设计需要哪些CSS工具(框架,网格系统,IDE,...)?

fab*_*474 2 css grails css-frameworks

我正在构建一个基于Grails技术的新WebSite.

关于我的网站的图形设计,我计划使用来自专业网页设计师的服务,但同时,我需要自己做一些基本的图形设计,以便拥有一个"用户友好的"测试版.

我已经阅读了stackoverflow.com网站,但无法下定决心.以下是我发现的: 你如何选择一个css-framework 什么是最好的css-grid-framework 可以 - 有人推荐一个铃声和口哨-css-框架 什么是最好的CSS框架,他们是值得的努力

但不幸的是,有许多矛盾的答案.首先,有人说使用CSS框架是向后创作而不是好事.其他建议YUI Grids,BluePrint,960 gs,YAML ......许多人说Compass允许轻松开发CSS布局并可重复使用.

所以考虑到:

  • 我是CSS世界的新手,我不打算成为一名网页设计师
  • 我的布局应该是用户友好的(但不是必要的令人敬畏的L&F)
  • 它应该是可维护的并且易于改进(由专业的网页设计师提供)
  • 易于实施(为了快速获得一些东西)

你有什么建议我开始使用我的网站的网页设计?

谢谢你的建议.

法比恩

Dav*_*itt 15

首先,如果您不打算成为网页设计师,我建议外包您的CSS.有几个网站,你可以提供HTML或Photoshop设计,并在盛大(1k)下编码.或者免费获得HTML/CSS设计.

然后有一件事你需要知道,另外两件你需要解决:

  1. 所有HTML都应该以语义和有效的方式编写:semantic =正确排序的标题,列表,没有过多的div等; valid =将通过WC3验证测试.这些都不是火箭科学,但仍然是一项需要学习的技能.Andy Clarke的Transcending CSS是一本关于语义HTML/CSS的好书.为了便于维护,HTML和CSS应该整洁并且一致地缩进等.

  2. 您需要确定是否需要管理后端和数据库来管理内容,或者您​​是否只是构建一个由静态页面组成的站点(即html和css文件,图像和其他媒体等).如果它是前者,那是另一个学习曲线:-)

  3. 你最好的技能是什么?如果您是一名优秀的设计师,请让其他人编写HTML/CSS,或使用现成的模板(网上有很多)并自定义它.这是多列布局的良好开端.如果你是一个程序员,学会使用像Django(Python),Titanium(Perl)这样的框架,在Ruby中更小的东西(因为Ruby on Rails有点大)或者用你最喜欢的语言.

好的CSS是一种工艺,简洁是本质,但如果你想学习足够的开始,我的建议是:

  1. 理解继承(CSS中的"级联")以及任何事物都可以成为"块" 的事实,所以不要使用大量嵌套的div来应用样式.相反,将样式应用于HTML元素本身,或仅在元素出现在父块中时应用(如边栏div中包含的菜单无序列表);

  2. 了解块和内联元素(Scratch的Web Design是一个很好的学习资源,我推荐它),CSS可以改变这种行为;

  3. 在Firefox中测试,然后在Internet Explorer中测试.> = IE7不是那么糟糕(但要注意HasLayout).您无法调整以在IE中正确使用,使用条件注释来添加只有IE可以看到的CSS - 从不使用CSS hacks - .htc文件可以添加缺少的IE功能(例如任何元素的翻转样式);

  4. 了解CSS定位,并谨慎使用'固定';

  5. 将所有CSS放在一个文件中(对于初学者),不要在HTML中使用内联CSS;

  6. 样式表单和表单字段几乎是一个单独的技能:-)

使用背景图像添加样式,但也了解您可以使用定位来偏移和重叠图像.但是,您需要使用PNG才能获得良好的透明度.哦,是的,不透明度看起来不错,但现在需要非标准的CSS.虽然更灵活的rgba(a = alpha)方法得到广泛支持.因为这样做的圆角,但都值得使用.

我现在避免使用CSS框架和重置 - 它们会在这个阶段通过添加另一个DSL来学习(但阅读参数优点和缺点)使事情变得复杂.为了避免恼人的默认边距和填充,我总是通过html *, body * {margin: 0; padding 0;}在需要的地方重新构建填充和边距来重置所有内容- 到目前为止从未成为问题:-)