broken image
broken image
broken image
  • 首頁
  • 最新消息
  • OA360 
    • 系統介紹
    • 資訊集中
  • 專案服務
  • …  
    • 首頁
    • 最新消息
    • OA360 
      • 系統介紹
      • 資訊集中
    • 專案服務
    broken image
    broken image
    broken image
    • 首頁
    • 最新消息
    • OA360 
      • 系統介紹
      • 資訊集中
    • 專案服務
    • …  
      • 首頁
      • 最新消息
      • OA360 
        • 系統介紹
        • 資訊集中
      • 專案服務
      broken image

      你了解RWD嗎?

      RWD,Responsive Web Design「響應式網站」

      · 科技資訊

      現代科技日新月異,我們能使用的設備不斷變換與更新,不同尺寸的螢幕,各種五花八門的型號,從手機、平板、筆記型電腦、桌機、投影。因此,不同的螢幕尺寸在瀏覽各個網頁時,網頁內容排版也應該變得不一樣,才能讓觀看者更舒適的瀏覽頁面,。

      RWD響應式網站,是一種網頁設計的設定,與網頁前端技術有關,可讓伺服器一律向所有裝置發送相同的 HTML 程式碼,並透過 CSS 調整網頁在裝置上的呈現方式。 如果所有 Googlebot 使用者代理程式均獲准檢索網頁及其資產 (CSS、JavaScript 和圖片),則 Google 的演算法應能自動偵測這項設定。

      簡而言之就是,從不同尺寸的螢幕(如手機到平板到電腦,14吋到24吋到32吋)等跨裝置行為,能將網頁的圖文比例調整縮放置讀者方便閱讀的形式,不會因畫面過小,需要左右滑來看全部的內容,或是不斷縮放,因此RWD是能夠透過瀏覽器寬度決定網頁版面呈現的一種網頁技術。

      以OA360首頁為例:採用RWD響應式網頁技術在平板和手機裝置上自動切換排版呈現

      broken image

      RWD的優點:

      1. 成本較APP低廉
      2. 瀏覽者更換裝置的舒適度
      3. 不用花錢做手機版網站
      4. 支援任何裝置,使用手機比率高
      5. 提升使用者體驗
      6. 利於網路行銷,使網站質感一致,進而提升顧客忠誠度
      7. 網站更容易維護,使用者更便利不須被限制於特定瀏覽器/下載APP
      8. 益於分享給他人查看

      RWD的缺點:

      1. 太複雜的網站內容不適合做RWD
      2. 老舊瀏覽器不適用

      與RWD相關的AWD怎麼選擇?
      AWD(Adaptive Web Design)自適應網站設計,早於RWD,主要是因應不同裝置的頁面單獨進行版面的設計,如「手機版網站」,但其需要花費較多心力維護網站,也可能因設計形象不一致造成使用者操作不易,品牌形象傳遞不一致等問題,無法維繫顧客忠誠。

      現階段RWD成為了網站設計的主流,但對於內容複雜、資訊量龐大,針對不同客群的網頁時,還是選擇使用AWD進行客製化設計,值得注意的是因RWD使用的是同一網址,但AWD是分開的網址可能會使流量被分散,也因內容相似度高而影響SEO,因此還是推薦大家使用RWD。


      參考網頁:
      RWD 是什麼?9 個 RWD 的好處和 2 個壞處 - 快速打造有質感的專業
      網站
      RWD是什麼?RWD響應式網頁概念一篇解析 - 凱士網頁
      設計

      上一篇
      PAKDD國際學術會議
      下一篇
      那些人們口中的SEO
       返回網站
      Cookie的使用
      我們使用cookie來改善瀏覽體驗、保證安全性和資料收集。一旦點擊接受,就表示你接受這些用於廣告和分析的cookie。你可以隨時更改你的cookie設定。 了解更多
      全部接受
      設定
      全部拒絕
      Cookie 設定
      必要的Cookies
      這些cookies支援安全性、網路管理和可訪問性等核心功能。這些cookies無法關閉。
      分析性Cookies
      這些cookies幫助我們更了解訪客與我們網站的互動情況,並幫助我們發現錯誤。
      偏好的Cookies
      這些cookies允許網站記住你的選擇,以提升功能性與個人化。
      儲存