網站由哪些部分組成？前台、後台與資料庫

前台與後台

這是理解網站運作最重要的一組概念。

簡單說：你在後台輸入資料，訪客在前台看到成果。

後台能做什麼

• 新增、修改、刪除文章與產品
• 上傳圖片
• 調整選單
• 查看表單詢問與訂單
• 管理會員
• 設定網站的基本資訊

詳細說明見後台管理系統是什麼。

資料庫：內容實際存放的地方

你在後台輸入的文字，不是存成一個個檔案，而是存進資料庫。

可以把資料庫想成一個很大的表格系統——每一篇文章是一列，標題、內容、日期各是一個欄位。

為什麼要用資料庫

• 可以快速查詢與排序——例如「最新的十篇文章」
• 同一筆資料可以在多處呈現——首頁的最新消息與列表頁用的是同一筆
• 方便管理——改一次，所有出現的地方都會更新

這解釋了一件事

備份時只備份檔案是不夠的——因為文章內容都在資料庫裡。只有檔案的備份，還原出來會是一個沒有內容的空殼。

這是最常見也最嚴重的備份疏失。見備份策略怎麼規劃。

靜態網站與動態網站

如果網站的內容需要自己更新，那就需要動態網站與後台。

不是每個單元都需要做成可自行管理——判斷方式見哪些內容需要做成後台可自行管理。

網頁的三種組成

從技術角度看，一個網頁由三種東西構成：

• 結構——決定有哪些內容、哪個是標題、哪個是段落
• 樣式——決定顏色、字體、排版、間距
• 互動——決定點擊之後會發生什麼

用房子比喻

• 結構是隔間與樑柱
• 樣式是油漆與裝潢
• 互動是電燈開關與門鎖

你不需要懂怎麼寫，但知道它們是分開的，有助於理解為什麼「只是改個顏色」與「改版面結構」的工時差很多。

版型（模板）是什麼

版型決定了網站的視覺外觀與版面配置。

三種做法

比較與選擇見版型、模組化與客製設計的差別。

外掛與模組

指的是為網站增加特定功能的元件——例如表單、會員系統、購物車、多語系。

兩個實務提醒

• 外掛越多，出問題的機會越大——每一個都需要維護與更新
• 來源不明的外掛可能有安全風險

只裝真正需要的。 裝了但沒用的應該移除，不是停用。

網站在手機上為什麼會自動變版

這叫做響應式設計——同一個網站會依螢幕寬度自動調整版面。

手機看到的是一欄式、選單收合成按鈕；電腦看到的是多欄並排。內容是同一份，只是排法不同。

為什麼重要

多數網站的訪客有一半以上來自手機。手機版不好用，等於流失一半的機會。

見手機版優先的設計思維。

整理成一張圖

訪客 → 前台網頁
              ↑
        （取出資料）
              ↑
           資料庫 ← 後台編輯 ← 管理者

理解這個流程，就能理解：

• 為什麼要備份資料庫
• 為什麼後台要保護好
• 為什麼改了後台前台就會變