發錶於2024-11-15
RWD(Responsive Web Design)響應式設計,即網站會隨著載具的不同而產生不同的畫面。
手機上網不稀奇,看網頁還要拉…拉拉頁面?
拇指食指,放大縮小,網頁馬上現出原形?!
頁面下載還在等阿~等阿~望阿~望!
網頁常延遲,不該怪頻寬也不要認為網站掛了!
製作網站不僅僅是美觀與實用性兼具,更要能在各項載具(PC/MAC/平板/手機)上皆能無阻礙地暢遊造訪。
本書教你從使用者端來檢視如何設計出跨平台皆令瀏覽者滿意的網頁,從字級字體到頁面比例、版面編排,以及瀏覽、下載的適用性等,一一為你詳細剖析。並介紹小工具來替你的網頁檢測加評比,讓你晉升為Pro等級的網頁設計師!
良好的瀏覽及使用經驗,讓更多使用者願意多停留在你的頁面上。
作者簡介
Nowill Chang
Nowill 是若維的英文音譯,於社群起家。稟著要提供客戶最好的服務之念頭,多年來跨足了多項網站相關領域,舉凡架構師、設計師、企劃、PHP程式設計師、專案、社群、行銷、使用者研究、部落客等等,皆有3~5年不等的經驗,是少數對網站每個環節都有一定知識與實戰經驗的設計師,並曾協助數十位平面設計或學生族群跨入網頁設計相關領域,是個對網路充滿熱忱又足夠專注的專業設計師。目前除了繼續提供專業服務外,也認真在自己的Blog草監網路分享優質網站的分析與評論,創作屬於自己的網路世界。
Web:nowilldesign.com/
Blog:nowills.blogspot.com/
Part1 RWD你必須知道的事
隨處可在的網站
.RWD的誕生與使命
.桌上型電腦與筆記型電腦的螢幕限制大解放
.網路速度的變化
.標準與瀏覽器地支援度
.表單樣式
.桌上型電腦與筆記型電腦與移動裝置的操作差異
Media Queries的運用
.Meta viewport、Media queries結構規則
.實際演練Meta viewport 與Media queries
排版上的選擇
.排版這件事
.固定寬度排版
.流動佈局排版
.彈性格式排版
.混合模式排版
.實際演練固定寬度排版
.實際演練流動佈局排版
字體的二三事
.Web fonts的使用
.Web fonts的字體資源與使用方式
.在RWD設計下使用Web fonts
Part2 RWD的設計與開發
什麼樣的網站適合RWD
.該從哪些因素評估起?
.專案經費估算
.網站架構大小
.網站資料量多寡
.圖片、音樂等數為媒材過多
.無法支援RWD的套件或元素
一般網頁設計流程與RWD設計流程差異
.一般網站專案設計流程
.RWD網站設計流程
一定會遇到的圖片問題
.到底圖片會有哪些問題
.讓圖片可以支援RWD的方法
RESS (Responsive Design + Server Side Components)
.到底RESS是什麼東西?
.User agent的取得方式
.Modernizr-server
目前常見的RWD Framework介紹
.使用RWD Framework的優缺點
.有Twitter支持的Bootstrap
.號稱最先進的Foundation
.由Yahoo打造的Pure
.使用Compass為基底的SUSY
Part3 RWD的使用者經驗與檢測
以使用者為中心的RWD
.桌機、平板與手機使用環境上的差異
.使用者經驗測試流程
.Persona建模的重要性
.實際的網站使用者經驗測試
.最容易出問題的按鈕與連結
RWD的檢測方式
.使用者的操作模式有哪些?
.手動縮放瀏覽器大小
.線上檢測平台
.RWF測試重點
好感度No.1的網頁設計:RWD不出槌法則,網站在任何裝置都完美呈現 epub pdf txt mobi 電子書 下載 2024
好感度No.1的網頁設計:RWD不出槌法則,網站在任何裝置都完美呈現 pdf epub mobi txt 下載