響應式佈局和移動端佈局

響應式佈局就是響應式設計方案呈現的效果。具體就是頁面的佈局會根據不一樣設備的顯示面積(主要是寬度)的不一樣而呈現不一樣的佈局,這個效果是比彈性的佈局更好的地方是樣式會主動地根據用戶的設備的顯示面積呈現的佈局更靈活,可讀性更強。固然對研發的要求也更高(好比說如何更好地讓圖片,適配,UI動畫自適應各類佈局)。響應式設計通常來講是一套設計方案解決全部的設備的自適應問題。對應的樣式文件多是多個,也能夠只寫一個(在一個css文件聲明不一樣的media query就能夠)。

移動端佈局就是傳統的固定寬度或者彈性佈局的設計方案呈現的效果。通常來講,這個佈局設計開發都比較簡單,同時設計的效果能夠更精細,細節更豐富。不過很差的地方就是若是要適應不少不一樣的設備,就須要設計多套設計方案,或者讓比較小屏的方案去適應多個大屏,適應的效果上可能不是特別好。

響應式設計方案的通常的作法就是根據目標用戶的訪問設備的主要類型作三種或四種佈局。每種佈局有一個區間,好比說小屏的手機分分辨率能夠設定爲[320,640]。而後分別設計每種佈局便可,通常來講,各個佈局主要是調整模塊的排列布局順序,內容調整越少越好(儘可能減小用戶適應成本)。css

不一樣之處:佈局

一、適配的羣體不一樣,響應式適配各類終端,而移端大部分爲智能手機爲主
二、響應式佈局能根據不一樣的終端設備實現不一樣的頁面佈局,而移動端佈局大部分是單列布局
三、響應式佈局有可能形成冗餘的代碼較多(傳統式響應式佈局,僅依賴於媒體查詢,控制不一樣的頁面佈局),移動端佈局冗餘代碼較少,對針對性較強。動畫

相同之處:

一、在智能手機上,響應式看到的頁面效果能和移動端的同樣效果
二、二者都要面對適配的問題設計

相關文章
相關標籤/搜索