響應(yīng)式網(wǎng)站設(shè)計開發(fā),也有叫做響應(yīng)的Web設(shè)計,或著叫響應(yīng)式網(wǎng)頁設(shè)計,響應(yīng)式網(wǎng)站設(shè)計開發(fā)的目的是為不同設(shè)備提供的多種適配的展現(xiàn)形式。一個網(wǎng)站,為了適應(yīng)不同的用戶的不同客戶端的查看,通過響應(yīng)式網(wǎng)站制作過程提供各種適配方法,是的用戶不用更換客戶端也能正常查看網(wǎng)站內(nèi)容。
那么一個好的響應(yīng)式網(wǎng)站應(yīng)該如何進行設(shè)計開發(fā)呢?
1. 首先,確定信息內(nèi)容,規(guī)劃頁面框架。
根據(jù)客戶提供的內(nèi)容和要求,由產(chǎn)品經(jīng)理或設(shè)計經(jīng)理來確定這個網(wǎng)站有幾個頁面,那些頁面放什么內(nèi)容,那些內(nèi)容比較重要,用什么形式展現(xiàn)。
2. 其次,考慮響應(yīng)式的規(guī)則。
不同的內(nèi)容,在不同的響應(yīng)式規(guī)則下的展現(xiàn)形式應(yīng)該是不同的。有的適合大分辨率,有的只能在小分辨率下使用。雖然規(guī)則越全網(wǎng)頁效果越好,但是畢竟成本和時間在這,不可能考慮那么全,所以我們要確定要考慮那些分辨率。
3. 確定響應(yīng)式顯示形式
根據(jù)確定好的響應(yīng)式規(guī)則,規(guī)劃在不同分辨率規(guī)則下的顯示形式。從大分辨率到小分辨率應(yīng)該如何變化,導(dǎo)航應(yīng)該如何變化,頁面結(jié)構(gòu)應(yīng)該如何變化
響應(yīng)式是一種設(shè)計理念與前端技術(shù)緊密結(jié)合的新型的開發(fā)模式,需要盡早讓各個角色參與進來,確認方案可行性,協(xié)調(diào)最終的顯示效果,以便后期進行開發(fā)工作。
4開始進行響應(yīng)式設(shè)計
按照用戶體驗中的移動優(yōu)先的原則應(yīng)該先進行移動端的模塊細節(jié)設(shè)計,一般是從從PC端開始設(shè)計細節(jié)。因為PC端內(nèi)容全面,能夠充分體現(xiàn)業(yè)務(wù)復(fù)雜度,PC端的開發(fā)環(huán)境與測試環(huán)境都相對成熟,所以從PC端開始能夠讓開發(fā)過程更順暢。
4. 響應(yīng)式具體實現(xiàn)
做好了PC端,就像蓋樓有了地基,剩下的響應(yīng)式調(diào)整就有了根基和對比。前端根據(jù)響應(yīng)式規(guī)則和具體設(shè)計,完成響應(yīng)式代碼的實現(xiàn)。需要注意的是,同樣分辨率的客戶端和瀏覽器顯示的結(jié)果有所不同,測試的時候一定要注意
到了這里,一個響應(yīng)式網(wǎng)站的頁面就算完成了,剩下的工作需要后臺開發(fā)工程師進行開發(fā),這些已經(jīng)和響應(yīng)式關(guān)系不大了。