HTML 網頁設計新手村

首頁HTML 網頁設計新手村

    HTML 網頁設計新手村

    用 HTML & CSS 打好你的前端底子

    HTML ＆ CSS 可以自學嗎？

    對新手 / 老手來說任何程式語⾔你都可以⾃學，若你有搜尋過，程式語⾔學習的建議多如⽜⽑，要在這些龐雜資訊海中「掏出正確的資訊對於⽼⼿來說不是問題」，但「對於新⼿要找到正確的資訊卻是⼀件相對困難又很花費時間的事情」，當然如果你只是學興趣或是暫時沒有時間壓⼒的話，是沒有什麼關係，但如果你的⽬標是在短時間內真正學會這項技能，有「⼀個專業且了解你問題的⽼師在旁邊帶著你學，絕對能夠幫你節省很多冤枉的時間！」

    課程特色

    HTML 課程特色

    你好，我是李建杭，⼤家都叫我 Amos，曾為多家知名電商、網路服務的前端⼯程師， 現擔任多家程式教育機構的前端講師，我原本是設計師，因緣際會下成為前端⼯程師，也算是跨領域的轉職，所以我很清楚學習程式的盲點。

    我認為在學習程式的時候，最重要的就是了解每⾏程式碼背後的邏輯是什麼，如此⼀來，才能夠真正學好程式，我不否認這樣的學法在⼀開始的階段，會比較⾟苦比較累，但是打好基礎，對於你後續的程式之路⼀定能⾛的更順、更久！

    李建杭

    李建杭

    Amos Lee

    講師簡介

    從視覺設計轉職前端的斜槓開發者，活躍於臺灣各大技術研討會，熟稔 HTML & CSS、Bootstrap、RWD、CSS3 等，為國內知名前端技術講師。

    2018 年成為 Youtuber，致力於使用簡單易懂的方式讓新手能夠輕鬆學習前端開發技能。

    iT 邦幫忙鐵人賽連續三屆冠軍、連續兩屆優選，於 2020 出版「金魚都能懂的 CSS 選取器：金魚都能懂了你還怕學不會嗎（iT邦幫忙鐵人賽系列書）」一書，除了熱衷於牛排的熟成，目前日益精進於釣魚技能。

    適合對象

    HTML 適合對象

    上過課的同學怎麼說︖

    想要學好 HTML & CSS 別無他法，跟著 Amos 課程進度，練就一身紮實的基本功，特別是新手，循序漸進學習，如果已經有基本觀念，老師的歸納整理能力會超乎你所能想像，選擇 Amos 老師的課程，絕對是 BEST CHOICE！

    赤木

    Amos 老師很會用淺顯易懂與生活化的教學來帶入那一堆堆的網頁文字，讓人一步步對於網頁語言不再害怕，真心推薦！！

    Wouher Chia

    Amos 老師細心解釋各種 HTML 和 CSS 的原理，若想要打好網頁的基礎，真的非常建議來上 Amos 老師的課 五倍紅寶石是一個很可愛又很特別的地方，上課制度有趣，環境也很舒適。

    Haha Huang

    課程大綱

    • HTML 結構與觀念

    • HTML 網頁標籤意義

    • HTML 5 是什麼

    • 語意的重要性

    • SEO 與網頁的關係

    • 樣式的寫法與重要觀念

    • CSS 樣式優先權

    • 區塊與行屬性

    • 基礎 CSS 選取器

    • 選取器的效能

    • 選取器的應用

    • 如何有效的選取網頁物件

    • 更多實用的選取器

    • Fixed 定位

    • 絕對與相對定位介紹

    • Flex 彈性排版的重要觀念

    • 多欄式版面製作

    • 直橫排隨你變

    • 撰寫具有彈性的網頁原始碼

    • 為何別濫用 Class

    • Class 命名的問題

    • 什麼是模組化

    • 選單製作

    • 兩欄式 / 三欄式版面排版實務

    • 單頁網頁製作

    • 加碼內容（依課程進度動態增減）：Grid 排版

    扎實課程搶先看

    HTML 課程內頁 - 標題圖 - 第一階段 基礎觀念

    你是否曾經想接觸網頁原始碼，但發現自己不知從何下手呢？在第一階段中 Amos 老師將會解釋 HTML5 的結構，並建立網頁語意與各個網頁標籤的重要基礎觀念，融會貫通後再進行網頁架構的撰寫，讓你學習不走冤枉路！

    此外也會帶領同學們如何使用網頁編輯軟體「VScode」，使用純文字編輯器撰寫網頁原始碼，打好網頁開發基礎！

    HTML 課程內頁 - 標題圖 - 第二階段 CSS入門與實務應用

    瞭解 HTML5 架構後，要讓網頁有美美的顏色與排版，最不可或缺的就是 CSS 樣式，但到底什麼是 CSS？又應該把 CSS 檔案如何套用在 HTML 上呢？在本階段都會詳細的告訴你！

    舉凡樣式的寫法與超重要的樣式優先權、區塊與行屬性，每一項都是網頁開發的根本，身為網頁初心者絕對不可錯過的精華課程！

    HTML 課程內頁 - 標題圖 - 第三階段 入手排版神器

    初學網頁設計，在克服了一開始的 HTML5 架構與 CSS 樣式套用後，另一大關卡就是分析網頁的結構，並將各個區塊排到應該在的地方，在這個階段將會帶領大家認識排版兩大神器「定位屬性」與「Flex 彈性排版」，學會三大排版方式，讓你不再困擾於理不清的排版問題，網頁設計開發隨心所欲！

    HTML 課程內頁 - 標題圖 - HTML 課程內容

    📘 一、​HTML5 是什麼

    • 關於網頁二三事

    • HTML5 的結構

    • HTML5 觀念一點通

    • 各式網頁標籤意義

    • 如何撰寫一個具有意義的網頁

    • 語意的重要性

    • 何謂 SEO

    • SEO 與網頁的關係

    📘 二、變數型撰寫網頁的重要習慣

    • 原始碼縮排

    • VScode 操作應用

    • 為何我們需要專有名詞

    • 溝通與發問的技巧

    📘 三、CSS 樣式入門

    • 樣式的寫法

    • 樣式的重要觀念

    • 超重要的樣式優先權

    • 重要的區塊與行屬性

    📘 四、重要的 CSS 選取器與實務應用

    • 基礎 CSS 選取器

    • 選取器的效能

    • 選取器的應用

    • 如何有效的選取網頁物件

    • 更多實用的選取器

    📘 五、定位屬性

    • 固定定位特性

    • 絕對定位特性

    • 相對定位特性

    • 定位應用實例：

      • 蓋版廣告

      • 側邊廣告

      • 商品標籤

    📘 六、Flex 彈性排版

    • Flex 彈性排版的重要觀念

    • 什麼是彈性排版？

    • 多欄式版面製作

    • 排版起手式與原理

    • 直排橫排隨你變

    • 換行與注意事項

    📘 七、排版實務

    • 選單製作

    • 兩欄式版面入門

    • 三欄版面排版實務

    • 商品頁面排版實務

    • 單頁網頁製作

    • 加碼內容（依課程進度動態增減）：Grid 排版

    立即報名

    HTML 網頁設計新手村

    課程類別與程度

    前端課程入門課程

    近期開課時間

    2022 / 5 月 直播班

    課程已結束

    5/7 (六)、5/14 (六)、5/21 (六)、5/28 (六)

    10:00~17:00

    限時優惠價

    NT$ 13,500

    目前課程已滿班或結束，如對課程有興趣，
    歡迎追蹤五倍粉絲專頁或來信洽詢，獲得最新的開課消息。

    組團報名享折扣

    兩人同行 或 一次購買 2 堂課，享 9 折優惠

    三人同行 或 一次購買 3 堂課，享 85 折優惠

    更多團報或課程諮詢請洽 02-2331-5247

    五倍紅寶⽯課程提供

    結業證書

    結業證書 | 五倍紅寶⽯課程提供

    課程結業證書證明

    課程討論群組

    課程討論群組 | 五倍紅寶⽯課程提供

    共同討論課程群組，

    老師同學即時交流

    wifi

    wifi | 五倍紅寶⽯課程提供

    備有插座及快速穩定

    免費 wifi 連線操作

    線上補課

    線上補課 | 五倍紅寶⽯課程提供

    線上補課，

    不怕跟不上進度！

    默默會

    默默會 | 五倍紅寶⽯課程提供

    每週二獨家默默會

    讓你問題問到飽

    業界高手一同交流

    吉祥物貓貓

    吉祥物貓貓 | 五倍紅寶⽯課程提供

    吉祥物貓貓加持