中國(guó)東方電氣集團(tuán)有限公司 程榮贇
基于HTML5技術(shù)的響應(yīng)式Web設(shè)計(jì)淺析
中國(guó)東方電氣集團(tuán)有限公司 程榮贇
隨著互聯(lián)網(wǎng)技術(shù)的飛速發(fā)展,為適應(yīng)日益增長(zhǎng)的多元化終端設(shè)備瀏覽需求,使用戶在不同閱讀終端上都能有良好的使用感受,本文淺析了一種高效的解決方案:基于HTML5技術(shù)的響應(yīng)式Web設(shè)計(jì)。通過對(duì)媒體查詢、流體布局、彈性圖片等Web設(shè)計(jì)技術(shù)的組合和提升,實(shí)現(xiàn)任意閱讀終端對(duì)網(wǎng)頁(yè)布局及內(nèi)容都能良好地呈現(xiàn),是未來(lái)Web設(shè)計(jì)技術(shù)發(fā)展的大勢(shì)所趨。
響應(yīng)式;HTML5;Web設(shè)計(jì)
隨著IT信息技術(shù)和移動(dòng)互聯(lián)網(wǎng)的飛速發(fā)展,移動(dòng)閱讀終端,如平板電腦、智能手機(jī)等越來(lái)越普及,且型號(hào)各異,而各類桌面計(jì)算機(jī)、電視屏幕規(guī)格也越來(lái)越多元化,主流設(shè)備的概念越來(lái)越被淡化。讓網(wǎng)站頁(yè)面盡量兼容各類設(shè)備,適應(yīng)各種分辨率的屏幕,確保良好的用戶體驗(yàn),是Web前端開發(fā)工程師必須要解決的重要問題。響應(yīng)式Web設(shè)計(jì)因此應(yīng)運(yùn)而生,一個(gè)網(wǎng)站能夠兼容多個(gè)終端,而不是為每個(gè)終端都做一個(gè)特定的版本,就像具備自主辨識(shí)能力一樣,確保用戶無(wú)論在何種閱讀環(huán)境下,都能得到良好的體驗(yàn)感。
獨(dú)立Web設(shè)計(jì)師伊森·馬科特(Ethan Marcotte)在2010年首次提出了響應(yīng)式Web設(shè)計(jì)(Responsive Web Design)概念。他認(rèn)為,真正的響應(yīng)式Web設(shè)計(jì)方法不僅僅是簡(jiǎn)單的根據(jù)可視區(qū)域大小來(lái)改變網(wǎng)頁(yè)布局,而是要從整體上顛覆當(dāng)前的網(wǎng)頁(yè)設(shè)計(jì)方法,是針對(duì)任意閱讀終端的網(wǎng)頁(yè)內(nèi)容進(jìn)行完美布局的一種顯示機(jī)制。……