第一次發布自己的網站

先準備好正常網站，再用自己的帳號建立一個獨立練習專案。這份操作採 Cloudflare Pages 的手動上傳方式；介面若不同，先核對官方說明，不要猜按鈕或改動其他網站。

1．保留來源，整理發布副本

保留自己的 student-work/portfolio/，另外建立 student-work/publish-ready/，複製下列內容：

publish-ready/
├── index.html
├── styles.css
└── assets/
    ├── appa.png
    ├── work-brand.jpg
    ├── work-web.jpg
    └── work-layout.jpg

首頁在根層，共六個檔案。不要放課堂說明、檢查紀錄、故障副本、密碼或私人資料，也不要移走唯一原稿。

2．先在自己的電腦檢查

開啟發布副本的 index.html。逐項操作，而不只看一眼畫面：

• APPA 與 CSS 正常，姓名林小禾、技能版面設計、第三項服務活動頁設計。
• 「查看練習作品」可跳到作品區；服務、作品與聯絡導覽有目的地。
• Email 目的為 mailto:demo@example.com；這是練習信箱，不需要寄信或收到回覆。
• 窄版文字能換行，沒有整頁水平捲動。

3．建立自己的 Pages 練習專案

1. 自己登入 Cloudflare，前往 Workers & Pages。帳密只填在官方登入畫面，不附給 AI。
2. 按官方文件的 Create application → Get started → Drag and drop your files 進入 Pages 的手動上傳流程；若名稱不同，先比對官方文件與實際畫面。
3. 建立新的練習專案，名稱使用班級與自己的代號等可辨認名稱。不要選到既有正式專案，也不要購買這堂不需要的付費服務。
4. 上傳自己的 publish-ready。檢查根層就是 index.html，而不是又包一層 portfolio。核對後按畫面中的 Deploy site／Save and Deploy 完成發布。
5. 從平台顯示的結果開啟實際 HTTPS 網址，記下網址與時間。不要只按專案名稱自己拼網址。

純 HTML／CSS 不需要另外建置或安裝後端。本次使用 Direct Upload，日後若改為 Git 整合需另建專案。

4．修改後再次發布

回到本堂第 4 步，使用延伸修改 Prompt，把主要連結文字改成「查看三個練習作品」，保留 href="#works"。

先儲存、檢查本機，再將網站必要檔案複製到 publish-ready。到自己的同一個練習專案選 Create a new deployment，更新 production，重新上傳正確副本。

開公開網址的新分頁，確認文字已更新，連結仍可跳到作品區。修改來源檔不會自動更新線上畫面。

5．請另一台裝置檢查

請同學的裝置或自己另一台裝置直接開同一個公開網址，核對：

• APPA、樣式與內容都完整。
• 主要連結文字已更新。
• 作品錨點可操作。
• 記下檢查代號、裝置、時間及實際結果。

本機檔案位置、localhost、127.0.0.1 都不能代替這次公開檢查。沒有完成發布或另一裝置檢查時，記「待完成」，不要預填成功。能開啟網站也不等於已被搜尋引擎收錄。

如果這一步卡住

首頁空白或 404：先檢查上傳根層有沒有 index.html。圖片失效：對照來源與上傳檔案清單、圖片路徑。看到舊文字：核對來源、發布副本、部署時間與公開網址。

遇到帳號或方案限制時，先保留實際訊息與操作位置，不急著付費。可以先完成本機練習；公開檢查仍保持待完成。