您可能聽人說過，“我們生活在後電腦時代” 。這對網路開發者而言意味什麼? 它意味著您的網站，有 30% 到 50% 的流量來自於移動電子裝備。它同時意味著，不久以後，桌面多使用者或者膝上型電腦多使用者將會成為網路的少數派。面對如許多使用者模式構建的轉變，我們又要若何應對呢? 我們已跨越了 m-dot 或是 t-dot 時代，步入了一個由響應和自適應設計技術統治的時期！為了能夠緊跟時代的步伐，今天小編就和大家說說響應式網頁設計流程應該是什麼樣子的？
步：確定需要相容的裝置型別、螢幕尺寸
透過多使用者研究，瞭解多使用者使用的裝置分佈情況，確定需要相容的裝置型別、螢幕尺寸。
裝置型別：包括移動裝置（手機、平板）和 pc 。對於移動裝置，設計和實現的時候注意增加手勢的功能。
螢幕尺寸：包括各種手機螢幕的尺寸（包括橫向和豎向）、各種平板的尺寸（包括橫向和豎向）、普通電腦螢幕和寬屏。
需要考慮的問題：某個頁面進行響應式設計時其適用的尺寸範圍是哪些？結合多使用者需求和實現成本，對適用的尺寸進行取捨。比如一些功能操作的頁面，多使用者一般沒有在移動端進行操作的需求，沒有必要進行響應式設計。
第二步：製作線框原型
針對確定下來的幾個尺寸分別製作不同的線框原型，需要考慮清楚不同尺寸下，頁面的佈局如何變化，內容尺寸如何縮放，功能、內容的刪減，甚至針對特殊的環境作特殊化的設計等。這個過程需要設計師和前端開發人員保持密切的溝通。
第三步：測試線框原型
將圖片匯入到相應的裝置進行一些簡單的測試，可幫助我們儘早發現可訪問性、可讀性等方面存在的問題。
第四步：視覺設計
注意，移動裝置的螢幕畫素密度與傳統電腦螢幕不一樣，在設計的時候需要保證內容文字的可讀性、控制元件可點選區域的面積等。
第五步：前端實現
與傳統的 web 開發相比，響應式設計的頁面由於頁面佈局、內容尺寸發生了變化，所以終的產出更有可能與設計稿出入較大，需要前端開發人員和設計師多溝通。