RWD 自適應網頁設計初階入門
設計 程式 網頁設計 網頁設計

RWD 自適應網頁設計初階入門

5 (1)
鼻涕男孩
鼻涕男孩
講師介紹

這堂課我會學到

  • 學會 HTML 5 語法
  • 學會 CSS 3 基礎語法
  • 學會 RWD 基礎靜態式網頁規劃與設計

課前資訊

學員上課前需具備哪些軟、硬體設備或常識

電腦基本檔案管理能力(例如:複製/貼上等)
不需任何軟體或硬體配備要求

課程適合對象

網頁設計初學者
學習網頁設計相關科系的學生
對於前端網頁設計工作有興趣的人
對網頁設計有興趣,卻毫無經驗的人

課程大綱

51
09:51:51
  • 課程介紹
     
     
    • 課程介紹短片
       
  • 1. 認識 RWD 網頁設計與編輯軟體
    3
    27:21
    • 1-1 認識網站與 RWD 網頁
      10:37
    • 1-2 申請網路空間
      10:28
    • 1-3 SublimeText 3 介紹
      06:16
  • 2. HTML 與 CSS 入門
    9
    01:34:47
    • 2-1 網頁的結構
      10:37
    • 2-2 HTML 基本標籤
      13:09
    • 2-3 圖片設定
      15:21
    • 2-4 CSS 基礎觀念應用
      15:04
    • 2-5 文字與段落
      08:19
    • 2-6 超連結的類型與應用
      09:14
    • 2-7 多媒體標籤
      06:45
    • 2-8 網頁背景設計
      07:28
    • 2-9 四方連續的背景圖樣設計
      08:50
  • 3. 表格應用
    4
    43:43
    • 3-1 表格介紹
      09:19
    • 3-2 表格排版實作 I:表格編排內容
      09:02
    • 3-3 設計我的商品頁 II:美化頁面
      14:59
    • 3-4 設計我的商品頁 III:增加動態特效
      10:23
  • 4. div 框架
    4
    46:09
    • 4-1 div 容器與盒子模型
      11:32
    • 4-2 塊狀元素與行內元素
      13:37
    • 4-3 四大定位方式
      06:47
    • 4-4 實例應用:相簿網頁的編排設計
      14:13
  • 5. 網頁排版實戰
    7
    01:26:59
    • 5-1 HTML5 的語義標籤
      08:23
    • 5-2 基本雙欄版型設計與編排
      06:02
    • 5-3 版型設計的延伸練習
      12:00
    • 5-4 進階版型設計應用
      13:35
    • 5-5 導覽列的樣式設計
      14:36
    • 5-6 複合式下拉選單設計
      12:20
    • 5-7 網頁版型整合設計
      20:03
  • 6. 表單設計應用
    6
    01:32:41
    • 6-1 表單結構標籤與後台串接介紹
      07:50
    • 6-2 表單的控制項介紹
      20:41
    • 6-3 表單頁面設計 I
      07:54
    • 6-4 表單頁面設計 II
      15:57
    • 6-5 結構化偽類別選取及屬性器應用
      18:21
    • 6-6 利用 CSS 與表單元素製作頁籤切換效果
      21:58
  • 7. RWD 網頁設計規劃
    7
    01:28:41
    • 7-1 尺寸的種類與設定
      12:26
    • 7-2 認識 viewport 與 Media Queries
      17:40
    • 7-3 使用 Google 雲端字型
      13:47
    • 7-4 圖示字型介紹與應用
      10:11
    • 7-5 使用 Xmind 規劃網站架構圖
      09:45
    • 7-6 線框圖設計與規劃
      13:26
    • 7-7 好用的線上線框圖製作服務
      11:26
  • 8. RWD 網頁設計實作
    11
    01:51:30
    • 8-1 RWD 網頁初始化設定
      05:42
    • 8-2 HEAD 標頭載入的設定
      05:26
    • 8-3 HTML 內容架構設計
      14:39
    • 8-4 基本 div 框架的大小設定
      06:37
    • 8-5 頁首與選單設計
      09:04
    • 8-6 主內容區塊設計與編排
      15:01
    • 8-7 頁尾區塊的資訊設計
      03:38
    • 8-8 手機版本的 CSS 修改
      10:54
    • 8-9 平板版本的 CSS 修改
      15:39
    • 8-10 多媒體的 RWD 設定
      04:56
    • 8-11 淺談網頁的 SEO
      19:54

課程介紹

在這門課程裡,你將從基礎的版型規劃、切版,一直到 HTML 內容架構與 CSS 美化,並在最後從零開始,實際完成一個完整的 RWD 靜態網頁的設計。

​想學好網頁設計,你還在煩惱以下這些問題?

  1. 我想學網頁設計,卻找不到適合的入門教學課程?
  2. 我看不懂複雜的網頁程式碼,該如何學會網頁設計?
  3. 目前最夯的 RWD(自適應)網頁設計到底是什麼?
  4. 我不懂 HTML,也不知道什麼是 CSS,真的能夠零基礎學會網頁設計嗎?

專為零網頁設計基礎的你所開設

讓你真正能夠做中學,由不懂到了解,從網頁設計小白,搖身一變成為能夠製作出 RWD 網頁的設計者。

在這門課程裡,老師從最基礎的版型規劃、切版,一直到 HTML 內容架構與 CSS 美化,並在這堂課最後,帶你從零開始,實際完成一個完整的 RWD 靜態網頁的設計。

而在學習過程中,老師會隨時提點設計時該留意的地方,不但處處充滿網頁設計的小技巧,也將製作網頁時可能會遇到的相關問題,不厭其煩地一一解說。

身為網頁設計領域新手的你,請千萬不要錯過這堂精彩的課程。

課程特色

  • 不需具備任何基礎,step by step 教會你,打穩網頁設計基本功。
  • 詳細語法解說,搭配實作練習,學習效果百分百。
  • 不必害怕網頁程式碼,從零開始就能學會網頁設計。
  • 系統化學習 HTML 與 CSS 語法和基礎知識。
  • 從 0 開始建置一個實用的公司 RWD 網站。
  • 隨時穿插網頁設計要點與網頁設計常見錯誤,快速吸收講師多年寶貴的實務經驗。

課程討論與問答

  • 要先登入才能做留言
  • user
    陳冠璋
    2018-12-22 22:59:05
    陳冠璋
    2018-12-22 22:59:05

    請問可以給教學內會用到ㄉ檔案資料夾記事本嗎?

    • user
      9 比 1 客服
      2018-12-24 09:32:02
      9 比 1 客服
      2018-12-24 09:32:02

      您好, 請問您指的“資料夾記事本”是範例內會使用到的文字檔案嗎?如果是的話,請您先登入帳號,然後到影片播放頁面最右邊的“教材下載”區,即可下載相關章節的資料,文字檔案的txt檔案已附在其中。若您還有使用上的問題,歡迎隨時與我們聯繫,謝謝。


    user
1

課程評語

  • user
    sun
    2022-11-15 13:12:37
    sun
    2022-11-15 13:12:37

    老師很棒~


5 ()
觀看期限 終身

授課講師鼻涕男孩
課程時數9.9小時
更新日期2018-08-15


NT$1,200
NT$800

購買課程
我們的退費政策

其他人也看了

更多熱門課程