響應式設計有些人認為這是一種趨勢。但它不僅僅是一種趨勢。這是一個新的設計方案-它有助于解決與不同的決議和設備（臺式機，筆記本電腦，平板電腦和移動設備）的設計問題。我將分享一個我覺得是很好的響應網站列表。我把這個列表分為兩類：自適應和流體和響應。

適應性設計

下面的網站是自適應設計的例子。設計采用基于視窗的寬度。

IA

信息架構師是我最喜歡的網站之一。它是美麗的。我欣賞這樣一個美麗的設計只使用兩種顏色（黑色和紅色）其實只是網頁安全字體，沒有紋理，沒有花哨的JavaScript效果或自定義字體。將導航列表菜單為下拉菜單在較小的格式很聰明，因為它節省了很多空間，在頭。

截圖

倫敦倫敦

雖然倫敦的網站是不是流體，但它做了一個非常好的工作對響應的布局。布局始終放在每個視口布局。最敏感的網站使用最大寬度來創建流體圖像（參考我的響應的設計教程），但在頭部的圖像被掩蓋在全尺寸。

截圖

食品感官

注意看食物感覺部位反應如何。它來自于詳細的柱側邊欄1-column布局布局。隨著設計變得越來越小，它變得越來越小。該滑塊有2行導航文本在底部的大格式，然后從2行文本到一行，然后消失在小格式。導航菜單上有大格式的圖標。菜單圖標消失在較小的格式。

截圖

叉細胞質雄性不育

到“叉”網站，調整您的瀏覽器窗口。注意到在水面上的視差滾動效應？那是有趣。然而，我不在隱藏的功能圖標它小是因為小視口的讀者會失去一些信息一致。

截圖

倫敦和合作伙伴

設計明智的，我不是一個大風扇的這個網站，倫敦和合作伙伴。但響應的布局是非常好的計劃-從大型四柱式布局的一個小1-column布局。最敏感的網站隱藏某些內容，因為它變小了，但這個網站保持它的所有。它表明，即使內容豐富的網站可以響應。

截圖

流體與響應

現在讓我們來看看流體和響應的網站。下面的網站不僅反應在視口寬基礎，但布局和內容是流體/彈性。