最近很久沒寫網頁相關的文章了呢！有點懷念一下就寫了，今天來分享一下靜態網頁與動態網頁的差別。應該又是一篇短文吧ww
靜態網頁（Static Webpage）
靜態網頁是利用HTML、CSS與JS堆疊成的網頁，通常不會有前後端分離的概念，但因為相對動態網頁而言比較不吃效能、檔案大小較小與不需要資料庫等特色，靜態網頁的託管平台相對動態而言多很多，例如知名的Github Page就是專供靜態網頁用的。
名稱叫靜態網頁，並且只靠HTML打天下，代表的是網頁顯示的內容始終如一，很難根據時間地點更改內容。並且因為無法改變，代表靜態相對會比較難做到與訪客的互動，或者會需要外連到一個動態網站。
靜態網頁的優點是檔案相對會小很多，並且因為不須搭載前後端分離的概念，基本就是一個HTML打天下，因此載入速度比動態網頁來說是快上了不知道幾倍，已經可以完全輾壓了。但魚與熊掌不可兼得嘛，既然沒有後端代表就無法做出登入的功能，並且因為無法做登入登出也沒有後端，造成靜態網頁的編輯就得跟HTML打交道，或是跟Node.JS啦…因此一般比較常用在簡單的小網頁，或是部落格之類站長不介意跟Code打交道的網頁上。而購物網站等就不會這樣了，因為連付款都沒法處理你的購物網站真的只是網站而已ww
目前著名的靜態網頁產生器有基於Node.JS打造的Hexo、Ruby寫的Jekyll與基於Go打造的Hugo等，但缺點是大多需要跟一堆資料夾與程式碼打交道。
以下是靜態網頁生成器大多會使用的標記語言Markdown的片段，靜態網頁生成器大多會使用這樣的方法編輯文章：
靜態網頁產生器
靜態網頁產生器是一種透過程式將設定轉換成HTML、CSS與JS的完整網站的工具，它方便你可以不用自己寫網頁原始碼。只需要按照靜態網頁產生器的規定就可以寫出一個不錯的網站，並且產生的是較快的靜態網頁，因此許多技術比較硬的部落客喜歡使用這種方式，而非下一章節提及的CMS軟體（這兩個有差）
靜態網頁產生器讓編寫網站變得比較容易，但大部分仍然會沒有介面化編輯器（意味你還是要跟終端機打交道），如Hexo、Hugo、Jekyll是著名的三大開源靜態網頁產生器，特別的是著名的靜態網頁產生器大多是開源的，我拿一個要付錢還要跟終端機打交道的東西怎麼會吸引人你說是吧w
優點
- 檔案小
- 載入快
- 代碼簡單
- 不吃資源
- 維護方便
- 不強制需要特殊作業系統
（像PHP一般要Linux環境，ASP.NET則會需要Windows Server環境）
缺點
- 活潑性較低
- 不人性化，要跟程式碼打交道
- 需要對HTML、CSS與JS有一定程度的了解
- 始終如一
- 無法做到需要後端或API調用的功能
- 框架或產生器較少
動態網頁（Dynamic Webpage）
如果靜態網頁是一成不變的現實世界，動態網頁就更像是活潑的虛擬世界。動態網頁大多基於PHP、ASP.NET或Node.JS編寫，需要前後端引擎對效能有較高要求，但優點是編輯非常簡單、並且支持帳號管理、前後台、API呼叫、資料庫等，且相對靜態網頁而言不需要跟代碼打交道，你只需要打開後台面板，新增文章就只要按連結就好。
動態網頁的系統比靜態網頁多更多，例如本站在使用的開源CMS：WordPress、Joomla!、Drupal為著名CMS三巨頭；以及商業的Weebly、Wix等也是這種。
CMS（Content Manage System）
CMS，中文內容管理系統，它整合了前台與後台功能，並且提供完整的網頁管理功能，方便使用者可以在圖形介面中輕鬆管理自己的網站。
使用CMS可以方便你不用花時間在設計網頁版型上，並把這些時間拿去提供更棒的網站內容。並且大多數CMS都對搜尋引擎優化（SEO）友好，也就是可以方便你的網站爬到估狗第一頁。
但缺點是你會被限制在一個框架中，自由度當然相較自己刻HTML和CSS來的低，但你可以得到的是簡單。
著名的CMS包括本文提到的開源三巨頭WordPress（WP）、Joomla!（逐浪）、Drupal，並且許多免費網站架設平台如Wix、Weebly也都是一種閉源的CMS。
動態網頁相比靜態網頁有很多優勢。例如因為每次訪問大都是由伺服器依照動態網頁程式碼進行渲染得來的，因此可以為每個訪客每次訪問產生不同的頁面，例如登入前與登入後提供不同效果、手機電腦不同頁面、多語系網頁等；並且因為支持前後端因此可以架設後台面板，方便你不修改代碼就做到新增文章、新增商品、處理金流等功能
下圖是WordPress這款著名的CMS工具，以下是我寫這篇文章的編輯器：
當然這也不是沒有代價的：支持這些功能都是需要伺服器運作的，所以更吃伺服器效能；提供更高的互動性需要伺服器時時渲染；而這些渲染即使再快也是需要時間，比起預設就直接搞定HTML的靜態網頁，需要經過渲染把PHP代碼轉換成HTML的動態網頁在原理上就落後人家靜態網頁好一大截，因此動態網頁再怎麼優化都很難超越靜態網頁的能力。
優點
- 互動性高
- CMS與框架選擇多樣
- 可以製作更多功能（如登入系統等）
- 擁有更多變化性
- 可以用來調用API
- 為每個訪客產生獨一無二的頁面
缺點
- 吃效能
- 需要特定系統環境
- 維護較為麻煩（不安裝CMS下）
- 載入慢
該怎麼選擇？
如果你的網站只是個簡單的部落格，不需要太多花俏的東西，只是想要純粹分享自己的所見所得，沒有要跟朋友一起寫（或他們也可以忍受），可以使用Markdown的話，使用靜態網頁可以讓你的網站載入速度快很多。並且靜態網頁有Github Pages可以讓你免費開網站，網址也不會到很長。
如果你想開部落格卻不想跟代碼打交道，想要一個像平常用的Word一樣方便的編輯器；想跟朋友一起寫文章、炫技；或想在網站賣東西，那不用懷疑一定動態網頁適合你。但切記動態網頁很吃優化，因為它的載入跟伺服器效能息息相關；動態網頁相對免費託管品質也會更差（叫你付錢的意思）；並且你會很明顯發現網站會比別人慢，這是合理的。
而如果你想開商城類的網站…不用懷疑，動態網頁，除非你跟自己過意不去或不想自動化，不然靜態網頁示在花時間。如果想在網站賣課程、開論壇…基本上你要自己寫個靜態網頁的東西也可以，不然還是動態網頁可以省很多事。