设计响应式网站的十个热门框架(Which Responsive Frameworks are Designers Using?)

All the mathematics involved in creating a responsive website design can be exhausting and time consuming, but thankfully there’s a range of responsive frameworks available that make the process quick and easy. These frameworks or boilerplates have all the complicated grids, layouts and media queries in place ready for you to add your own design and markup. Here’s a roundup of the most popular frameworks currently being used by designers.

 

Bootstrap

Bootstrap

Bootstrap, made by the folk from Twitter, has to be the most widely used framework. It is built with the most comprehensive list of features and can be quickly customised for each individual project.

Foundation

Foundation

Foundation is an advanced responsive front end framework based on a flexible grid that can be customised to your exact needs. This makes it easy to develop layouts for mobile and desktop devices using the same markup.

Skeleton

Skeleton

Skeleton is one of the more lightweight frameworks that’s based on a simple grid system. The Skeleton grid elegantly scales from 960px right down to tablets and mobile viewports in landscape and portrait.

Golden Grid System

Golden Grid System

If you’re passionate about grids, you’ll love the Golden Grid System. It starts as a 16 column grid with neat margins and gutters, but neatly folds up as the viewport is downsized to create 8 or 4 columns layouts for tablets and mobiles.

320 and Up

320 and Up

Some designers prefer progressive enhancement over graceful degredation. This is where the 320 and Up framework comes in. It’s designed to create layouts for small screens up, rather than from the desktop down, which ensures the content comes first.

Less Framework

Less Framework

Less is one of the classic frameworks that is based on a simple fixed width adaptive grid. It contains 4 ready made layouts and 3 typography presets to cater for desktop, tablets, mobile and landscape mobile viewports.

1140px CSS Grid System

1140px CSS Grid System

Creating responsive designs doesn’t just mean you’re catering for smaller resolutions, it also means you can go super wide for your maximum layout and still cater for the common desktop resolutions. The 1140 grid creates a nice screen-filling design on 1280px monitors and scales nicely for anything smaller.

Frameless

Frameless

Frameless shouldn’t really be in this roundup, seeing as it’s neither truly responsive or an actual framework. The core idea makes it easy to imagine and build layouts for infinite viewports, with the frameless grid simply adding columns as and when they’re required.

Wirefy

Wirefy

The idea of a responsive design doesn’t always make sense to clients, but it’s pretty time consuming building concepts to show them how it all works. EnterWirefy, the responsive wireframe framework that makes it easy to mock up layouts with elements such as slideshows, galleries, menus and forms.

Gumby Framework

Gumby Framework

If you’re new to responsive web design, the Gumby Framework might be a good place to start. It’s simple and lightweight, and unlike some of the more daunting frameworks, it actually comes with a PSD and UI Kit which makes it easy to mock up your designs the traditional way.

 

source link: http://line25.com/articles/which-responsive-frameworks-are-designers-using

translate to zh-CN: http://www.uisdc.com/which-responsive-frameworks-are-designers-using

Posted in Uncategorized

使用Rcov计算Rspec在Rails3项目中的测试覆盖率

在计算机的世界里有很多这样的事物,咋一接触它们觉得很生涩,太难用,但如果坚持下来,稍稍领会其精神,就会发现这个东西实在是太好了。在我看来,测试算是其中之一吧。从真正写测试到现在已经有一段时间了,从开始觉得写它是费力不讨好的观念也逐步转变成没有它心里就不踏实的状态。前两天在看文章时发现“测试覆盖率”这个词语,也许它存在很久了,但对于我来说还是比较新鲜的东西,赶紧拿来尝试一番,顺便也对自己的测试代码进行一番评测。下面就简单说一下我的经历

因为我的Ruby版本是1.8.7, 所以采用了Rcov用作测试覆盖率的工具(貌似还有一个选择simple_cov,但是针对ruby1.9开发的, 这里就没采用)。因为我的测试框架是采用的Rspec, 而Rspec又内在集成了Rcov的接口, 所以在使用起来非常简单。在Gemfile中加入 gem ‘rcov’ 后,依次执行以下命令

bundle install
rake spec:rcov

此时你的测试代码会挨个执行一遍,测试完成后会在Rails的根目录下多出一个coverage文件夹,用浏览器打开coverage/index.html即可看到rcov生成的报告了。

此外,你可能运行时会遇到rcov没有加载到rspec_helper的情况,这篇文章提到了这个问题,可能会帮助你解决,或者升级到rspec2.4.0也能解决问题。

no such file to load — spec_helper (LoadError)

关于测试覆盖率应该包含多个方面的概念,如业务覆盖,代码覆盖。这里所涉及覆盖率其实都是代码覆盖,即程序代码在测试时被调用执行的部分除以项目总代码的一个比例,因此100%的代码覆盖率只代表了所有的代码在测试时被执行过,并不代表代码的所有情况被执行过。比如下面例子

这段代码在测试时我只需要对这个方法进行一次调用即可达到100%的测试覆盖率,但当我调用price(10, 0)时仍然会出错,所以即使测试代码覆盖率达到100%了也不能安心睡大觉。那这个东西该在什么情况下使用呢?首先,忘掉这个东西,还是按照平时的方式写测试、写代码。待工作完成之后可以再捡起这个工具进行一番测试,检查出哪里的测试代码有死角没有测到,该修的修,该补的补。完成这些之后再忘掉这个东西,仅此而已。

http://stackoverflow.com/questions/5137650/rcov-outside-rails

http://www.ibm.com/developerworks/cn/web/wa-rails4/

Posted in Uncategorized