响应式设计框架的优缺点

聚焦Bootstrap 3和Foundation 5，让我们一起来分析使用其中一种框架构建自己的网站的优势与短板。

浏览器兼容性

浏览器调试所花的时间有时赶上了制作网站本身所花的时间。如果你可以减少调试浏览器所花的时间，那么就是在为客户节约成本（当然也是在保护的你的头发不那么早就掉光）。

响应式设计框架是一个基于在各种浏览器调试成功的框架。使用这些框架，可以大大减少建设网站时所耗费的时间（测试次数的多少取决于你定制了多少框架的内容，如果你仅仅只是改变了几个颜色而已，那么调试的次数就非常少；如果你把框架的网格系统改来改去，那么你就需要多番调试）。

最新的框架支持IE9及以上浏览器版本。在IE8上使用框架有一点点小技巧，但是框架完全不兼容于IE6和IE7。一般情况下，框架还支持其他浏览器，比如Firefox、Safari和Chrome，以及移动端浏览器。

不幸的是，如果你想要把框架应用在还没被调试过的浏览器上，那么你需要自行花时间来修改代码做测试。

自定义文件

Bootstrap或Foundation的下载包里面都含有最基本的网站构建文件，包括富有风格的图标和小部件。一些文件会比较大。一般来说文件都是可读的经过压缩的文件格式。

由于你所选的每个框架都是集大成的框架，所以介于你不需要完全使用整个框架的所有元素，Bootstra或Foundation允许你自定义下载自己需要的部分。所以你完全可以仅仅托用你需要的css和javascript文件包用在你的web上。这样就减轻了文件膨胀，并且也减少了下载时间，同时效果是（与你下载了整个框架包所用的效果）一样的。

但是，如果你想要添加一个之前被排除在外的小部件或者风格，现在你就得重新配置包。不过这完全是可以避免的。我建议首先以建立网站为首，不要去考虑外观。首先定制自己需要的特性，然后再来下载那些仅包含特定特性的包，一旦框架就位，你就可以开始定制网站的外观了。

注意：每当新版本的Bootstrap 或Foundation发布，你就得重新下载定制包。仔细记录下你所采用的和没有采用的文件，这样在文件更新时就不需要重复这个步骤了。

自定义代码

可能需要某种程度的自定义，框架不是下载下来就可以立即上线使用的。你可能会想要改变一些颜色。而如果你有一定的经验，或许你会直接攻克网格系统。

自定义代码仅仅是因为你使用一个框架并不是为了使你的网站显得很大众化。你可以自定义css来改善你的网站外观。要么引用LESS (Bootstrap) 或者Sass (Foundation)，要么直接自己写都行。

来自Bootstrap框架里的盒子样式是非常宽泛的。这里的假设就是你根本不会改变它们。所以你可以在一个单独的样式表里面引用LESS或Sass文件来覆盖它们。不幸的是LESS和Sass文件也是极小的，你需要额外的补充自己的代码。Bootstrap丰富的内置风格使它很受前端开发人员的欢迎。

Foundation有少量的风格基础。你也自定义一个样式表来覆盖它们、引用外部样式表，看起来完全自定义一个样式表会更加容易。总的来说在Foundation方面，没有一定基础的开发者会比较难以驾驭这个框架，因为它需要你首先掌握比驾驭Bootstrap需要更多的CSS 和Sass的知识。

Bootstrap和Foundation，可以在下载之前就被自定义，尽管需要简单改变一些LESS和 Sass。在Bootstrap里面，自定义选项用了几个页面来展示（与此相反，Foundation仅仅只是一点点的改变）。但是如果你对LESS和 Sass不熟悉的话，这就显得比较快捷但是比较肮脏。

同样的，你也可以通过定义javascript来定义功能。最新版本的Bootstrap和Foundation都支持使用jQuery来自定义部件。

如果你使用专门的屏幕来引用框架，那么在下次框架更新时，你还需要另外再自定义一次。

请留意Foundation拥有许多javascript分号，但是Bootstrap只有少量，这回影响开发人员的一个选择。

可访问性

可访问性对于开发者来说已经变得越来越重要了。这两个框架都有有效地HTML，但是我们有必要比较一下在HTML之外这两个框架的可访问性。

Bootstrap在 Joomla的帮助下取得了一定的进步。Joomla是一个开源的CMS，把Bootstrap引向了第3版本。Joomla的开发人员在它的可访问性方面做了很长的探讨，他们不希望Bootstrap减少CMS的可访问性，所以他们引用了ARIA规范和screen reader-only风格。

Foundation比较不幸的是到目前为止都还没有优先考虑可访问性。它不引用ARIA规范和screen reader-only风格。不过Zurb已经表示Foundation会做到更多.