-
響應(yīng)式網(wǎng)頁設(shè)計(jì)息堂，亦稱“響應(yīng)式Web設(shè)計(jì)”诫尽，其簡(jiǎn)稱為RWD。所謂的響應(yīng)式Web設(shè)計(jì)微姊，是指“網(wǎng)頁內(nèi)容會(huì)隨著訪問它的視口及設(shè)備的不同而呈現(xiàn)不同的樣式洼哎√逃常”意思是說，同一個(gè)網(wǎng)頁噩峦，你在手機(jī)上看到的和在電腦上看到的模樣將會(huì)不一樣——但是其內(nèi)容和網(wǎng)頁本身并沒有任何改變锭沟。
-
HTML，超文本標(biāo)記語言识补，即含有非文字元素的語言冈钦。比如圖片，視頻李请，音樂等。
-
CSS厉熟，全稱Cascading Style Sheets导盅，“是一種用來表現(xiàn)HTML（標(biāo)準(zhǔn)通用標(biāo)記語言的一個(gè)應(yīng)用）或XML（標(biāo)準(zhǔn)通用標(biāo)記語言的一個(gè)子集）等文件樣式的計(jì)算機(jī)語言∽嵘”
隨著互聯(lián)網(wǎng)的日夜發(fā)展白翻，人們逐漸在不同的設(shè)備中瀏覽網(wǎng)頁。下面我將用在statcounter上的數(shù)據(jù)來作為解釋為何要運(yùn)用響應(yīng)式網(wǎng)頁設(shè)計(jì)的例子。
例子1.jpg
-
如圖所示滤馍，Mobile和Desktop都是2016年1月到2017年12月的兩個(gè)重要的平臺(tái)岛琼。如果網(wǎng)頁設(shè)計(jì)者只顧及一部分用戶，那另一部分用戶在查看網(wǎng)頁的時(shí)候巢株，就會(huì)因?yàn)樵O(shè)備等外界問題沒法享受網(wǎng)頁里面的內(nèi)容——或者說槐瑞，因?yàn)榫W(wǎng)頁的格式?jīng)]法看得很舒服，會(huì)因?yàn)槠聊淮笮≈惖膯栴}和圖片做斗爭(zhēng)阁苞。
-
在如今這個(gè)時(shí)代困檩，很多網(wǎng)頁都有響應(yīng)式網(wǎng)頁設(shè)計(jì)。比如說中山大學(xué)傳播與設(shè)計(jì)學(xué)院就有運(yùn)用響應(yīng)式網(wǎng)頁設(shè)計(jì)那槽。但同時(shí)悼沿，一些網(wǎng)頁因?yàn)榘l(fā)開了APP，希望引流骚灸，所以官網(wǎng)上面并沒有使用響應(yīng)式網(wǎng)頁設(shè)計(jì)糟趾。比如LOFTER。
最早提出“響應(yīng)式Web設(shè)計(jì)”這個(gè)名字的人是Ethan Marcotte甚牲，他運(yùn)用了三種已有技術(shù)實(shí)現(xiàn)了一個(gè)解決方案义郑，即響應(yīng)式Web設(shè)計(jì)。這三個(gè)已有技術(shù)分別是彈性網(wǎng)格布局鳖藕，彈性圖片/媒體魔慷，媒體查詢。
-
彈性網(wǎng)格布局：彈性地把平面劃分成多個(gè)表格著恩，根據(jù)需要適應(yīng)于各種平臺(tái)院尔。
-
彈性圖片/媒體：“彈性圖片指的是不給圖片設(shè)置固定尺寸，而是根據(jù)流體網(wǎng)格進(jìn)行縮放喉誊，用于適應(yīng)各種網(wǎng)格的尺寸邀摆。”同理伍茄，彈性媒體也是不給媒體一個(gè)固定的模式栋盹，而是根據(jù)其內(nèi)容進(jìn)行協(xié)調(diào)。
-
媒體查詢：“由可選的媒體類型和零個(gè)或多個(gè)使用媒體功能的限制了樣式表范圍的表達(dá)式組成敷矫，例如寬度例获、高度和顏色〔苷蹋”
Web的前后端的關(guān)系榨汤。
-
Web的前端是用戶看到的最終網(wǎng)頁狀態(tài)，而后端則是程序員等網(wǎng)頁設(shè)計(jì)者負(fù)責(zé)的工作怎茫。
-
網(wǎng)頁設(shè)計(jì)的大量工作由后端人員負(fù)責(zé)收壕，然而當(dāng)代碼程序編輯結(jié)束之后，前端工作人員要根據(jù)用戶的反饋再度設(shè)計(jì)網(wǎng)頁，然后重復(fù)之前的工作蜜宪。這個(gè)工作要不斷重復(fù)虫埂，就算網(wǎng)頁已經(jīng)沒有任何問題，也要時(shí)不時(shí)根據(jù)用戶需求重新編輯圃验。
