在跟大家介紹網站設計學習方式前，會先帶著大家初步認識網站設計相關的一些小常識，尤其在接觸網站設計時，一定很常聽到前端、後端這兩個詞，接下來會和大家簡單介紹兩者的差異後，著重介紹前端網站設計的三種學習方式，實體課程、線上課程、自學的優缺點及推薦的學習課程及資源，話不多說，我們先一起了解什麼是前端、後端工程師吧！
文章導覽
網頁設計有分前端、後端，有什麼不同？要怎麼選？
無論是網站設計或是App應用程式開發設計都會需要「前端」、「後端」工程師來製作網站或App。
前端
前端就是使用者看的到的介面樣貌呈現和使用者互動的部分都屬於前端範圍，前端軟體開發工程師會需要具備美術、美感的設計能力，除了要了解相關程式語言，開發人員也要會使用後端工程師所提供的API(Application Programming Interface)和前端程式串接，讓使用者在瀏覽器操作時能夠將資料傳到後端伺服器進行運算並獲得結果後回傳到前端，由前台呈現。
前端工程師會需要學哪些程式語言？
HTML、CSS、JavaScript等等。
後端
後端則是網站後看不見的程式端運作，無論是網站需要的程式功能、資料程式處理、後台、伺服器等等，並提供API給前端進行串接。
後端工程師會需要學哪些程式語言或技能？
至少精通一種後端語言Ruby、Python、PHP、Java、 JavaScript等，至少精通並活用一項後端開發框架，例如：Rails、Django、Node.js 等，撰寫 Web API，熟悉伺服器（Web Server）與資料庫（Database）等等，並瞭解前端語言基礎HTML、CSS、JavaScript。
怎麼學前端網頁設計？入門該具備的基本技能
1. 學習 HTML、CSS、JavaScript
2. 基本網頁前端框架
3. 動態網頁設計
4. RWD響應式設計
5. SASS / SCSS : CSS預處理器學習
6. 加分－前端自動化工具
網站設計入門該怎麼學？
線上線下都有很充足的學習資源，這次會和大家介紹三種學習方式，分別為：線上課程、實體課程、自學，並推薦大家一些課程資源以及不同學習方式之間的差異！
線上課程
網站設計線上課程推薦/價格
窩課360－網頁前端排版基礎心法篇：HTML+CSS+RWD
課程價格：NT$2,400
※價格僅供參考，請依官方價格為主。
線上課程學習網站設計優點
1. 時間彈性
可以依照自己時間安排學習，時間不會被固定的課程時間綁住。
2. 多次複習
大多線上課程都是無觀看次數限制，大家可以不限次數的重複複習觀看課程內容。
3. 課程選擇性多
可以依照現階段的需求選擇適合自己的課程，例如根據自己學習程度選擇合適的課程難易度。
4. 師資選擇多
線上課程自從疫情後已經流行多年，目前有累積很多師資可以選擇。
線上課程學習網站設計缺點
1. 師資程度參差不齊
在選擇課程時需要多花時間與心力做功課。
2. 需要有自制力與自律的特性
雖然課程時間彈性，但是也意味著自己要有足夠的自制力規劃課程與複習時間，按時進行。
實體課程
網站設計實體課程推薦/價格
※每期課程價格皆不同，建議大家到官網取得最新一期的課程與價格。
台灣大學資訊系統訓練班
實體課程學習網站設計優點
1. 規律學習
在固定時間到教室上課，課程都是表定的時間，能夠督促自己跟著課表學習。
2. 同儕正向影響
同樣都想要學好網站設計的人齊聚在一起上課，不但可以達到互相督促的效果，也能夠在這樣的場合互相交流。
3. 即時解決問題
當遇到問題時可以在課中向老師提問，由老師即時回答，建立正確的網站設計觀念。
4. 課程教材完整
實體課程從過去以來已經累積很多教材及課程規畫的經驗，學員可以跟著課程進程系統性的學習網站設計這門學問。
實體課程學習網站設計缺點
1. 課程時間無法彈性調整
課程及上課路程時間都是固定的，每間補習班補課規定都不大相同，缺課的同學可能會需要用不同方式進行補課，多少可能會影響到學習效益。
2. 學習進度不彈性
無法彈性調整的上課時間對於學習上需要比較多時間理解和吸收的同學會比較吃緊。
3. 課程環境不一
不同補習班的學習環境品質都不同，對於重視學習環境的朋友，會需要多花一點時間做功課。
4. 課程中的學習吸收程度
實體課程課堂中需要快速理解並學習與做充分的筆記，因為課後無法再重新再上同一堂課。
自學
自學網站設計實體／線上資源
YouTube
GrandmaCan - 我阿嬤都會
史上最完整的新手網頁入門學習地圖 - 金魚都懂的網頁學習路徑懶人包
CSScoke
金魚都能懂 網頁設計入門 : 網頁入門第一步 - 鐵人賽第二天 | HTML教學 | 網頁教學
Flux Academy
Web Design 101: Free Full Course
線上資源
W3schoolds
html
CSS
部落格－smashingmagazine
網站設計書籍
最完整跨平台網頁設計
深入淺出 HTML&CSS 第二版
HTML5•CSS3 最強圖解實戰講座
自學網站設計優點
1. 學習時間彈性
可以很自由的安排學習時間，不會被固定的課程時間綁架，這是自學最主要的優點。
2. 實體或線上資源多
無論是實體書籍或是線上資源都十分充分，選擇性多，好處是大家可以在不同學習階段選擇合適的學習資源，加強學習。
3. 反覆溫習無時間限制
實體或線上資源都可以重複觀看。
4. 時間地點不受限
可以自己選擇學習的在舒適的環境下讓學習最佳化。
自學網站設計缺點
1. 需自備足夠的學習力
具備計畫性及自律的特質。
2. 資源品質參差
線上資源多但是資源的專業程度不一，需要時間選擇適合自己的教材。
3. 學習架構較鬆散
基礎的建立會比較辛苦。
4. 學習時間偏長
時間上可能會比其他學習方式耗費更多時間與精力。
網站設計要買線上課程、實體課程，還是自學比較好？
| 線上課程 | 實體課程 | 自學 | |
|---|---|---|---|
| 時間 | 彈性 | 固定 | 彈性 |
| 學習環境 | 彈性 | 固定，環境品質不一 | 彈性 |
| 選擇性 | 多偏雜 | 多 | 多但雜 |
| 學習架構 |
整套課程：較完整 單一課程：架構偏鬆散 |
較完整 |
需要自己安排學習架構 架構可能會偏鬆散 |
| 課件 |
線上資源 需花費時間找資源 |
豐富 |
書籍－資源豐富 線上－資源豐富但需挑選 |
| 學習效果 |
不明 佳－找到優良的課程資源，並自主學習效果最佳。 差－自學習力較差者，會降低學習效果。 |
較佳 可以於課間即時提問 |
不明 佳－理解力足夠，能廣泛運用豐富的資源。 差－自學習力及找資源能力較差者，會降低學習效果。 |
| 記憶性 | 佳－線上課程無限次數觀看，可以反覆複習。 | 普－課堂中需要即時做好筆記。 | 佳－無論線上實體資源都可以反覆溫習。 |
| 最大優點 | 根據學習狀況選擇合適的線上課程。 | 課程架構完整，可以再課間即時提問、解惑。 | 多種類多方面的學習，可以增強與培養自主學習力。 |
| 最大缺點 | 可能會有課後怠惰不練習的狀況。 | 時間固定，學習彈性較差。 | 需要耗費大量時間找資源與摸索學習方式。 |
以下提供幾個選擇時可以思考的面向讓大家可以更容易找到適合自己的學習方式：
1. 比較習慣什麼樣的學習時間安排？
- 固定學習時間：規律的課程時間可以讓自己有比較好的學習表現，這樣的朋友適合用實體課程學習。
- 彈性學習時間：根據自己學習狀況安排進度比較不會學習上的時間壓力，習慣這種學習方式的朋友嘖很適合線上學習、自學。
2. 喜歡什麼樣的學習環境？
- 固定上課環境：可以和一群有相同目標的同學一起上課，學習氛圍會增加自己的學習動力。
- 彈性的學習環境：不分場所，任何地點都可以成為學習的場所。對每天在固定時間固定地點上課會有厭煩感的朋友就會比較適合彈性的學習環境。
4. 依照自己需求選擇適合自己的學習架構
任何一種技能的學習，最重要的是建立基礎，因此學習架構就十分重要，如果想要馬上開始學習網站設計就建議可以選擇實體課程，而如果是有基本基礎的則可以找合適自己程度的線上系列課程學習，而習慣自主探索學習，有豐富資源、多方面學習的朋友就很適合用自學的方式學習。
5.自己學習特性是如何？習慣什麼樣的學習方式？
需要有人督促自己或習慣按表操課按部就班學習的朋友，會比較適合實體課程學習。而如果自己足夠自律，習慣依照自己習慣的節奏規劃學習計畫的朋友就很適合自學或報名線上課程學習，或是報名線上課程之餘也安排時間線上找豐富的學習資源，擴增自己的學習廣度。
除了網頁設計，擴充哪些技能很加分？
1. 網頁開發框架
框架有很多種，主要四大框架有：Ember、Angular、Vue、React，這四種框架都有不同的優點特色，在選擇學習的框架時，要注意框架支援哪些瀏覽器，如果不支援，會衍伸很多問題。
2. 設計觀念養成
培養好的設計觀念，增加自己對應的技能，像是設計概念的規劃與表達、多元接觸不同設計觀念，增加自己的設計廣度等等都是很加分的。
3. 培養協作管理能力
與不同部門協作或內部時，在傾聽中客觀的交流，讓團隊順利目標一致且明確並取得共識。由此可知，整合管理、規劃排程、溝通、表達能力會是很主要的關鍵，都是非常加分的能力。
總結
目前真的有很多資源可以學習，學習新技能是件開心的事，所以最重要的是找到自己適合的學習方式，持之以恆的學習，大家也可以多參加相關社團和專業人士交流，這樣的方式也是很實質的學習方式。
