優勢多媒體前端互動設計 - RWD

響應式網頁設計

Responsive Web Design
  • 時數:30小時
  • 費用:NT$ 15,000
  • 點數:4.0

選擇查詢分區開課時間

地點 班號 日期 時間 報名
台北 22931 班 2022/06/25 ~ 2022/07/03 每週六日 09:00~17:30 報名
台北 3900 班 2022/07/27 ~ 2022/08/02 每週一二三四五 09:00~16:00 報名
台北 22647 班 2022/08/01 ~ 2022/08/31 每週一三 18:30~21:30 報名
台北 522 班 2022/10/13 ~ 2022/10/19 每週一二三四五 09:00~16:00 報名
台北 22648 班 2022/11/13 ~ 2022/11/27 每週六日 09:00~17:30 報名
台北 523 班 2022/12/28 ~ 2023/01/04 每週一二三四五 09:00~16:00 報名

目前查無開課時段

詳細開課時間請洽詢業務

聯絡恆逸

教材

優勢精選教材

課程目標

HTML5與CSS3的問世,響應式網頁(Responsive Web Design)因應而生。

關於響應式網頁,簡單的來說是讓網站可以直接自動針對不同設備(桌機、筆電、平版、手機)等不同尺寸螢幕瀏覽網頁時,整個網頁頁面會對應不同的解析度,而有不同的內容呈現方式。在這樣的趨勢之下,Responsive Web Design響應式網頁設計將是未來網站設計的基本需求。

響應式網頁設計(Responsive Web Design)其背後需要的技術是【CSS】、【HTML5】、【JavaScript】,為了讓非程式開發的設計師也能快速開發設計響應式網頁,課程先使用Dreamweaver的CSS 3與Bootstrap 相關程式碼編輯功能,從中有效率了解響應式網頁規則與架構,因此就算無程式基礎也能順利表現出完整度、互動性更高的響應式網站,跟上目前業界網站設計流行動脈。課程中也著重程式碼的理解與培養,最後會以Visual Studio Code編輯響應式網頁,以利往後職場上能與程式設計師溝通合作,更能不斷自我提升專業能力。

適合對象

須有Dreamweaver與CSS基礎,欲學習響應式網頁設計的設計師

課程內容

  1. 關於響應式網頁設計

    • 1-1 什麼是響應式網頁
    • 1-2 響應式網頁設計趨勢
    • 1-3 響應式網頁的構成
  2. Dreamweaver與Bootstrap製作響應式網頁的準備

    • 2-1 善用CSS設計工具面板
    • 2-2 響應式網頁必備的HTML5與CSS3應用
    • 2-3 建構Bootstrap環境建立頁面
    • 2-3-1 下載Bootstrap
    • 2-3-2 Bootstrap基本版型
    • 2-3-3 其他更多的版面區塊編排
    • 2-3-4 Dreamweaver CC內建Bootstrap
  3. 使用Bootstrap打造響應式網頁內容

    • 3-1 Bootstrap通用類別
    • 3-2 Bootstrap元件素材
    • 3-3 Bootstrap響應式導覽列
    • 3-4 Card與Carousel應用
    • 3-4-1 卡片應用
    • 3-4-2 圖文框排列版面
    • 3-4-3 圖文內頁編排
    • 3-4-4 滑動圖片版型
    • 3-4-5 滿版大圖滑動控制板型
    • 3-4-6 圖片內容版面
  4. 單頁捲動響應式頁面

    • 4-1 按鈕控制單頁捲動版型
    • 4-2 側邊收合按鈕的單頁捲動版型
    • 4-3 單頁捲動版型應用
    • 4-4 單頁捲動版型與互動效果
  5. 使用程式碼編輯器設計開發響應式網頁

    • 5-1 下載安裝Visual Studio Code
    • 5-2 安裝擴充套件才能順利開始
    • 5-3 使用VS Code跟程式開發一起製作響應式網頁

學會技能

  1. 清楚了解Bootstrap 組件功能與使用技巧
  2. 能獨立完成響應式網頁
  3. 具有CSS與響應式網頁程式基礎,並能與程式設計師溝通合作
  4. 能以Visual Studio Code編輯響應式網頁

備註事項

學生優惠價:參加校園IT職涯學習護照方案,享有5折優惠價NT$7,500元

課程範例: