Responsive design 和 Adaptive design 的區別?

時間 2021-05-30 04:36:52

1樓:菜小龍咚嗆

最近正好看到了這塊內容:

如上所說,這兩種方式都是為了解決網頁在不同螢幕尺寸的裝置上展示的問題。我覺得這只是兩種不同的開發形式,二者的差別從開發的角度看更容易理解。

Responsive design (響應式設計):建立乙個網頁,通過CSS Media Queries,Content-Based Breakpoint(基於內容的斷點)等技術來改變網頁的大小以適應不同解析度的螢幕。

Adaptive design (自適應設計):為不同類別的裝置建立不同的網頁,檢測到裝置解析度大小後呼叫相應的網頁。目前AWD網頁主要針對這幾種解析度(320,480,760,960,1200,1600)

在下圖中可以看到,Responsive design中網頁和螢幕解析度的關係是一對多的,一套網頁適應多個裝置。而Adaptive design 中網頁和螢幕解析度的關係則是一一對應。

因此Responsive design相對來說靈活性更高,但是相應的每次的載入內容會比較多。

而只針對某一類或某幾類解析度設計響應網頁大小Adaptive design的優勢就在於減少載入的等待時間,提高網頁的響應速度(見下圖)。

至於什麼時候使用Responsive design或Adaptive design很大程度取決於你的開發時間和預計的開發成本。如果在開發時間較為緊張的時候,同時也希望盡可能的讓網頁自適應於多種裝置,爭取在不同型別的螢幕上都保持良好的使用者體驗,那麼使用Adaptive design的方式也是不錯的選擇。

2樓:HolidayCoffee

呵呵,樓上總結了不少外文的內容。我也看了那些英文的翻譯,說說我自己的理解吧。

其實RWD和AWD都是響應式設計,從外觀上很難分辨,但他們自己執行機理不同,RWD是主動式的響應設計,AWD是被動式的響應式設計,RWD不管使用者使用的是什麼裝置都是在伺服器把資料推送到瀏覽器後,指令碼或CSS自行偵測螢幕大小後執行對應的樣式表內容,並且一直通過本地指令碼在監聽螢幕大小的變化,隨時做出樣式響應的變化,所以是主動的。

但AWD是使用者通過瀏覽器傳送請求後,伺服器根據請求中夾帶的使用者裝置裝置資訊做出判斷,呼叫已經在伺服器裡準備好的,適應對應裝置樣式檔案+HTML內容+JS,返回給瀏覽器以這種方式響應不同裝置。

即墨區和黃島區,你更看好哪個區的發展?

個人觀點,青島市要更進一步發展,首要問題是將市中心往內陸搬,稍稍遠離海邊。海邊作為旅遊度假 海港及產業用地用。市中心搬至膠州灣北部是個好選擇。為什麼這麼說,看看上海首爾東京就知道了 李彬 即墨原來一直是青島經濟發展最好的縣級市,現在變成區了,發展前景很好。通過藍色矽谷的開發,平衡了東西兩個方向的發展...

accuracy 和 precision 的區別是什麼?

morning in 字典裡解釋就挺好。accuracy,準確與否 precision不太好直譯,統計裡標準誤的大小可以反映precision 標準誤越大,precision越低 即precision體現的是樣本均數的變異情況。具體您可以參考標準誤的定義,可以幫助理解precision 沙雕雕 還是...

Ristretto 和 Espresso 的區別是什麼?

最後的黨項人 簡單的方法好像就是Ristretto 1 1 Espresso1 2,當然個人覺得和粉的粗細程度也有關係,我一般自己做的時候,同一款豆子Espresso研磨度會比Ristretto更粗點,這樣同樣的克數同樣的萃取時間25秒左右,液量會不同。 星爸爸出了南瓜絲絨蘋果flat white ...