【網頁切版直播班】帶您做出前端面試作品| 六角學院

本週題目我們將會詳細講解Flexbox，並藉由後面幾週的反覆練習，讓您成為Flexbox 的切版專家！ 作品主題：個人網站. 教學關鍵字： Flexbox 排版技巧、水平與垂直置中、常見 ... 六角學院 六角學院 別說了，我要上課 你是不是覺得，CSS易學？ 網頁資源超多 覺得自己也算略懂 上戰場才發現，CSS難精！ 沒代表作品，找不到版型練習 沒足夠知識，語法知識量不足 沒實戰機會，切版熟練度太低 你認真嘗試了 影音課程、各種實體課程、翻閱各大文件 還是學不好？ 讓我們來培訓你 這堂課，要帶你/妳做出好作品 凡參加本次直播班學員，將會獲得 8個業界熱門主題設計稿，頁面數量超過20頁 提供學員專屬UI設計稿授權，方便您做成面試專用作品 由淺入深的課程大綱 這門課程，我們是以「業界常見版型主題」為導向，來規劃我們的課綱，讓您上完課後，就能夠開始動手練版型。

第一週：1px也不差的版型控制術 在排版時，常常為了幾px的位移或跑版而傷透腦筋嗎？其實只要掌握幾個關鍵知識，你也能切出精準到位的版型！ 作品主題：履歷設計 教學關鍵字：盒模型、line-height行距計算、verticalrhythm(垂直韻律)、display狀態、CSS實務選擇器技巧、圖文排版技巧 第二週：Flexbox網頁排版術 李小龍說過：「我不害怕曾經練過一萬種踢法的人，但我害怕一種踢法練過一萬次的人」，網頁排版擁有float、inline-block、flexbox、grid流派，但是你真的有認真將一個流派專精到讓人會怕嗎？本週題目我們將會詳細講解Flexbox，並藉由後面幾週的反覆練習，讓您成為Flexbox的切版專家！ 作品主題：個人網站 教學關鍵字：Flexbox排版技巧、水平與垂直置中、常見版型教學 第三週：伸縮自如的RWD手機網頁排版術 行動裝置這麼多，你的網頁在 全部螢幕解析度都支援嗎？還是你只會下一個手機版mediaquery，而中間的size都忽略了？其實RWD沒你想像中的複雜，讓我們來教會你！ 作品主題：RWD形象官網 教學關鍵字：mediaquery、SCSS、使用者體驗、表單設計 第四週：多頁式網頁設計 去面試時準備的作品，永遠只有一頁個人介紹網站嗎？頁面一多就不知道該怎麼管理你的CSS了？這堂課我們將會分享心法與工具，讓你頁面再多也不怕！ 作品主題：多頁式RWD形象官網 教學關鍵字：gulp、多頁設計、SCSS管理、layout版型規劃 第五週：後台表單設計 一個完美的前台，一定會有個維護方便的管理後台方便上稿，也同時會是你與後端工程師協作時，必須要會的版型設計！ 作品主題：後台頁面設計 教學關鍵字：Bootstrap元件運用、表單使用者體驗、jQuery動畫設計 第六週：導入網頁規範設計流程 當你頁面數量不是3~5頁，而是30~50頁以上，該如何制訂規範，讓產出的網頁都能模組化輸出，進以提升效率，也是網頁設計師需考量的一環！ 作品主題：電商網站 教學關鍵字：SCSS自訂Bootstrap、格線系統、版型管理術 第七週：視差滾動 在2020年，網頁已經擺脫中規中矩排版，我們能藉由簡易的JS套件，讓自己的網頁具有動感，設計出具備視差滾動技巧的優美網站！ 作品主題：產品介紹網站 教學關鍵字：熱門視差滾動套件、JS瀏覽器控制 第八週：CSS模組化管理 一個成熟的前端介面，不論是版型管理、語法支援度、元件應用都得顧及到位，本週將會詳細介紹各角度的技術詮釋，以做為完美的收尾。

作品主題：大型訂房網站 教學關鍵字：SMACSS、OOCSS、Template元件設計 你是不是擔心這堂課不適合自己？ 在職前端學長姊心得，了解課程內容 Ruta 行銷轉前端 六角的直播班，除了老師會在線上一步步帶同學實作以外，也會幫同學們分組。

透過網頁切版直播班，Ruta也認識到了一起學習前端的好朋友，在直播課結束多年後，還有持續在聯絡，也會互相加油打氣！ 看更多心得＞ Alex 警察轉前端 其實在參加前，我覺得切版感覺不是很難，因為那時候已經學了Bootstrap和CSS感覺我都切得出來，但參加完就覺得直播班練切版練得真的很扎實！切版直播班前四週比較像在複習，後四週難度才飆升，每週都會有一個全新的版型要切，那時真⋯⋯ 看更多心得＞ Alysa 海外同學轉職前端 Alysa鼓勵學弟妹們可以試一下「把目標訂高一點」，目標要拿A，你最差的時候只會拿B，如果一開始就定B，那你就會拿到C。

因此一開始就把目標訂高，你會為了能夠達到高要求而更努力！最後Alysa想跟學弟妹們說：學習的時候code⋯⋯ 看更多心得＞ 用直播上課的方式真的可行嗎？ CHEN 我覺得直播班的課程互動比較好，透過一問一答讓我更好吸收，而且多了更多切版的練習機會，真的覺得直播班讓我切版技巧進步了。

最喜歡直播班老師不斷加碼課程以及分享自己過去開發的經驗。

Shenny 如果你是像我一樣容易怠惰、對自己太好的人，非常推薦報名直播班，因為在這樣的環境下才能使自己更進步，是一種雖然有點壓力卻有趣的學習方式。

Ruta 學習的路上一個人很容易就發懶鬆懈，但上直播班會知道有一群人跟你一樣正在為作業燒腦，然後還有人莫名其妙交超快時，就又會有繼續追趕的動力。

Alex 這次的切版直播班也有一些完全的新手，連影音課程都沒上過，但是只要照著老師的安排，預習→聽課→做作業→接受鞭打→聽課→做作業，只要照著進度，就算是完全的新手也可以跟得上，而且絕對可以變強，變得很強。

Previous Next 這麼多課程，為什麼要參加這個？ a841722 老師會提供直播錄影檔及課後講義讓我們可以好好複習，助教及老師也會提供超多補充資源，也會有範例code讓學員們可以參考，真心覺得超佛心der！！！ Ryan 上完這次的課程之後突然覺得，參加這門課程的所有人，都會是你學習上的老師，因為真的可以看到很多不同的切版寫法和想法，真的受獲良多。

Siling 每天Slack總是有滿滿的討論，這裡沒有笨問題，非常鼓勵大家發問。

老師們、助教們、後勤組、同學們，一定會有人回覆你的問題，除了小組之間會分享與討論，還有大群組會看到很多問題，看別人問的問題，自己也會吸收到很多知識。

Ivy 最好的學習方法便是理論搭配實作了，課程每周皆會釋出一個版型作業，讓學員們可以透過實作加深學習印象，並找到還不了解的問題點，深入每周主題的學習。

Previous Next 流程一 登入遊戲系統 報名成功後，您會收到Email勇者邀請信件，文中會引導你加入程式勇者村，並承接切版任務。

流程二 承接切版作業任務 每週直播課程結束後，我們會派出切版作業任務，八週總計就有八道任務。

流程三 提交審核 學員們提交任務後，將由六角助教們進行審核，並回報是否完成任務。

流程四 任務完成 當助教回報任務完成後，任務上的積分都會累積為完成率，可以獲得課程特別獎勵！ 主要講師 版型講解、TailwindCSS 江穎旻 六角學院講師 CSS教學經歷： ＊三屆切版直播班助教長，批改作業份數超過1,000份 ＊金龍國小教育訓練講師 知識打底、Bootstrap5 廖洧杰 六角學院校長 CSS教學經歷： ★Sass教學手冊作者（逾十萬人瀏覽） ★2017中國第三屆CSS研討會講者 ＊2016中華電信Sass企業教育訓練 ＊2015ITHomeSass&RWD講者 ＊2014痞客邦Sass企業教育訓練 ＊2014IT鐵人邦Sass優選 網頁切版直播班 用八週的時間，帶你成為切版達人 授課內容： 開課日期：20227/8(五) 授課時段：7/8～8/31每週三跟五，共16堂 教學時數：每堂1.5~2.5小時，共16堂，總計36小時 直播教室：使用ZOOM進行直播教學 上課行事曆 CSS技術我全都要！ 週三 多元解法一點就通 週五 帶你打好程式基礎（🌟初學者必上） 尚未開課 第一週： 1px也不差的版型控制術 7/8（五）20:00~22:30，2.5小時 第一週： 初見TailwindCSS，窺探不同CSS用法 7/13（三）20:00~22:30，2.5小時 第二週： Flexbox網頁排版術 7/15（五）20:00~22:30，2.5小時 第二週： 客製化TailwindCSS，擁有專屬主題 7/20（三）20:00~22:30，2.5小時 第三週： RWD手機網頁排版術 7/22（五）20:00~22:30，2.5小時 第三週： 簡單的響應式設定，實現三階段變身 7/27（三）20:00~22:30，2.5小時 第四週： 多頁式網頁設計 7/29（五）20:00~22:30，2.5小時 第四週： 輕鬆打造TailwindCSS作品 8/3（三）20:00~22:30，2.5小時 第五週： 後台表單設計 8/5（五）20:00~22:30，2.5小時 第五週： 表單版型作業講解 8/10（三）20:00~21:30，1.5小時 第六週： 導入網頁規範設計流程 8/12（五）20:00~22:30，2.5小時 第六週： 電商版型作業講解(1) 8/17（三）20:00~21:30，1.5小時 第七週： 視差滾動 8/19（五）20:00~22:30，2.5小時 第七週： 電商版型作業講解(2) 8/24（三）20:00~21:30，1.5小時 第八週： CSS模組化管理 8/26（五）20:00~22:30，2.5小時 第八週： 大型網站管理心法 8/31（三）20:00~21:30，1.5小時 為了幫助您攻克BOSS，我們準備好了！ 線上助教團隊全程陪伴 8週授課期間，我們會一行行看您的程式碼，確保有達到專業水準！ 這堂課適合新手嗎？ 如果你是初學者，我們會提供給你免費3hr的影音課程帶您入門，並也享有24小時內助教問題支援。

掌握好網頁切版後，你就可以依照自己的技能樹，再轉職成： 網頁設計師 前端工程師 後端工程師 學完這門課，你將會獲得 超多的面試作品 我們的設計稿皆提供授權，讓您安心做出讓面試官眼睛一亮的精美作品。

紮實的網頁排版技巧 我們精心挑選的八個在實務開發上必會碰到的版型，全部掌握之後，包準在業界無往不利。

為顧及教學品質，本班僅招收450人 報名時段如下： 1 6/2(四)21:00~24:00提供六角老學員，3小時快閃註冊 2 6/3(五)12:00對外開放報名 報名成功後，您將會收到Email通知，並引導您完成新手任務。

3 6/3(五)~6/12(日)進行報名與新手任務 常見Q&A Q：網頁切版直播班是預錄的嗎？ A：不是哦，每次課程都會是老師直接Live教學，這樣才能提升互動性，增強學員吸收知識體驗 Q：有幾天直播時段沒辦法配合的話，會有錄影影片嗎？ A：有的！我們直播影片會保留到2023/8/31，方便學員隨時回平台回顧。

Q：我看到你們有影音課程（ex:使用HTML、CSS開發一個網站）跟網頁切版直播班，到底該選哪個好？ A：如果你有迫切性想學好網頁切版，建議你選本頁面的直播課程，直播的參與互動性高，並藉由老師們獨創的前端教材，學習效果更好。

Q：那影音課程（ex:使用HTML、CSS開發一個網站）的話呢？ A：在影音課程（ex:使用HTML、CSS開發一個網站）設計上，我們一小節都設計成5~20分鐘，方便時間較碎片，沒辦法抽出一小時以上觀看直播課程的學員來選擇。

Q：但是我有你們的影音課程（ex:使用HTML、CSS開發一個網站），還需要參加網頁切版直播班嗎？ A：影音課程的設計上，理論和實作都是5:5，而網頁切版直播班則是實作機會比較多，互動性也高。

如果你是迫切想掌握好一門技術的學員。

建議是參與網頁切版直播班，並藉由影音課程來提升知識量 Q：我可以只上網頁切版直播班嗎？ A：當然可以，只要有跟上網頁切版直播班的內容，也會有足夠的知識量來做我們提供的版型。

Q：除了老師直播外，我有問題該怎麼辦？ A：我們遊戲系統會提供問答專區，線上的助教都會在發問後24小時內回覆，並且也會提供專屬的Discord聊天頻道，來讓您與助教一起互動！ Q：如果無法參與，可以申請退費嗎？ A：退費前請先詳閱退費規定。

若不符合需求仍欲退款，可寄信至[email protected]，將會有小幫手協助進行退款。

網頁切版直播班 以「業界常見版型主題」為導向，八週帶你做出面試專用作品，成為切版小能手。

此組合包含： 8週直播課程 8個業界熱門主題設計稿，頁面數量超過20頁 學員專屬UI設計稿授權 一年時間免費課程錄影回顧 作品程式碼檢視，確保觀念與程式碼品質 原價NT$12,800 NT$8,400 已額滿 P.S.：六角學院也有[email protected]嘍，歡迎加入隨時獲得六角學院第一手資訊！ 購買 就算是小問題，我們也在線上立即回覆您。

付款後48hr內會收到開通課程連結 課程支援以下支付方式 信用卡 超商付款 ATM轉帳 立即註冊