五倍紅寶石 ・專業程式教育機構

網頁設計課程包含 HTML、CSS、 jQuery，讓新手的妳從零基礎到實作出自己的網站，前端網頁設計女性班課程強調頁面規劃與結構設計，除了基礎教學外，也提供許多實務上專案合作時的技法，業界經驗豐富的老師不藏私，通通傳授給妳！讓妳實作出屬於自己的網頁。

🛠 使用 HTML 來打造網頁基礎

HTML 是一種用來建構網頁的標記語言而非程式，如果將網頁譬擬為一個人，那麼 HTML 就如同人的骨架，透過這個骨架可以達成很多事：像是呈現網頁、瀏覽器妳的網站資訊，甚至還可以透過 JavaScript 來讓你的網頁資訊和其他網站溝通。

能建立一個骨架很容易，但不好的骨架就好像告訴瀏覽器妳的腳和眼睛擺錯了位置，讓瀏覽器讀取時搞混 🤯 。這堂課 Amos 老師將會告訴妳寫出一個有意義的、有效網頁結構，對 SEO 和前後端串接是多麽重要！

💅 讓 CSS 來美化你的網頁吧！

如果 HTML 是骨架的話，那麼 CSS 就像是衣服，妳可以透過 CSS 設定網頁的字體大小、框線、陰影甚至是做一點小動畫！除了這些效果外，CSS 最主要還能製作成 RWD (Responsive Web Design) 響應式網頁，使頁面不管是在任何尺寸下都整到適合的瀏覽樣式。

精通 CSS 樣式能讓妳不畏懼各式網頁設計稿，切出理想的版面。

🌀 透過 jQuery 打造互動網頁！

有了 HTML 的身體骨架、CSS 的衣服美化，那麼 JavaScript 就像是神經元素。我們能透過 JavaScript 讓骨架移動、改變樣式、獲取資料等。

而這門課將透過 jQuery 這一套輕量的 JavaScript 函式庫，讓妳的網頁動起來！

jQuery 的不僅跨瀏覽器支援度高，且最重要的是：簡化大量的 JavaScript 方法，讓初學者能夠透過 jQuery 快速的實作網頁動畫或事件處理，甚至可以與其他網站資料庫互動。

扎實 42 小時課程，這門課將讓妳完整瞭解網頁脈絡，從網頁結構到網站動畫實作，課堂最後每一位學員都還能獨立完成至少一頁的網頁切版！

課堂中有錄影，老師會依照同學狀況調整節奏、五倍紅寶石提供工程師助教，不用擔心跟不上進度！

一起跟著 Amos 老師，打好妳的網頁基礎！💪💪

🖥️ 初識網頁

• 始業式

• 網頁是什麼？

• 前端是什麼？前端用到的語言有哪些？

• 撰寫網頁的工具

🧚‍♀️ 網頁起手式

• 網頁的內容 HTML 標籤

• 網頁架購與規則

🎨 用 CSS 美化你的網頁！

• CSS 是什麼？

• CSS 的寫法

• CSS 的偽類取器

🙋‍♀️ 網頁排版囉！

• 排版會用到甚麼？

• Flex & Float 介紹

• 完成你的第一個網頁

• 定位的應用

• 利用定位製作網頁互動效果

📱 來做個 RWD 網頁吧！

• RWD 是什麼？

• RWD 網頁的製作方式介紹

• 做一個簡單的 RWD 網頁吧！

🌀 網頁動起來

• 網頁為何需要動畫？

• 網頁動畫的製作方式有哪些？

• CSS 動畫介紹

• Transition 與 Animation 屬性介紹

🧞‍♀️ 跟網頁互動

• jQuery 介紹

• jQuery 的撰寫方式

• 添加互動到你的網頁吧

🚀 用框架加速你的網頁製作

• 什麼是框架？

• Bootstrap 介紹與使用方式

• 用 Bootstrap 完成一個網頁吧

🧳 網頁切版實務

• 從版面分析切版方式

• 實際撰寫一個網站

• 結業式