企業方案
|
人才媒合

RWD響應式網頁設計入門

RWD響應式網頁設計入門

軟體開發學院 - 網頁開發
基礎
1.2 小時
6,985
NT$360

專門針對網頁新手,企劃/PM,網頁設計師,相關主管/老闆所設計的RWD基礎入門概念課。從零開始,讓欲入門者初步理解自適應網頁(Responsive Web Design),可在組織內有效溝通與作業,也為將來自學提升能力之前打下基礎。

課程公告

目前尚無任何課程公告

講師將會在這發佈與課程相關的公告或是通知課程內容更新的公告。
基礎課程
建議學習 1 週(每週 2 小時)
課程共 21 小節21 影片 ( 1.2小時 )
icon_info_certificate提供完訓證書
提供制定學習計畫什麼是學習計畫?

課程目標



1.如果你是網頁企劃或PM,你會通透了解RWD網頁設計原理與優缺點,可企劃接近成品的RWD網頁,並與設計師有效溝通合作。

2.如果你是網頁設計師,你能全面地掌握RWD基本撰寫原理,初步入門Boostrap框架來加速網頁開發,習得更多相關工具與資源來有效工作。
3.如果你是網頁設計新手或平面設計轉網頁設計者,你能快速掌握RWD技巧與相關輔助工具與資源,較其他自學者擁有完整的基礎知識,將來在延伸或深入時的自學方向會更明確。
4.如果你是老闆或主管,可在1小時多的課程內迅速理解RWD技術,較其他「聽說」或「自行Google」的人還具有完整的全方位知識。

課程介紹

這堂課厲害在哪?

這是讓你一小時弄懂RWD重點的觀念課



還在到處Google「自適應網頁設計」,但只獲得零碎概念嗎?

邊做邊學,似懂非懂,總覺得未曾對於RWD有全盤理解嗎?
雖然有接觸RWD了,但被別人問起,卻沒信心能好好解釋嗎?
坊間課程都只教技術,但你不需要太深,只需要一次掌握全方位的概念嗎?

這是一門專門針對:網頁新手,企劃/PM,網頁設計師,相關主管/老闆所設計的RWD基礎入門概念課。

本課程研發起源是針對網路行銷部門內的設計師/企劃/程式設計師進行的短講,讓組織內相關人員理解RWD,在組織內有效溝通與作業,也提供各自成員提升技術能力時有參考的依據與方向。因此,本課程適合任何想入門RWD自適應網頁設計的人。

近兩年以來深受好評,Slideshare破萬人次觀看的「深入淺出RWD自適應網頁設計」在2018年的教材中,特別更新為最新的資訊,還有淺顯易懂的重點式解說,只要投資1小時多的時間,就能獲得RWD自適應網頁設計的全方位基礎必備知識!不論要運用在網頁簡報提案,網頁企劃或技術上的延伸自學,具備基礎知識,才能讓未來自學進修時更紮實成長!遇到bug或難題,也更有方向來排除與解決!

誰適合學習這門課程呢?


1.想一次通透理解RWD原理的網頁企劃或PM。
2.想要建立完整的RWD基礎概念並提升開發效率的網頁設計師。
3.想快速理解RWD基礎知識的老闆或主管。
4.想快速入門RWD的網頁新手。

學習前需要有什麼基本能力呢?

1.本課程無艱深實作或範例,完全無網頁技術背景者,無需任何基本能力。
2.若您具備撰寫HTML/CSS語言者,在實作技術的章節中可獲得更直接的收穫。

學習前需要準備什麼呢?

無需任何工具或事前學習。



基礎課程
建議學習 1 週(每週 2 小時)
課程共 21 小節21 影片 ( 1.2小時 )
icon_info_certificate提供完訓證書
提供制定學習計畫什麼是學習計畫?
關於講師
Marie Chang

台灣大學外文系畢業,雖非本科系,但一路走來實際工作都與網路相關。

橫跨視覺與前端設計,熟悉HTML/CSS,在網頁設計領域超過13年工作經驗,早期曾在網站製作公司四年,為各類企業客製官網,累積製作超過100個以上的網站。 後在網路行銷圈打滾,初在網路趨勢專家且專營臉書行銷的Mr.6公司旗下擔任視覺總監,為大企業客製行銷網頁。接著轉向電子商務與網路行銷發展,曾任掌方網路行銷部副理,負責電商網站營運,網路銷售英文書籍與代理外國品牌保養品。亦曾在台灣大哥大短暫擔任PM協助內容網站營運事務。以實戰的網頁技術作為基本背景,轉擔任過網頁企劃/網站管理/專案管理等角色,熟悉組織運作與各種角色立場。

2013年轉為自由工作者,專職接網頁製作案,近年曾為華碩、聯合報、電影公司、國際賽事、知名部落客等客戶執行視覺設計、活動網站建置、Wordpress架站、網路廣告製作等。

從2009年起因網頁技術專業,曾至中小企業或校園單位演講或授課,除了RWD課程外,亦曾教授以下課程:
1. 網頁技術標準之CSS / HTML
2. Photoshop在網頁設計之實務應用
3. 非營利組織之免費網頁設計軟體教學
4. 如何打造教學用途的部落格
5. 部落格架設+寫作+網路行銷實戰工作坊

講師網站: http://marygeek.com/
FB粉絲頁:鍵盤張馬力 https://www.facebook.com/marygeek.is.here/

課程大綱


  • 1.簡介說明
  • 什麼是響應式網頁設計(Responsive Web Design)? [想了解這門課?快點試閱]


    02:17

    有什麼優點 ? [想了解這門課?快點試閱]


    03:54

    有什麼缺點與解法 ?


    05:28
  • 2.怎麼企劃
  • 響應式網頁設計流程


    02:49

    響應式網頁設計規劃首則


    04:36

    響應式網頁範例與牛刀小試時間


    04:51

    視覺設計兩大要點


    04:20
  • 3.RWD怎麼寫
  • 實作技術說明 [老師多厲害?歡迎試閱來看看!]


    01:59

    1.HTML: Meta Tag寫法


    02:04

    2.CSS: Media Queries寫法


    04:45

    3.響應式的Grid (排版格線)


    02:05

    4.響應式的 image (圖片)


    02:27

    5.響應式的 Video (影片)


    01:21

    6.隱藏或顯示內容


    01:52
  • 4.加速開發的RWD框架:Bootstrap
  • 什麼是Bootstrap?


    02:55

    1.框架入門的7大撇步


    03:52

    2.框架外掛(Plug-in)大觀園


    03:03

    3.框架好用工具與資源


    05:28
  • 5.RWD好用輔助工具介紹
  • 企劃與格線工具


    04:48

    輔助測試工具


    02:43

    總結論


    04:08

課程附件


目前沒有課程附件

購買此課程後,才能使用留言功能

沒有回應的問題

目前尚無任何討論主題

成為第一個發問的人!在問答中找到學習的捷徑。
功能表
優惠活動
  • 【購課贈書】購買「老師希望你別再說錯的 英語易混淆字」即贈實體書

  • 【疫情嚴峻】實體課程銜接直播學習優惠

  • 【補助50%】AI產業應用課程(真人直播)

  • 【發問再享好康】數位行銷學院免費選課諮詢

  • 會員學習心得大募集!完成指定任務拿85折課程優惠券