一、什么是響應(yīng)式 Web
??近些年以來(lái),由于移動(dòng)端的流量在不斷地?cái)U(kuò)大,手機(jī)、平板等移動(dòng)端設(shè)備的層出不窮 ,為了更好的滿足用戶對(duì)瀏覽互聯(lián)網(wǎng)的需求,提出了響應(yīng)式技術(shù)這一概念。
第一,一個(gè)響應(yīng)式的網(wǎng)站無(wú)論在手機(jī)、平板還是PC端合式機(jī)、筆記本上,有且只有唯一的一個(gè) URL接口。
第二,響應(yīng)式的Web設(shè)計(jì)依賴于媒體査詢來(lái)推動(dòng)非固定布局,實(shí)現(xiàn)靈活設(shè)計(jì),即通過(guò)査詢到設(shè)備的各種屬性值如設(shè)備類型、分辨率、屏幕物理尺寸及色彩等來(lái)決定求同存異的布局。
第三,全站都使用響應(yīng)式設(shè)計(jì)(只需使用一個(gè)代石馬庫(kù))去適應(yīng)所有適備,力求實(shí)現(xiàn)多平臺(tái),多終端服務(wù)的一致性。
二、響應(yīng)式web的關(guān)鍵特性
??1)流式布局以百分比單位為主,與傳統(tǒng)的固定布局以像素單位為主不同。
??2)媒體査詢是CSS的語(yǔ)法規(guī)則,它能夠基于査詢定義的參數(shù)來(lái)控制樣式。它根據(jù)不同設(shè)備提供不同的CSS,渲染不同界面以配合用戶的設(shè)備環(huán)境。
??3)斷點(diǎn)指的是響應(yīng)式設(shè)計(jì)的目標(biāo)是避免出現(xiàn)為每一個(gè)可能的終端設(shè)備都制作設(shè)計(jì)一個(gè)網(wǎng)頁(yè)。為了避免這種現(xiàn)象的發(fā)生,我們可以通過(guò)劃出一些邊界來(lái)調(diào)整頁(yè)面的布局用以適應(yīng)變化的內(nèi)容如設(shè)定分辨率“斷點(diǎn)”。
三、廣義的響應(yīng)式開(kāi)發(fā)的流程
??根據(jù)EthanMarcotte廣義而言,廣義而言,響應(yīng)式開(kāi)發(fā)是以參考分辨率開(kāi)始的(原本的網(wǎng)格、界面或字體只為指定分辨率而設(shè)),然后加入媒體査詢,以配合不同環(huán)境。假設(shè)以“移動(dòng)優(yōu)先”作為原則就把樣式表建基于“移動(dòng)優(yōu)先”而非桌面版界面。因此設(shè)計(jì)的界面首先配合小屏,然后才用媒體査詢,隨分辨率增加逐漸提升。
四、響應(yīng)式設(shè)計(jì)的好處
??響應(yīng)式設(shè)計(jì)使用一個(gè)代碼庫(kù)就可以解決市面上的所有瀏覽器和設(shè)備的兼容問(wèn)題。它的好處表現(xiàn)在通過(guò)“靈活性”來(lái)解決“不確定性”策略來(lái)實(shí)現(xiàn)。根據(jù)RobLarsen有以下好處:
??1)簡(jiǎn)化服務(wù)器。如果能進(jìn)行合理的響應(yīng)式設(shè)計(jì),小心地使用圖片,并且處理好性能問(wèn)題,就算是要應(yīng)對(duì)你的所有用戶和具體設(shè)備的問(wèn)題,你的服務(wù)器端也只需要提供一套并且最小化的邏輯。
??2)更容易維護(hù)。使用響應(yīng)式設(shè)計(jì),你只需要維護(hù)一套前段的代碼庫(kù)。
??3)只提供一個(gè)入口給搜索引擎。單一的網(wǎng)站及單一的URL列表會(huì)讓你更容易做網(wǎng)站工作。
??4)能夠支持未知設(shè)備。在設(shè)計(jì)的時(shí)候,響應(yīng)式設(shè)計(jì)已經(jīng)忽略了特定的設(shè)備和操作系統(tǒng),這使得響應(yīng)式設(shè)計(jì)的網(wǎng)站可以具有自動(dòng)適配現(xiàn)有的或者未來(lái)的設(shè)備的能力。
五、響應(yīng)式的缺點(diǎn)
??有些設(shè)計(jì)師不認(rèn)同這種方法,認(rèn)為不同設(shè)備應(yīng)使用不同標(biāo)記,如果用了響應(yīng)式設(shè)計(jì),所有瀏覽器和設(shè)備都會(huì)收到一個(gè)HTML文件。
??另外,也有可能限制了應(yīng)用的復(fù)雜性。一個(gè)應(yīng)用是有可能同時(shí)實(shí)現(xiàn)高可用性和響應(yīng)式設(shè)計(jì)這兩個(gè)目標(biāo)的,而且你的永和在手機(jī)上可能會(huì)有與桌面站點(diǎn)上不用的需求,能夠意識(shí)到這個(gè)問(wèn)題很重要。就有關(guān)金融方面網(wǎng)站而言,移動(dòng)端的用戶最大的需求就是可以査看并操作那些比較重要的內(nèi)容,關(guān)注一些重大事件,無(wú)論是具體交易事件的反饋 ,還是了解一些重大的市場(chǎng)動(dòng)態(tài)。在桌面站點(diǎn),用戶的需求可能更廣一些,需要提供全站系統(tǒng)訪問(wèn)的支持,可能還需要提供對(duì)一些其他復(fù)雜系統(tǒng)的能力。