第一章 基本概念和架構說明第一章 基本概念和架構說明\1-1 RWD介紹

1-1 RWD介紹

 

響應式網頁設計(Responsive Web Design)簡稱RWD,是一種網頁設計的技術做法,開始於2010.05.25Ethan Marcotte 發明的術語 Responsive Web Design (RWD)。該設計可使網站在多種瀏覽裝置(從桌面電腦顯示器到行動電話或其他行動產品裝置)上閱讀和導航,同時減少縮放、平移和捲動。2012年後被公認為是日後網頁設計開發技術的趨勢,RWD一個很重要的功能,就是自動針對不同尺寸螢幕斷點(breakpoints),例如在大螢幕橫向呈現的圖片,在小螢幕則自動斷行,以垂直方式呈現,或是預設隱藏並以動態方式顯示。

       隨著行動化普及,越來越多的行動裝置被人們普遍使用,而一種行動裝置又有兩種螢幕尺寸:直式螢幕「Portrait」,橫式螢幕「Landscape」。如果在開發網站時沒有考慮到不同螢幕尺寸瀏覽時的畫面呈現,當使用者以手機開啟網站時,就會看到極小的文字,得放大螢幕才能看到部分內容,或是圖片、色塊擠在一起,用手指無法點擊連結。 

      
而開發企業內部系統時,有些單據也可能會以行動裝置在企業外部使用,例如請假單、公出單、流程簽核等。直接瀏覽原本的PC版頁面,使用者體驗不佳,而特別另外開發行動版網頁,又會造成企業IT人員的負擔。 

      
因此,透過RWD技術一次開發,讓一種網頁可以同時被電腦、平板、大螢幕手機、小螢幕手機正常瀏覽,可以降低開發與維護的成本。 


 

Top of Page