HopeTrip>旅遊資訊中心>台灣>台北市>台北市活動資訊>台北市演唱會推介>RWD（Responsive Web Design）行動裝置網頁設計

RWD（Responsive Web Design）行動裝置網頁設計

收藏列印糾錯瀏覽次數：0 0人參數

分享到：

活動名稱：
RWD（Responsive Web Design）行動裝置網頁設計
活動地點：
中國文化大學推廣教育部-建國南路二段231號
活動日期：
2016-08-01~2016-08-24
活動時間：
每週二 ,四 19:00:00~22:00:00
活動價格：
NT$ 原價7,200元※檢附相關證件;臨櫃報名享特定優惠（請參考以下資格）1.網路報名：享95折優惠（$6,840元）2.開課2週前報名：享9折優惠（$6,480元）註1：以上優惠擇一使用

！！RWD（Responsive Web Design）行動裝置網頁設計！！

近兩年手機上網的普及，連帶觸動了手機網頁製作的風潮，而由於手機尺寸與桌機無法相比擬的關係，加上另外為手機用戶製作一個手機網站，除了要額外耗費製作成本外，同時維護及同步更新桌機網站與手機網站也是一大問題。
自適應網頁的設計也就是為了要因應手機版型而生的；只要一張網頁，利用不同的css設定與media語法，就可以分別在桌機與手機上呈現適合的版型，而不需要再另行設計及維護。
而JQuery Mobile的興起，讓製作手機網頁能夠迅速省時，能在短短的時間內，製作好一個網站架構。

Lesson 1：
1.伺服器Server架設
2.（meta）、viewport設定
3.固定手機頁面縮放比
4.iOS手機調校語法
5.手機網頁所用的單位：px／em／rem／％的區別
6.HTML5新標籤
7.手機網頁版型實作
8.手機網頁實測

Lesson 2：
1.取消手機預設選單功能
2.取消手機超連結預設顏色
3.取消文字選取功能
4.取消數字被當成電話號碼
5.超連結設定種類

Lesson 3：
1.WebClip桌面小圖示製作與設定
2.iOS單機操作模式設定
3.選單置頂或置底設定
4.HTML5新語法與-webkit-
5.盒模型設定（box-sizing）與100%全螢幕的關係

Lesson 4：
1.圓角式選單設計：first-child與last-child設定
2.字型問題（網路字型、@font-face、圖示字型）
3.Retina Display（視網膜螢幕）與高解析度的問題、jQuery判斷retina
4.圖片模糊處理與SVG圖片的應用

Lesson 5：
1.圖片縮放與背景圖縮放的設定
2.UserAgent的判斷
3.手機網頁與桌機網頁的分界點
4.媒體詢問設定方式

Lessong 6：
1.媒體詢問之一：screen
2.媒體詢問之二：orientation
3.選單設計之一：伸縮式圖示選單
4.選單設計之二：垂直式選單-before-after
5.選單設計之三：下拉式選單+jQuery判斷

Lesson 7：
1.選單設計之四：隱藏彈出式選單+jQuery判斷
2.選單設計之五：側欄式選單+jQuery判斷
3.選單設計之六：側欄推出式選單+jQuery判斷
4.欄的設定與排版

Lesson 8：
1.快速建立RWD：JQuery Mobile介紹與應用
2.實作RWD手機網頁版型一
3.實作RWD手機網頁版型二

郭嘉雯老師

經歷
資策會、台北市立體育學院－電腦外聘講師
行政院勞委會北區職業訓練中心、財團法人中華職業訓練中心、台北市職能發展學院、大亞電腦－電腦多媒體講師
中國多媒體協會、伊甸社會福利基金會‧影像處理講師
僑委會、連江縣教育局、華彩教育訓練－網站製作與設計講師
富邦銀行、天下趨勢－影像處理講師
北區扶輪社、天仁茗茶－美術設計

專長
影像處理方面：Photoshop、Illustrator、CorelDRAW、PhotoImpact
網頁設計方面：Dreamweaver、Flash、FrontPage
網頁語法方面：HTML、CSS、JavaScript、JQuery
影音處理方面：會聲會影、威力導演

著作
1.Photoshop 5.0影像魔法師
2.Div+CSS網頁版面設計‧隨手做SEO

專案作品
資策會-龍門課站、聯合報網站、研華科技網站、TDK網站、師大學務處網站