儘管現在網站的開發方式有很多種，前端框架、MVC 或是我們在幾天前部署到 Github 的單單一個 HTML 檔案，不論是用哪種方式來製作，也與靜態或動態無關，瀏覽網頁的時候都是在瀏覽器上輸入網址送出後，透過網址向伺服器取得網站的檔案後，才能在瀏覽器上看到網頁。

而靜態與動態網站的差別是在你看到畫面之前的階段，也就是為什麼你可以看到現在網站要給你看的畫面（內容）？

靜態網站所呈現的內容會是固定的，不論你是誰，只要連到這個網站所看到的就會是這個內容，直到這個網站的檔案被開發者直接變更。
而動態網站則會根據使用者的身份（例：會員）、在網站上的操作行為（例：將商品加入購物車）等等，來顯示不同的畫面給使用者。

靜態網站

靜態網站一般來說是由較為單純的 HTML、CSS、JS 所構成，如同上述，靜態網站所顯示的內容在任何使用者來看，都會是一樣的。

當使用者透過瀏覽器發送請求到伺服器時，伺服器會回傳對應網址的檔案，而只要檔案沒有被更改，使用者所看到的畫面就都會是相同的。雖說是相同、固定的內容，但並不是說網頁上沒有按鈕、影片、動畫效果或是 JS。

一般常見的靜態網站有個人的形象頁面、作品集網站、單頁式的行銷頁面等等，這些頁面都不會要求使用者進行登入或是根據從使用者端取得的資訊做顯示內容的變更。

• 優點：
  因為內容都是固定的，只有初次造訪網站的時候需要下載網站的檔案、資源，日後再造訪的時候，透過瀏覽器的暫存就可以很快的去取得相同的內容。
  也因為不會依據使用者去顯示不同的內容，所以在瀏覽上十分地方便，不需要登入、通過驗證才能看到頁面，十分適合用在宣傳頁面、官方網站、個人網站等。
• 缺點：
  如同優點所述的，靜態頁面需要使用者的資訊就可以瀏覽。這也讓網站沒辦法對不同的客群去顯示適合的內容，像是取得使用者所在的位置、裝置的語言，來變更網站顯示的內容，使得靜態的網站較為缺乏彈性。

動態網站

與靜態網站的一視同仁不同，動態網站會根據不同的使用者而改變要呈現的資訊。根據使用者提供資訊的不同，來產生符合使用者需求的頁面：

1. 時區：像是有些網站上的特惠活動，結束的日期會是當地時間的 00:00
2. IP：像是 Netflix 對不同 IP 的使用者呈現不同的影片
3. 使用者帳號：會員的登入
4. 記錄：在登入購物網站後，網站會顯示你的商品瀏覽紀錄，甚至從你的購買記錄來推薦其他相關的產品
   動態網站在取得使用者的資訊後，會帶著這些資訊往伺服器送，並從資料庫取回符合該使用者需求、權限的資訊呈現在瀏覽器的畫面上，這讓動態網站在資訊的呈現上跟使用者達到了互動。

• 優點：
  產生為使用者量身定做的客製化內容。
  有些動態網站會有後台，前台會依據後台的設定而顯示不同的資訊，這也讓動態網站的資訊變化能更靈活、符合趨勢。
• 缺點：
  動態網站在瀏覽上會有較為頻繁地資料請求，像是社群網站的無限捲動，而這可能會讓網站的載入速度下降。
  動態網站雖然比靜態網站更有彈性，但因為用到的技術較為龐雜，而這也會導致開發時間、成本的上升

以上就是一些對於靜態、動態網站的比較，但在目前的前端開發來說，有不少的網站其實是動態與靜態網站的合體了，網站上有些頁面是靜態、固定不變地（像是隱私權宣告頁面），有些頁面則是會根據你的行為而有所不同（那個越來越滿的購物車），這樣的組合方式也讓現在的網站在保有內容調整的彈性之外，也能兼顧一些靜態網站的載入速度快的優點。

參考

Static vs. Dynamic Websites: Here's the Difference