2025年11月29日 星期六

【網頁教學】免費靜態網站空間 Neocities 介紹:擁有 1GB 空間與 200GB 流量,輕鬆架設個人網頁

之前我分享過關於「Google 表單自動寄信」以及「線上題庫系統」的教學,當時常有使用者詢問:「哪裡有免費的空間可以上傳圖片或聲音檔?」

雖然網路上有很多空間,但因為我之前寫的 Google 表單應用程式受到限制,無法隨意引用外部資源。因此,今天我要介紹一個非常實用的免費靜態網頁空間——Neocities

為什麼選擇 Neocities?

Neocities 是一個提供靜態網頁託管服務的平台,它非常適合初學者練習 HTML/CSS,或是用來存放網頁所需的素材。

免費版方案特色 (Free)

  • 儲存空間:1 GB (相當充裕)

  • 流量限制:200 GB / 月

  • 限制不支援外連 (Hotlinking) 到其他網站。

    • 意思是:你不能把圖片上傳到這裡,然後只拿圖片連結去貼在別的論壇或 Google 表單中顯示,圖片必須在你於 Neocities 建立的網頁中顯示。

  • 檔案類型限制:實測後發現免費版對某些檔案類型(如 MP3 音訊檔)有限制。

升級版方案 (Supporter)

如果你覺得好用,也可以考慮每月支付 5 美元升級:

  • 儲存空間:50 GB

  • 流量限制:3,000 GB / 月

  • 功能:支援外連 (Hotlinking) 到其他網站、支援更多檔案類型上傳。


Neocities 使用教學

註冊過程非常簡單,這裡就不多做贅述。登入後,點擊右上角的 「Edit Site」 即可進入網站編輯後台。

1. 後台介面概覽

進入後台,你會看到目前的空間使用量(例如:Using 0.1% of your 1 GB),下方則是你的檔案列表。系統預設會有一些基礎檔案。

2. 檔案與目錄管理

為了讓網站整潔,建議建立資料夾來分類檔案。

  • 建立資料夾:點擊 「New Folder」,輸入名稱(例如 images),按下 Create。

  • 進入資料夾:點擊資料夾名稱旁的 「Manage」 即可進入。

  • 回到上一層:點擊上方的 「Home」 按鈕。

3. 上傳檔案實測 (圖片 vs 音訊)

我們可以透過拖曳 (Drag & Drop) 或點擊 「Upload」 按鈕來上傳檔案。

  • 上傳圖片 (成功)
    我建立了一個 images 資料夾,並嘗試上傳 .jpg 圖片。上傳後點擊檔案,可以直接在瀏覽器中預覽圖片,運作完全正常。

  • 上傳音訊 (免費版限制)
    我原本想測試上傳 MP3 聲音檔供題庫使用,於是建立了一個 mp3 資料夾並上傳檔案。
    結果顯示錯誤訊息:系統提示該檔案類型不允許免費版帳號上傳 (file type free restriction)。

    • 小提醒:如果你是為了放背景音樂或音效而來,免費版可能無法滿足需求,除非升級為付費會員。

4. 建立與編輯網頁 (HTML)

除了上傳檔案,你也可以直接在線上編寫網頁。

  1. 點擊 「New File」

  2. 命名檔案:檔名限制為小寫英文 a-z、數字 0-9、底線 _、破折號 - 或點 .

    • 範例:輸入 hello.htm 並建立。

  3. 線上編輯
    建立後,點擊該檔案原本的 「Edit」 按鈕。Neocities 提供了線上的程式碼編輯器,並會自動生成基本的 HTML 結構。

  4. 修改內容
    你可以嘗試修改 <body> 標籤內的文字,例如打上 "Hello World"。

  5. 儲存與預覽
    按下 「Save」 儲存,接著點擊右上角的 「View」,就可以看到你剛剛做好的網頁已經在網路上運行了!


學習資源

如果你對寫網頁 (HTML/CSS) 還不熟悉,Neocities 網站上也提供了教學資源:

  • 點擊上方選單的 「Learn」 或 「Tutorials」,裡面有針對初學者的 HTML 入門教學。

  • 點擊 「Websites」 可以瀏覽其他使用者在 Neocities 上架設的網站,這裡有很多充滿創意的高手作品可以參考。

總結

Neocities 是一個非常佛心的免費空間,1GB 的容量對於靜態網頁來說綽綽有餘。雖然免費版無法當作純粹的圖床或音樂庫使用(擋外連與特定格式),但對於想要練習網頁設計、架設個人介紹頁面,或是配合我之前的教學製作內部展示網頁的朋友來說,這絕對是一個值得推薦的好工具。 



沒有留言:

張貼留言

注意:只有此網誌的成員可以留言。

【網頁教學】免費靜態網站空間 Neocities 介紹:擁有 1GB 空間與 200GB 流量,輕鬆架設個人網頁

之前我分享過關於「Google 表單自動寄信」以及「線上題庫系統」的教學,當時常有使用者詢問: 「哪裡有免費的空間可以上傳圖片或聲音檔?」 雖然網路上有很多空間,但因為我之前寫的 Google 表單應用程式受到限制,無法隨意引用外部資源。因此,今天我要介紹一個非常實用的免費靜態網...