響應式設計幾乎是現(xiàn)代網(wǎng)站的標配，開發(fā)者搭建好網(wǎng)站之后若是要測試其響應式的變化效果，需要大量的測試設備來確保網(wǎng)頁顯示不會出問題，可是拿大量的實際設備來測試并不現(xiàn)實。在這種需求之下，催生了許多實用而可靠的響應式網(wǎng)站測試工具，這些工具當中絕大多數(shù)是免費的，讓開發(fā)者從海量的測試設備中解脫出來。今天，我們從這些測試工具中，挑選出9款免費又實用的測試工具，造福網(wǎng)頁設計師和開發(fā)者。

1. Responsive Design Bookmarklet

這是一款簡單又高效的測試工具，當你需要測試某個網(wǎng)站的時候，只需要將待測試的網(wǎng)站書簽拖拽到瀏覽器當中，通過一個虛擬鍵盤來設置長寬比來進行測試。一旦CSS文件被保存，被修改的部分會自動實現(xiàn)。在這個過程中，瀏覽器并不需要一直開著，簡單，實用！

2. resizeMyBrowser

resizeMyBrowser 中預制了15種不同比例的瀏覽器參數(shù)，并且用戶可以自己設置特定的瀏覽器參數(shù)以便于測試。整個測試工具界面友好，也是最值得推薦的測試工具之一。

3. The Responsive Calculator

這款名為響應式計算器的工具，最強大的地方就是可以幫你一鍵完成測試，真就這么簡單。這個工具能夠?qū)⑾袼剞D(zhuǎn)化為百分比，它可以將你設計好的PSD文檔導入瀏覽器中，將比例和視覺效果調(diào)至完美。

4. Responsinator

顧名思義，這款名為Responsinator 的工具可以幫你測試網(wǎng)站針對不同屏幕不同平臺的響應是否良好，其中內(nèi)置了iPhone、Andoird、iPad、Kindle、瀏覽器等不同平臺的參數(shù)以便測試。Responsinator 還貼心地內(nèi)置了橫屏和豎屏模式，測試的時候，只需要將URL粘貼進去就可以開始了。

5. Respondr

和其他幾款工具相似，粘貼URL，選擇設備就可以進行測試網(wǎng)頁在不同設備上的展現(xiàn)效果了！幾個簡單的步驟，就可以幫你搞定網(wǎng)頁響應式測試。

6. Designmodo Responsive Test

Designmodo 不僅是著名的設計博客，也是設計素材和設計工具的分發(fā)平臺。為了幫助開發(fā)者測試網(wǎng)頁在各個平臺上的體驗和響應效果，他們推出了這款Designmodo 響應測試工具，其中內(nèi)置了主流平臺的參數(shù)，也允許用戶自己修改尺寸參數(shù)進行測試。

7. responsivepx

你可有將responsivepx 稱為工具，可以稱之為接口，因為它不僅可以幫助用戶檢測明確的斷點，還能幫用戶搞定CSS查詢的可用性，能針對網(wǎng)站或者APP定制尺寸，測試其響應式的效果。

8. Screenfly

這款QuirkTools開發(fā)的工具Screenfly可以幫網(wǎng)頁設計師測試網(wǎng)頁在手機、平板、電視和傳統(tǒng)的桌面上的顯示效果和兼容性。Screenfly內(nèi)置選項不少，可根據(jù)需求進行調(diào)整。

9. Viewport Resizer

這款響應式測試工具可以輕松調(diào)整顯示尺寸和網(wǎng)頁中的內(nèi)容。將鏈接輸入測試工具，接下來，就讓它來搞定一切吧。

結(jié)語

我們希望這些測試工具能在接下來的開發(fā)過程中能幫到你，讓你的設計完美的呈現(xiàn)在用戶面前。

【做最好的響應式網(wǎng)頁設計師】

先解決常見問題：
《實用干貨！聊聊3種最常見的響應式設計問題》

布局是響應式的神髓：
《布局專攻文！如何搞定響應式網(wǎng)頁的布局設計？》

發(fā)展趨勢看這里：
《經(jīng)久不衰！聊聊響應式設計的現(xiàn)狀與趨勢》

原文地址：egrappler
優(yōu)設譯者：@陳子木

「子木說」

今天提到Designmodo 的響應式網(wǎng)站測試工具，就不得不說說這個網(wǎng)站。Designmodo最初也只是一個相對單純的設計博客，不過隨后他們開始同設計師和開發(fā)者合作，共同推出設計工具，UIKit，以及各類素材。其中素材類多數(shù)是收費的，但是品質(zhì)相當有保證，而工具類的一部分是收費的，有一部分是免費的。總而言之，這個站非常值得關注。

本文由優(yōu)設網(wǎng)原創(chuàng)翻譯，請尊重版權和譯者成果，轉(zhuǎn)摘請附上優(yōu)設鏈接，違者必究。謝謝各位編輯同仁配合。

【優(yōu)設網(wǎng) 原創(chuàng)文章 投稿郵箱：2650232288@qq.com】

================關于優(yōu)設網(wǎng)================
"優(yōu)設網(wǎng)uisdc.com"是國內(nèi)人氣最高的網(wǎng)頁設計師學習平臺，專注分享網(wǎng)頁設計、無線端設計以及PS教程。
【特色推薦】
設計師需要讀的100本書：史上最全的設計師圖書導航：http://hao.uisdc.com/book/。
設計微博：擁有粉絲量97萬的人氣微博@優(yōu)秀網(wǎng)頁設計 ，歡迎關注獲取網(wǎng)頁設計資源、下載頂尖設計素材。
設計導航：全球頂尖設計網(wǎng)站推薦，設計師必備導航：http://hao.uisdc.com
———————————————————–
想在手機上、被窩里獲取設計教程、經(jīng)驗分享和各種意想不到的"福利"嗎？
添加 優(yōu)秀網(wǎng)頁設計 微信號：【youshege】優(yōu)設哥的全拼
您也可以通過掃描下方二維碼快速添加：