響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)(Responsive Web Design)簡(jiǎn)稱(chēng)RWD，又稱(chēng)適應(yīng)性網(wǎng)頁(yè)、回應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)。指網(wǎng)站能跨平臺(tái)使用，因應(yīng)不同的裝置，如：Iphone、Pad、或什至筆電，自動(dòng)偵測(cè)使用者上網(wǎng)的裝置尺寸，能針對(duì)不同螢?zāi)坏拇笮《詣?dòng)調(diào)整網(wǎng)頁(yè)圖文內(nèi)容，讓使用者用各式各樣裝置瀏覽您的網(wǎng)站時(shí)，不用一直忙著縮小放大拖曳，給使用者最佳瀏覽畫(huà)面，一頁(yè)式網(wǎng)頁(yè)也是衍生出來(lái)的代表。
由于現(xiàn)在行動(dòng)裝置使用者已超越電腦使用者，RWD是網(wǎng)站CSS3 media queries方式，以百分比的方式以及彈性的畫(huà)面設(shè)計(jì)，在不同解像度下改變網(wǎng)頁(yè)頁(yè)面的布局，讓不同的設(shè)備都可以正常瀏覽同一網(wǎng)站，提供最佳的視覺(jué)體驗(yàn)。
在RWD網(wǎng)頁(yè)設(shè)計(jì)尚未成熟與普及以前，手機(jī)板網(wǎng)站也曾經(jīng)流行一小段時(shí)間，做為傳統(tǒng)網(wǎng)站與RWD網(wǎng)站的臨時(shí)解決方案，由于手機(jī)版網(wǎng)站使用上還是有不少缺點(diǎn)無(wú)法改善，如今RWD網(wǎng)頁(yè)設(shè)計(jì)可以用一個(gè)網(wǎng)站可以取代多種版本的網(wǎng)站方式，在制作上與管理上相對(duì)單純?cè)S多，所以手機(jī)版網(wǎng)站已經(jīng)漸漸被取代。
RWD和傳統(tǒng)手機(jī)板網(wǎng)站的比較
在介面設(shè)計(jì)上，因?yàn)樵镜墓俜骄W(wǎng)站還保留的情況下，在手機(jī)版網(wǎng)站的設(shè)計(jì)上就僅僅針對(duì)智慧型手機(jī)的瀏覽介面而生，也就是因?yàn)獒槍?duì)手機(jī)介面設(shè)計(jì)的，所以在其他非手機(jī)介面上，視覺(jué)效果和操作可能都是非常不理想的。
而在后臺(tái)設(shè)計(jì)上，傳統(tǒng)手機(jī)版設(shè)計(jì)可能是官方網(wǎng)站來(lái)不及改版而被迫暫時(shí)的解決方案之一，所以大部分的手機(jī)版網(wǎng)站都是獨(dú)立的后臺(tái)來(lái)管理網(wǎng)頁(yè)資料，這樣的話會(huì)有兩個(gè)比較主要的問(wèn)題，一是維護(hù)成本較高，因?yàn)椴煌暮笈_(tái)，大部分都是獨(dú)立的資料庫(kù)來(lái)控制網(wǎng)站的資訊。也就是說(shuō)，在官方網(wǎng)站上更新的網(wǎng)頁(yè)資料，您也必須到手機(jī)版再更新一次，對(duì)于管理成本來(lái)說(shuō)相對(duì)較高。另一方面，資訊不同步也是個(gè)蠻主要的問(wèn)題，在舊有電腦版的網(wǎng)頁(yè)架構(gòu)下，有些功能是無(wú)法快速移植或重新設(shè)計(jì)的，所以在手機(jī)版上就會(huì)舍棄部分電腦版上部分的資訊與功能。當(dāng)然，這樣的舍棄或多或少的會(huì)造成部分使用者的不便，當(dāng)然可能只是一個(gè)短時(shí)間的因應(yīng)對(duì)策，但這段時(shí)間就必定存在資訊不對(duì)等的問(wèn)題。
測(cè)試您的網(wǎng)站是否對(duì)行動(dòng)裝置用戶(hù)友善?
當(dāng)使用者通過(guò)移動(dòng)設(shè)備進(jìn)入網(wǎng)站時(shí)，如果沒(méi)有針對(duì)移動(dòng)設(shè)備優(yōu)化，會(huì)造成閱讀障礙，那使用者很有可能選擇離開(kāi)網(wǎng)站，因此了解您的網(wǎng)站并判斷是否友善。此體驗(yàn)將造成很大程度上影響潛在使用者。針對(duì)移動(dòng)設(shè)備設(shè)計(jì)網(wǎng)站意味著使用清晰簡(jiǎn)單的導(dǎo)航，幫助使用者快速找到內(nèi)容。讓他們的問(wèn)題快速得到解決。您可以測(cè)試自己的網(wǎng)站是否符合移動(dòng)裝置的規(guī)范
為什么需要RWD?
1. 行動(dòng)裝置上網(wǎng)成為主流并且皆可使用RWD
到2015年為止，臺(tái)灣使用手機(jī)上網(wǎng)人口已經(jīng)超過(guò)八成以上，有六成以上的網(wǎng)友有手機(jī)消費(fèi)經(jīng)驗(yàn)，也就是說(shuō)二個(gè)人就會(huì)有一個(gè)以上在網(wǎng)路上消費(fèi)的可能性，且不包含看到網(wǎng)站后，直接去實(shí)體商點(diǎn)購(gòu)買(mǎi)的人數(shù)，由此可見(jiàn)行動(dòng)商機(jī)是非常龐大的，如果沒(méi)有使用RWD網(wǎng)頁(yè)設(shè)計(jì)方式架構(gòu)您的網(wǎng)站，造成手機(jī)瀏覽困難，非常有可能因此放棄消費(fèi)，因此建議商家使用RWD網(wǎng)頁(yè)設(shè)計(jì)方式建置。
2. 開(kāi)發(fā)的成本與時(shí)間比APP便宜又利于提升SEO排名
許多商家會(huì)選擇使用APP來(lái)作為手機(jī)版的的呈現(xiàn)模式，RWD在制作方面成本相對(duì)較于APP來(lái)快速與便宜許多，且APP曝光方式有限，相較于網(wǎng)頁(yè)瀏覽方式，受限幅度較大。而SEO排名的部分，Google在自己官方文章已發(fā)表過(guò)，“如果您尚未建立適合透過(guò)行動(dòng)裝置瀏覽的網(wǎng)站，我們極力推薦您這么做”。
結(jié)論
雖然RWD有這么多的優(yōu)點(diǎn)，但還是需要提醒一下，通常RWD的網(wǎng)頁(yè)要考量到易于滑動(dòng)的流動(dòng)設(shè)計(jì)安排，所以不建議有太多特殊的元素或較具特色的版型，這樣才能避免在不同瀏覽尺寸下產(chǎn)生不自然的銜接或破圖，喜歡花俏或是比較特殊造型的版型設(shè)計(jì)，還是推薦以一般網(wǎng)頁(yè)設(shè)計(jì)為主，另外搭配手機(jī)的處理方式。依據(jù)以上概念，不過(guò)有些網(wǎng)站可能不適合響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)，比如大型入口網(wǎng)站、購(gòu)物商城網(wǎng)站、游戲網(wǎng)站等，需要閱讀大量文字或大量操作的狀況下，無(wú)法達(dá)到響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)的簡(jiǎn)潔理想要求。
