响应平台 - 网格还是无网格?

时间:2013-04-26 13:41:00

标签: html css html5 responsive-design

我想为设计师和开发人员提供有关响应式设计方法的意见。到目前为止,我的经验是使用无网格方法,其中媒体查询在所需的断点处更改DOM元素。这使我能够非常灵活地适应设计规范。有时我会得到一个“网格”设计,它不会分解到正确数量的列,并且会使用像引导程序这样的标准网格系统搞砸(尽管我意识到你可以在一定程度上轻松地自定义引导程序)。例如,我曾经收到过一个包含10,8,5和2列布局的设计。

我担心的是,我可能是:

  • 使整个实施更难实现。
  • 结束复杂,脆弱(有时是意大利面条)的CSS。
  • 使未来的发展更加困难。

我很欣赏有关使用自适应网格或自定义网格的优缺点的任何意见。我们是否需要按照平台保持设计师的脚趾和QA设计?似乎有更多的网格灵活性吗?

我更愿意开始使用Bootstrap基金会,但欢迎任何建议。谢谢!

2 个答案:

答案 0 :(得分:2)

去年我们开始使用Twitter Bootstrap http://twitter.github.io/bootstrap/,它成为引导我们网络应用程序响应式设计的绝佳方式。

看看并检查您可以获得的好处。对我们来说,最大的好处是: - 跨浏览器&响应(当然); - 向开发人员提供优秀文档的指南(可能更大); - 轻松简单;

答案 1 :(得分:0)

如果您只是从头开始编写代码而不是使用一些预构建基础,那么我首先建议您查看XY CSS。 XY CSS允许您定义所需的多个网格列的多功能性。例如,您可以设计36个网格,这可能允许您在屏幕的宽度上包含36个单独的列。

另一个选择是使用预构建但相对简单的框架来修改,我建议Columnal。我喜欢Columnal,因为CSS内部编写得很好,并且它不是太复杂,同时也不是太简单而不能限制功能。它也很容易修改。

我建议反对Bootstrap,因为首先,我不是一个引导狂热者,其次,我发现它相当“臃肿”。膨胀我的意思是它为你提供了许多你不一定需要的垃圾,或者你想要的东西,但是你宁愿使用更快,更好记录或其他许多原因的不同系统。我的主要牛肉与引导程序是它最初是为Twitter制作的,然后他们说嘿让我们把它交给其他人并且他们修改了它的屎现在它是这种不友好的野兽,你几乎必须使用他们给的东西你是因为如果你不这样做,系统会动辄惩罚你,试图改变任何东西。我更喜欢坚持最初打算供像你和我这样的人使用的系统。出于同样的原因,我会建议基础或引导。

这是我个人的意见,除了我的意见外不应该被解释为。