響應式設計專家Ben Frain：設計是為解決問題而存在的（圖靈訪談）

Ben Frain從1996年開始開發網頁，是一名有著豐富經驗的網頁設計師和前端工程師，他與世界各地的客戶和設計機構並肩工作。他在響應式設計領域的造詣尤其深厚，精於前端程式碼效能優化，著有《響應式Web設計：HTML5和CSS3實戰》和Sass and Compass for Designers。於此同時，他還是一名科技記者，定期為一些關注Mac平臺、前沿科技、網頁設計和航空技術的刊物撰稿。在此之前，他曾是一名電視演員，畢業於索爾福德大學的媒體與表演專業。

圖靈社群：是什麼促使你放棄自己的表演事業成為一位web設計師的？

因素很多。最終讓我決定從事web設計的原因是我想開始努力鞏固自己在某一方面的技術，從而成為這個領域的專家。表演需要到處旅行，這樣陪家人的時間就少了。

圖靈社群：你能列舉幾個響應式設計網站最好的例子嗎？

現在這樣的例子太多了！CodeKit最近剛剛推出了新的網站，我非常喜歡。

但是，我認為列舉一些具體的站點是不太合適的（雖然我剛剛這麼做了），因為設計是為解決問題而存在的。所以這是一個你可以自問的問題：你正在尋找的響應式設計是否很好地解決了你已有的問題。

圖靈社群：當開發原生應用的時候，流量是開發者考慮的主要問題之一，他們會為這些應用做一些有針對性的優化。在進行響應式設計時，我們怎麼才能把流量考慮進去？

像Google Page Speed Insights這樣的工具是一個很好的開始。然後我們就需要考慮CDN，使用工具來優化資源。但那就完全是另一碼事兒了，一言難盡。

圖靈社群：你認為適應性設計和響應式設計的區別是什麼？

我認為適應式設計並不一定會用到流式佈局；從根本上它是兩個響應式設計的核心元件（流式影像，流式網格佈局，媒體查詢）。所以，最後你在檢視間的設計會存在“斷點”。

圖靈社群：你認為漸進增強的web設計可以和響應式設計融合嗎？

漸進增強以恪守Web標準的標籤為基礎，意味著它在所有瀏覽器中均可用。然後通過CSS樣式和必要的JavaScript來為更先進的瀏覽器提供漸進式的增強體驗。

我認為所有的響應式設計都是漸進設計的；從最低規格的裝置的承載能力開始，然後以此為基礎構建，漸進地為更有能力的裝置增加更多功能。如果你發現自己需要從網頁上去除很多元素，比如視口或者效能變更，那麼你的前進方向很可能是錯誤的！

圖靈社群：現在的移動裝置，不僅尺寸千差萬別，解析度也越來越高，響應式設計可以為高解析度裝置提供支援嗎？

裝置及其效能總是與時俱進。iPhone 4是第一款被廣泛使用的高解析度裝置。它的螢幕大小為960乘以640畫素，解析度為每英寸326個畫素，是上一個版本iPhone（iPhone 3GS）及2011年的15" MacBook Pro筆記本解析度的兩倍。預計其他裝置，從平板電腦到膝上型電腦再到桌上型電腦都會跟風。

響應式工具已經提供了一些解決方法，可以為這類裝置提供增強支援。但是使用這個技巧時需要慎重。圖片尺寸越大，檔案體積也越大，所需的載入時間會更長，所以再重申一遍：你可以這麼做，但不一定應該這麼做。

另外，如果瀏覽器支援可縮放向量圖形（SVG），那使用該技術替代圖片可以解決我們目前面臨的很多圖片縮放問題。顧名思義，可縮放向量圖形能生成可任意縮放但顯示清晰的向量圖片。不過，媒體查詢和SVG對嵌入在頁面中的高解析度圖片無能為力。在這種情況下你需要考慮基於JavaScript的解決方案。

圖靈社群：可穿戴移動裝置比如Google Glass和iWatch吸引來越來越多的關注。你認為響應式設計可以應用到這些裝置上嗎？

我堅信，對目前的大多數網站來說，採用HTML5和CSS3的響應式網站設計，絕對是最佳方案。只要對現有的工作流程、實際做法和開發技巧稍作調整，就可以製作出快速、靈活、易維護的網站，最重要的是，無論在何種視口下網站都能表現完美。

我認為響應式web設計給了你一個最好的機會，讓你可以在任何裝置上很好地展現自己的網站。總會有新的裝置，新的技術和科技出現，這是進步。我們必須時刻準備著擁抱新的事物，併為此調整自己。

圖靈社群：你認為原生應用和web應用在未來哪個會佔領市場？為什麼？

我認為（希望）web應用會最終贏得市場，因為它們有無所不在的本質（可以被用在更多地方），但是web還有一段路要走。比如，我們需要去掉移動瀏覽器的300毫秒滯後，然後提供一種更強健的佈局機制。這些問題雖然存在，但並不存在於所有裝置。這同時也是web的強項，它可以讓人們體驗到所有功能，而不是向一部分使用者提供一個二元的體驗（有還是沒有）。

圖靈社群：有些人確實預測web應用在未來會超過原生應用。但是響應式設計還有自己的侷限性。你認為最終的解決方案是什麼？

我們必須要等一等才能看到未來，讓自己適應到發展中。我不太喜歡猜測。

---

更多精彩，加入圖靈訪談微信！