EthanMarcotte说响应式设计是基于网格构建网站。在Marcotte定义了这项技术之后，响应式设计框架开始出现，主要是CSS和JavaScript的结合。许多框架都是开源的，可以免费下载并且可以快速定制。目前最热门的框架是Bootstrap和Foundation。随着响应式设计框架越来越流行，一个巨大的争议随之而来：专业设计师为什么要使用这些框架？许多人声称响应式框架很糟糕，因为他们不会一点html和css。以下是一些其他反对使用框架的标志性论点：设计师可以编写自己的框架，如果他们了解一点html和css，他们应该这样做。基于框架的网站加载速度非常慢。基于框架的网站看起来大同小异。使用冗余的div标签、5000多行css和更多的javascript文件，网站膨胀很常见。尽管遭到反对者的强烈抗议，但该框架的持续流行并未受到丝毫影响。我认为框架是有用的，即使是最有经验的Web前端开发人员也可以好好研究一下。下面我就说说我支持框架的理由。Paul-rand美国网站PaulRand是使用Foundation1.ResponsiveDesignFramework构建的一天早上，我在看东北PHP大会上翻译PHP开发者EliWhite的一个重要演讲，他在谈论web和的演变过去20年的PHP。他提出了一个观点：15年前，后端开发人员从头开始构建一切。那时候没有多少可用的开源资源，也没有专用的内容管理系统(CMS)或花费数十万美元。如果你想为你的网站做一个概述，那么你需要自己从头开始写一个。现在在2014年，后端开发人员不再这样做了。现在他们可以使用SurveyMonkey的API在10小时内为用户创建内容，而不是100或1000小时。SurveyMonkey的代码是不是更恐怖？它们是最有效、最巧妙的吗？我不是PHP开发人员，我不知道这个问题的答案，但是API一直在被测试和调试，它工作得很好，很早以前就可以在你的其他项目中使用，这就是它的价值。White说，除非你的客户想要非常具体的东西并且有足够的资金支持，否则大多数PHP开发人员没有理由在2014年从头开始编写他们自己的配置文件。那么~有什么可以等同于快网站前端技术呢？不幸的是我们没有。目前我们有两种选择来创建网站前端。第一个选项是下载主题（或模板）。通常用于基于CMS的网站，主题可能会提供一些颜色选择和一些变量调整。另一方面，与整个网站的成本相比，大部分主题都是免费或低成本的。下载一套主题，更改颜色和更改徽标非常简单。更重要的是，一套好的主题会定期更新。并且它会附带文档，使修改非常直观和容易。不利的一面是，一套主题可能会被很多人使用，看起来并不是很新颖独特，更像是属于一个特定的内容管理系统。另一种选择是自己完全定制的解决方案。需要聘请设计师来讨论品牌计划。他们将经历反复设计和多次修改。他们可能直接在浏览器上实现原型，或者用html和css在网站上实现设计稿。使用CMS整合设计，考虑不要使用后台管理，保证最好的成品交付给客户。另一方面，每个标签都精准放置，代码完全互补，没有丝毫多余的标签。然而，为了实现这一点，开发人员必须训练有素且经验丰富。一旦此类高级别会员加入，项目价格将直线上升。项目由小客户目标转向大客户目标，成本会上升。另外，除非把额外的成本花在写文档上，否则一旦初始成员离开，新成员就必须重新阅读老成员的代码，熟悉它，然后再修改，这是一笔不小的成本。我在哪里可以下载介于互联网上的低端设计和昂贵得离谱的高端定制之间的东西？相当于后端开发人员的API或代码库？我们可以为前端创建一些定制的东西吗？我们需要能够采用一些预先编写的元素，将它们添加到自定义列中，并开发介于低端和高端之间的自定义解决方案。我们不再需要从头开始构建框架，我们可以节省时间！我是说我们应该放弃定制解决方案的框架吗？不，当然不。在web开发的世界里，已经存在完整的自定义解决方案，就像CMS的存在一样，各有各的用武之地。如果您的客户有时间和金钱来打造最好的结果，为什么不呢？但是你要知道，客户一般没有足够的资金和时间等着你从头开始构建。也许“不破解”是允许的，也许需要下载的代码会稍微长一点，但这个解决方案会被记录下来，对开发起到非常积极的作用。能快速生产出不逊色的产品，值得。在web世界中，其他技术在处理响应式设计方面各有优缺点，所以我们可以给这个框架好好看看。GrkGrk，使用Bootstrap构建。#p#二、响应式设计框架的优缺点聚焦Bootstrap3和Foundation5，让我们分析一下使用其中一种框架搭建自己网站的优缺点。浏览器兼容性浏览器调试有时会超过制作网站本身所花费的时间。如果您可以减少花在调试浏览器上的时间，那么您就可以为您的客户省钱（当然也可以保护您的头发不至于过早脱落）。响应式设计框架是基于在各种浏览器中成功调试的框架。使用这些框架可以大大减少建站的时间（测试次数取决于你自定义框架内容的多少，如果你只改几个颜色，那么调试的次数就很少了；如果你如果你更改框架的网格系统，需要进行大量调试）。最新框架支持IE9及以上浏览器版本。在IE8上使用框架有点棘手，但框架与IE6和IE7完全不兼容。一般来说，框架还支持其他浏览器，如Firefox、Safari和Chrome，以及移动浏览器。不幸的是，如果你想在没有调试过的浏览器上使用该框架，那么你需要花费自己的时间修改代码并进行测试。自定义文件Bootstrap或Foundation下载包含最基本的网站构建文件，包括样式图标和小部件。有些文件会更大。通常，这些文件是可读的压缩文件格式。由于你选择的每一个框架都是一个综合框架，既然你不需要完全使用整个框架的所有元素，Bootstra或Foundation允许你自定义和下载你需要的部分。所以你可以只使用你需要在你的网站上使用的css和javascript文件包。这减少了文件膨胀，还减少了下载时间，同时具有相同的效果（就像您下载了整个框架包一样）。但是，如果您想添加之前被排除在外的小部件或样式，您现在必须重新配置包。但这是完全可以避免的。我建议先从建立网站开始，不要考虑外观。首先自定义您需要的功能，然后下载仅包含特定功能的包。一旦框架到位，您就可以开始自定义网站的外观。注意：每当发布新版本的Bootstrap或Foundation时，您都必须重新下载自定义包。仔细记下哪些文件你拿了，哪些没拿，这样你就不必在文件更新时重复这个步骤。CMSCriticCMSCritic，一个预览文档管理系统，使用Foundation构建。自定义代码可能需要一定程度的自定义，框架不会下载并准备上线。您可能想要更改一些颜色。如果你有一些经验，也许你会直接攻击网格系统。仅仅因为您使用框架而自定义代码并不会使您的网站显得通用。您可以自定义css以改善网站的外观。要么引用LESS（Bootstrap）或Sass（Foundation），要么自己写。Bootstrap框架中的框样式非常广泛。这里的假设是您根本不会更改它们。因此，您可以在单独的样式表中引用LESS或Sass文件来覆盖它们。不幸的是，LESS和Sass文件也非常小，你需要额外补充自己的代码。Bootstrap丰富的内置样式集使其深受前端开发人员的欢迎。Foundation有少量的stylebases。你还自定义一个样式表来覆盖它们，参考外部样式表，似乎完全自定义一个样式表会更容易。一般来说，在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规范和屏幕阅读器风格。不幸的是，到目前为止，Foundation还没有优先考虑可访问性。它不涉及ARIA规范和仅限屏幕阅读器的样式。但Zurb表示基金会会做更多的事情。WebflowWebflow，一个由Bootstrap制作的拖放式网站。3.总结没有响应式框架是完美的。作为执行各种任务的工具，需要额外的代码才能使该框架响应我们的需求。当然，完全自定义站点可能比使用框架更有效。一些前端开发人员告诉我，他们有自己的网格系统、css和javascript组件来维护他们的网站。当然这种做法没有错，但是这样做你需要维护自己的代码。流行的框架可以降低您的维护成本。我敦促我的前端开发人员重新考虑使用响应式设计框架的前景。将其视为一种生产力工具，您可以使用其中的一部分，甚至全部。下载一些文件或全部，只使用一个原型或全部，简而言之，您知道您的项目需要使用多少。一个旨在使网站以最少的调试快速运行的框架。定制它的过程完全不同，也许你会改变一些颜色或其他东西。但不管是哪种定制，都需要定义规范，把一切都标准化，把代码记录下来，方便传给另一个开发者，让他熟悉。代码当然不完美，但已经不错了。它大大减少了我们开发网站所需的时间。这个世界当然有完全定制的空间。我不是说支持大规模定制。当客户想要在设计中添加更多内容时，就需要考虑响应式框架。总的来说，这是一个非常有用的工具。通过快速原型设计、测试甚至生产代码取悦您的客户。英文原文：http://www.smashingmagazine.com/2014/02/19/responsive-design-frameworks-just-because-you-can-should-you/翻译来源：http://www.uisdc.com/响应式设计框架
