为了让测试站点的响应性这一关键任务变得更容易,这里有一些优秀的测试免费在线工具退房。
ResponsiveTest
这个开源工具(repo在GitHub上如果你想在本地设置它)可以让你看到网页如何在不同的屏幕尺寸下呈现。ResponsiveTest支持很多设备,比如iPhone、黑莓、三星手机、戴尔笔记本电脑等等。
Responsinator
Responsinator接受一个URL,然后输出一系列设备模型,其中呈现的网页,这样你就可以了解页面布局将如何被你的用户在各种设备上体验。
响应
这个工具的一个有用的功能是它提供了键盘快捷键(例如,按T
将显示你的平板电脑预览)。如果你喜欢在各种设备预览之间快速来回切换,这是很方便的。
我有反应吗?
这是一个简单的Web工具,用于测试任何站点的响应性。此外,它渲染的预览图像可以为您的演示文稿、设计会议等提供很好的视觉效果。
视窗大小
这个有用书签简单地让你调整你的浏览器到一个特定的维度,例如iPhone 5的维度,或亚马逊Kindle Fire,或任何一个Viewport Resizer的47个屏幕大小预置。
resizeMyBrowser
这个工具可以让你根据15个默认大小来调整浏览器的大小,以匹配一些流行的设备(MacBook, iPad等)。您还可以设置自己的自定义尺寸,它还会告诉您当前浏览器窗口的大小。
Screenfly
就像这个列表中的其他一些工具一样,Screenfly接受任何URL,然后让你在各种预设屏幕尺寸下预览网页。
响应式网页设计测试工具由Designmodo
Designmodo有自己的响应式设计测试工具,在设计或调试响应式断点时可以派上用场。
响应式网页设计测试工具由pixeltuner.de
和Responsinator一样,这个由pixeltuner.de开发的响应式网页设计测试工具允许你输入一个URL,然后在几个设备模型中呈现。
responsivepx
Responsivepx可以处理本地文件。我要做的就是在web浏览器中打开HTML文档,然后复制并粘贴URI到responsivepx中。当您在计算机上进行响应式设计项目时,这非常有用。
你应该使用哪种工具?
很多都是这样响应设计测试工具的工作方式基本相同,所以选择一个测试工具实际上只是个人偏好。我建议你把它们都试一试,然后选择你最喜欢的一个。
你最喜欢的响应式设计测试工具是什么?在评论中分享和谈论它。