Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Responsive web design的能與不能

4,254 views

Published on

從網站企劃的角度,看待RWD能在網站建置時提供什麼樣的幫助。

  • Dating direct: ♥♥♥ http://bit.ly/2F7hN3u ♥♥♥
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Dating for everyone is here: ❤❤❤ http://bit.ly/2F7hN3u ❤❤❤
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Responsive web design的能與不能

  1. 1. Responsive Web Design 的"能"與"不能" 黃婉貞 MOSUT x Tainan.py 2014/11/22 企劃在乎的那些事兒#1
  2. 2. 有一天… “請問一下國內有RWD做得不錯的購物網站嗎?” “………………?!”
  3. 3. RWD的定義  Responsive Web Design 響應式網頁設計  同一份HTML  使用CSS Media Query 做調整,先載入所有元件, 再隱藏不需要顯示的元件。  在不同尺寸的瀏覽器與裝置上,達成最佳易讀性。  http://www.smashingmagazine.com/
  4. 4. 然後 “請問你的RWD,是包含AWD(PC版/Mobile版) 的廣義RWD嗎?” “………………?!”
  5. 5. AWD的定義  Adaptive Web Design 自適應網頁設計  不同的HTML – PC版/Mobile版  不同裝置只載入需要顯示的元件,適用於窄頻寬。  不同裝置,網址不同,影響SEO。  http://www.momoshop.com.tw/  http://m.momoshop.com.tw/
  6. 6. 神如是說 “AWD不用轉址,只是跟RWD用不同的方式 規劃,更專注在提供更好的互動體驗,用的是 同樣技術,你可以說AWD是比RWD更好的解 法,但不一定需要不同網址。” (小小聲謎之音:神怎麼沒講要怎樣才能相同網址?)
  7. 7. 神的啟示
  8. 8. SWD的定義  Situational Web Design 情境式網頁設計 “最後一項是說給使用者需要的東西,然後另外 吐不一樣的東西給搜尋引擎,哈哈哈...好邪惡”
  9. 9. 企劃的結論 預算多:Native App 少:AWD 非常少:RWD(能省 錢) 人力多:AWD+RWD 少:RWD 內容電子商務:AWD BLOG、新聞:RWD(不能適用複雜架構) 未來SWD(?)

×