從資料夾部署 HTML 網站
不用先架主機
把完成的 HTML、CSS 和 JavaScript 專案上傳上來,取得支援 HTTPS、邊緣傳遞、預覽和自訂網域的真實網址。
純 HTML 很單純,發佈也應該保持單純。
靜態網站不等於臨時檔案
手寫頁面、課堂作品、prototype、線上履歷、匯出檔或 AI 生成 HTML 網站,都需要幾件事做對:根目錄檔案、乾淨的資源路徑、HTTPS、快取、壓縮,以及不用解釋設定也能分享的網址。
不用框架儀式
如果專案已經有 index.html、CSS、JavaScript、圖片和資源,你不該只是為了展示頁面就先建 Git repo 或學建置流程。
為完成的資料夾設計
上傳你原本會在本機開啟的資料夾:index.html 在根目錄、相對資源路徑保留、子資料夾結構不變。
正式上線細節一起處理
DeployPages 會處理 HTTPS、邊緣傳遞、壓縮、穩定網址和自訂網域設定,讓靜態網站不像只是暫時檔案分享。
最適合已完成的靜態專案
當網站已經建好,只差乾淨發佈時,就用這條路。
手寫頁面
直接用 HTML、CSS 和 JavaScript 寫的登陸頁、課堂作業、小型商業頁、個人首頁和實驗作品。
匯出的網站資料夾
從設計工具、文件產生器、AI 建站工具、no-code 工具或建置流程匯出的靜態 HTML 檔案。
可分享的預覽
客戶審核、作品集、demo、履歷連結和一次性頁面。傳公開連結通常比傳 ZIP 檔更清楚。
上傳前先檢查
多數壞掉的靜態部署,問題不在主機,而在資料夾結構。
把 index.html 放在根目錄
首頁檔案應命名為 index.html,這樣主網址才能直接解析,不需要額外檔名。
上傳輸出資料夾
選擇包含最終 HTML、CSS、JS、圖片、字型和資源的資料夾。對 build 工具來說,通常是 dist、build、out 或 public。
使用相對資源路徑
./styles.css、/assets/logo.png 或 assets/app.js 這類引用,必須符合你上傳的資料夾結構。
先在本機打開子頁
如果網站有 about/index.html 或 docs/getting-started.html,先在上傳前打開那些路徑,早點抓到缺檔問題。
三步驟部署 HTML 專案
整理公開資料夾
把最終 HTML、CSS、JavaScript、圖片、字型和資源放在同一個資料夾,確認 index.html 位於根目錄。
上傳整個網站
把資料夾拖進 DeployPages。保留子資料夾,讓樣式、腳本、圖片和頁面照原路徑解析。
分享或接上網域
立即使用預覽網址。頁面準備好承接公開流量時,再接自訂網域和 HTTPS。
上傳後會發生什麼
檔案樹會變成網址結構。網站確認沒問題後,再接成正式網域。
立即取得預覽網址
用產生的網址在真實瀏覽器測試頁面、傳給隊友,或先檢查靜態匯出結果,再接網域。
子資料夾維持可存取
/docs/index.html 這類資料夾會變成乾淨的 /docs 路徑,/assets/app.js 也會保持供頁面引用。
準備好再接自訂網域
之後加入自己的網域,把 DNS 指向系統提供的目標,HTTPS 會作為設定流程的一部分處理。
如果部署後頁面看起來壞掉
首頁回傳 404
確認 index.html 在上傳資料夾的根目錄,而不是多包了一層資料夾。
CSS 或圖片沒有載入
檢查資源路徑。從本機檔案開得起來,不代表上線後路徑也會正確。
只有一個頁面能開
確認子頁資料夾和連結到的 HTML 檔案都有一起上傳。
JavaScript 行為不同
查看瀏覽器 console、mixed-content warning、module 路徑,以及任何假設 file:// 環境的程式碼。
HTML 託管常見問題
Q:靜態 HTML 網站有免費方案嗎?
有。靜態 HTML 專案可以從免費方案開始,足夠用在輕量個人網站、線上履歷、簡單登陸頁和 prototype。
Q:首頁檔案一定要叫 index.html 嗎?
是。使用 index.html 可以符合靜態網站解析根目錄首頁檔案的方式。
Q:可以使用巢狀資料夾和子頁嗎?
可以。如果專案包含 about/index.html 這類路徑,DeployPages 會保留結構,讓對應網址可存取。
Q:部署純 HTML 網站需要 GitHub 嗎?
不需要。Git 型發佈很適合持續開發,但完成的靜態資料夾可以直接上傳。
Q:可以部署 AI 工具生成的網站嗎?
可以,只要輸出是靜態 HTML、CSS、JavaScript 和資源檔。像手寫專案一樣上傳生成的資料夾即可。
Q:可以用這種方式託管 PHP、WordPress 或資料庫 App 嗎?
不行。這裡是給瀏覽器可直接讀取的靜態檔案。需要伺服器渲染、PHP、資料庫或後端 API 的專案,需要其他 runtime。
Q:可以用 CLI 或 API 自動部署嗎?
可以。DeployPages 支援腳本化部署,團隊不想手動拖放時,可以把靜態發佈接到 CI 流程。
Q:之後可以接自己的網域嗎?
可以。部署後在 Console 加入網域,並把 DNS 指向提供的目標。記錄解析後,HTTPS 會自動設定。