Ethan Marcotte最早提出響應式網頁制作，Ethan Marcotte在AList Apart發布的一篇具備開拓性實際意義的文章中，三種已經有的研發方法被他融合下去，命名為響應式網頁頁面。那樣，創建響應式合理布局應當考慮到哪些因素呢？

一、瀏覽器

前提要了解到的是瀏覽器，瀏覽器是全部網頁頁面運作的條件，品牌形象一點的說，網址是一個內容物，而瀏覽器是儲放這一具體內容物的器皿。每一個網頁頁面必不可少根據瀏覽器運作，因而開展網頁設計的第一步便是掌握瀏覽器，在pc端，常見的有5種瀏覽器，而手機上有瀏覽器作用的手機軟件則有30種之多。但應注意的是，很多瀏覽器根本無法算是是一個徹底獨立自主的瀏覽器，許多都僅僅根據同一瀏覽器，特別是安卓系統WebKit的不一樣版本號罷了。

手機上有4種瀏覽器種類：內嵌瀏覽器，可下載瀏覽器，代理商瀏覽器，及其WebView。因為現階段安卓系統和IOS占有著挪動端絕大多數銷售市場。因而，為了能降低任務量，大家開展響應式網頁界面設計設計方案的情況下可以先確保安卓系統和IOS上邊能運作，再根據實際情況和費用考慮到是不是兼容其它的瀏覽器。

二、視口

響應式網站制作的另一個關鍵便是視口，視口的定義并非大家所了解的機器設備的顯示屏尺寸，顯示屏尺寸是機器設備的物理學表明地區。視口指的是瀏覽器對話框里的具體內容地區，但不包含標簽欄，菜單欄等，網頁頁面具體展現的地區便是視口。在桌面上瀏覽器中，只有一個視口其實就是瀏覽器對話框，在移動端中，有下邊三個視口：

1、合理布局視口：與手機端瀏覽器屏幕寬度不關系，僅限定CSS的合理布局。

2、理想化視口：一種對機器設備而言最理想化的合理布局視口規格，由美國蘋果公司最開始引進，有著最理想化的訪問與閱讀總寬。

3、視覺效果視口：客戶見到網址的地區，客戶能通過放縮來實際操作視覺效果視口。

響應式合理布局最基本的工作中，便是把合理布局視口的大小設定為理想化視口。

三、媒體查詢

所說媒體查詢其實就是CSS里的if語句，它使我們能夠按照機器設備顯示器的特點設定相應的CSS款式。根據適合自己的媒體查詢，就能夠很方便的依據例如機器設備特性來更改在網頁頁面里的具體內容的動態顯示。

真真正正的響應式設計方法從總體上顛覆了大家現階段制作網頁的方式，了解之上三個方面，代表著你已經有了設計方案響應式網址的基本，能夠完成進一步學了。