「所謂的靜態網頁就是沒有動畫的網頁，動態網頁就是有動畫的網頁。」
曾經，我是這麼認為的。要是我的人生跟我的腦袋一樣簡單就好了嗚嗚…
好啦~來說正經的。
延伸閱讀： 網站原理 (1)：什麼是URL？什麼是網域？兩者有什麼差別？ 網站原理 (2)：什麼是DNS伺服器？它的功能是甚麼？ 網站原理 (3)：網站是怎麼構成的？ – 淺談網站的3大要素：UI/UX設計師 前端工程師 後端工程師
Table of Contents
1. 靜態網頁
所謂的靜態網頁，一般來說是指「沒有後台」的網頁，也就是說你的網頁單純是用HTML、CSS和JavaScript這些檔案所構成的。
也就是說在上一篇的網站原理(三)：網站是怎麼構成的？所提到的，如果網站的三大要素：UI/UX、前端、後端之中，你只會前端的技術的話，是可以製造出一個網頁的！ (只是因為沒有設計師的美感所以可能很醜QQ) 相對的，如果你只會UI/UX或是只會後端，就比較難建造出網頁，因為前端的工作就是負責用程式將網頁以視覺的方式呈現出來。
那麼什麼網頁會用靜態網頁來寫呢？通常比較少需要更新或修改的網頁才會使用靜態網頁這樣的方式來編寫網頁。
如果你的網頁需要常常更新，或是屬於資料量比較大的網站，就會建議和後端搭配編寫網頁，也就是等等會提到的動態網頁，為什麼呢？假設你今天要寫一個部落格然後目標是每天更新網站，當你每天好不容易絞盡腦汁把一篇文章生出來後，還要再寫一個HTML檔放到伺服器上，網路上的鍵盤大大們才看得到你的網頁。而在寫HTML的過程中你還必須注意哪個段落要用哪個標籤，這可謂是一個浩大的工程，你寫10篇文章就必須寫10個HTML檔，寫到後來你會發現：寫HTML好像比自己想文章還要快？這就失去了開部落格的意義。
例如：Jimmy Chen Photography 這個網站是我在2個月前寫的網站，這就是一個全部由靜態網頁建構而成的網頁。
大家可以發現，這個網站幾乎沒什麼美感嗚嗚，因為我對UI完全沒概念，只懂一點前端的技術，所以硬是把這個網頁刻出來了，而這種網頁基本上還是建議搭配資料庫的方式來編寫，否則當我需要新增照片時還需要再寫一堆HTML把照片塞進去，寫完都想把相機給砸了！
2. 動態網頁
相對靜態網頁的東西，就是動態網頁啦~ (廢話嗎)
所謂的動態網頁，就是指有後台的網站，那麼到底什麼是後台呢？後台就是個存放你網站資料的一個台 (我解釋得好爛) 。再舉一次部落格的例子，如果我們用靜態網頁的話，每新增一篇文章就需要新增一個HTML檔，但如果你是用動態網頁的方式來編寫部落格的話，你會有後台來管理你的資料，像是你正在看的這個部落格的後台長這樣：
如果你要新增一篇文章的話，就直接進到後台，點新增文章即可，他就會自動幫你產生相對應的HTML檔，而你就可以專注在文章的內容上了！
當然，動態網頁不只可以用在部落格上，如果是屬於比較大型的網站，或是大型企業的官網需要經常更新產品，也會適合用動態網頁來編寫網站的內容哦！
但相對來說因為動態網頁使用到的技術相對靜態網頁專業很多，因此建構的成本也會很高，不過優點就是如果想更動網頁的內容也會相對靜態網頁來的容易許多。
簡單來說，如果你很有錢就用動態網頁來架設網站，如果你的預算沒那麼多就用靜態網頁來架設網站，如果你跟我一樣窮，那就別架網站了吧…好啦開玩笑的，架網站的技術很多，我這邊指的動態網頁比靜態網頁貴指的是以「自己架站」或是「請專業的網站公司設計」，但如果你跟我的部落格一樣是用所謂的CMS架站，那麼就算是動態網站，成本也不會高到哪裡去哦！之後會在寫文章做詳細的說明，請大家敬請期待！
3. 結論
最後，我整理了一個表格來比較靜態網頁和動態網頁的差別，希望大家透過這個表格可以對靜態網頁和動態網頁有更清楚的認識！
| 靜態網頁 | 動態網頁 | |
|---|---|---|
| 後台 | 無 | 有 |
| 應用 | 1. 不常更動網頁內容 2. 網頁內容不多 | 1. 需要頻繁更動網頁內容 2. 網站內容龐大，需要後台來管理網站資料 |
| 實例 | 企業形象網站、個人簡歷網站 | 大型企業網站、電商網站、部落格 |
延伸閱讀：網站原理 (5)：網站運作原理 – 從瀏覽器到伺服器端發生了甚麼事？
如果覺得我的文章有幫助的話，歡迎幫我的粉專按讚哦~謝謝你！