21款响应式网站设计工具

ZURBFoundation是一种被广泛接受的一个响应网站架构。它具有巨大的提升功能，你可以增加屏幕的尺寸和设计中的复杂层。不仅如此，你还将发现一个由多个UI组件库，使您随意创建您的项目。

jetstrap使设计人员通过简单的拖放组件快速组装样机。不需要前端开发技能开始，你将最终获得一个灵活的网页。你只需要使用拖放工具的接口。

StylePrototype的原型是一个HTML页面显示的按钮样式，字体，颜色，摄影风格，翻转和其他元素的网站。

ElementCollage是元素拼贴为接口部件的视觉探索的一个很好的用户界面。拼贴可以帮助你在视觉方向，你不必自己去创造整个组件，考虑到你是不是只是一个装置的设计。

Pears是一个开源的WordPress主题由丹用于创建前端风格指南。它一些重要的好处是，允许更容易的测试，更好的工作流程，共享的词汇，并作为参考。

iconmoon只是使得创建和显示图标字体简单的过程。你可以选择从库中的图标，选择上传你的图标。从那里，你可以生成你的自定义图标字体下载包，包括字体和适当的CSS。

foresight.js检测装置的显示和连接来决定是否载入高分辨率的组件。不同的设备有不同的显示位图图像的方式，但作为一个设计师，你必须记住，载入高分辨率的图像能够增加页面权重。

Detector是DaveOlsen创作的检测器，使用PHP脚本，和基于浏览器的JavaScript，还有一系列特征检测库。探测器必须适应新的设备和浏览器自身没有任何需要从浏览器信息中心数据库拉能力。

enquire.js使用matchmedia脚本有条件地执行一些功能，如果满足一定条件的情况下，一些脚本加载。这个你可以期待更好的用户体验，方便用户。

FitVids是对多个媒体对象包括视频图像时有不同的比较，在这个意义上，他们不保持他们的一些方面比大小后。这将创建一个尺度的问题时，观看的视频从一系列不同的上网设备

每个设计师都知道如何使用mediaqueries，但事实是，InternetExplorer不支持mediaqueries。同时，作为一个设计师，你不能是否用mediaqueries，只是因为你想支持旧的IE。这个问题可以通过使用SASS容易克服。IE-friendlymobile-firstCSS可以帮助您，同时提供适当的桌面风格的老版本的IE。

作为一个设计师，如果你在网上搜索视图的测试工具，你会发现许多视图端口测试工具。但现在的问题是大部分的视口测试工具依靠流行的设备宽度，如320，768，1024等。ISH分类提出一般范围（小型，中型，大型，等）只是为了确保你提出一般分辨谱。

有些设计师还利用像素值来设置断点，而我们一直在使用的宽度，测量，和字体单元相对于各种设备的观点。一个好的教程是由LyzaGardner解释了我们如何可以使用相对单元的断点创造更好的用户体验。

作为设计师，你可能担心媒体查询对一个特定的浏览器支持。这是很容易解决的，利用mqtest.io。该工具将帮助你识别和分析各种媒体查询，不同的浏览器的响应。这个，你也可以利用媒体的查询是不常用的。

浏览器堆栈提供远程访问多个设备和环境，从而让你做一些质量保证测试。browserstack是什么它也是有效的测试时，在InternetExplorer的老版本给人留下深刻的印象。

测试一个真实的设备上的重要性不能被过分强调一个网页设计师，你需要看和分析这种表现您的设计将在发布之前，用户。AdobeEdgeInspect进行了实际装置非常简单和直接的测试，只要你有工具自动刷新所有连接的设备。您也可以在广泛的代码测试设备。

codepen是一个工具，帮助快速响应模式和技术演示。它是一种工具，也有助于在不同的设备和计算机的设计性能，同时还打字。