datafox 竣工後記

有些事情，從「想要」到「真的完成」，中間隔著一段你不會對外說的懷疑期。如果看到我的post會發現，我從7月底就已經把網站建好，但是經過了緊湊的暑期實習與碩一上生活之後，在碩一下，準備要投更多履歷的時候，我終於下定決心把我的個人網站建置起來，並且朝向「個人品牌」這條道路上邁進。這篇文章，是我在 datafox.tw 正式竣工後，趁記憶還熱著時寫下的完整紀錄，以及在2026年（有人稱之為AI SEO元年）如何建立個人品牌網站的實戰指南。

我會分享：

怎麼買網域：從代稱到品牌定錨
怎麼用 GitHub Pages + Hugo 建站：輕量、免費且強大的組合
怎麼設計 AI 時代的 SEO：為 Perplexity、Gemini 等 AI 搜尋引擎優化
怎麼 5 分鐘內加上專業工具：整合 Formspree 表單與 Calendly 預約
怎麼建立流量追蹤與信任機制：GA4 與不蒜子計數器的配置
怎麼把身份定錨為 Yu-Chi Ko (datafox)：建立專業的 Trust Bar

一、為什麼我要自己的網站？

在這之前，我已經有：

但我發現，在2026年的現在，流量已經不是靠者傳統seo或者向老天祈求而來，而是要因應真人與ai的夾殺（幹這句話應該已經很不像ai了吧這段是我寫的）。我做了一個很有趣的實驗：我問perplexity說「請推薦我一些在台灣大學做AI應用的專家」，結果雖然一開始ai不願意回答，但是我逼問之後，他還是有吐出一些名字，其中就有兩位是我認識的朋友。我很驚訝，因為他們平常行事低調，但是在ai的檢索回答裡面得到了高評價。

這讓我反思，我應該要怎麼樣才能夠在台灣電資學院研究所這個強者環伺的叢林裡面脫穎而出呢？而把我的個人網站建置好，並且使用簡單但強大的seo進行自我推銷，是現在AI時代不得不做的事情。此外，我在調整medium的文章時，我也發現medium可以做的東西很有限，文章結構封閉，而且也不能做很多例如填寫表單、預約會議等功能，這讓我意識到一件重要的事情：

平台是借來的，網域才是自己的。

為什麼主權資產很重要？因為在AI時代，我們無法預測平台會不會倒，或者平台會不會突然改變規則，所以擁有自己的網站，才能夠確保自己的資料和內容不會消失。

二、從 0 到上線：技術建構流程

2.1 購買網域（GoDaddy 與其他選擇）

我選擇了 datafox.tw。

購買流程其實不難，但有幾個要注意：

第一年通常會便宜（促銷價），在這裡我使用godaddy進行購買，前兩年是1390元，攤提下來一天不到兩元，我覺得很划算。
記得確認續約價格
關閉多餘的加購項目，等到真的有需求時再進行購買。
考慮 .tw vs .com 的品牌定位（我是喜歡datafox這個名字，但是datafox.com已經有人買過了）

為什麼選 datafox？雖然一開始真的是我腦袋一敲想到的名字（如果有認識我的人，我大學時主要的名稱是blackwingedkite黑翅鳶，medium使用這個名字，而更早之前，例如我一開始創立的github名字叫做bonnieker，來自我那時很喜歡的小兔子bonnie+我的姓氏ker的組合。

但是我在建站名稱選擇時，我發現一件事情：這些名字都有點太難記了，blackwingedkite這個詞有15個字代表的是一個物種，而非一種技術（而且如果未來我想看可愛的黑翅鳶相片時我可能會找到我自己有點尷尬），而bonnieker這個名字則比較可愛，但是就只是很基本的名稱＋姓氏組合，非常的無趣（而且男生叫bonnie被點名很怪xd），所以我當時在想新名字時，決定使用datafox這個名字，主要是朗朗上口且好記，符合我平常喜歡狐狸的印象，而.tw也代表了我的身份和國家認同，在查詢後發現這個名字意外的不常見（我只有看到oracle一個不太有名的專案使這個名子），所以我就絕定了這個名稱做為我個人品牌的起點。

順帶一提，如果現在你在google搜尋datafox，第一個出現的結果已經是這個網站了，看來在搜尋引擎中，我已經贏過oracle了（誤

2.2 GitHub Pages + Hugo 建站

我沒有選 WordPress，也沒有租主機。

原因很簡單：

github pages不需要後端
免費
靜態網站穩定
可版本控制
deterministic 結構

我使用：

GitHub Pages 作為部署平台
Hugo 作為 static site generator
現成主題作為基底再客製化

基本流程：

建立 GitHub repo
安裝 Hugo
選擇主題
設定 config.toml
設定 custom domain
綁定 DNS 這裡我不是專家，我也是問ai很多次才搞定的，但大體上可以參考這幾篇文章：

三、AI 時代的 SEO 設計

這一段，是我最重視的部分。

3.1 導入 JSON-LD Person Schema

我不是只為 Google 做 SEO，我是為 AI Search Agent 做準備。

我加入了：

@type: Person
name
affiliation
jobTitle
knowsAbout
sameAs

目的：

讓搜尋引擎與 AI 系統能清楚辨識：

我的技術邊界
我的研究方向
我的身份標籤

這部分可以詢問 AI 夥伴協助生成精確的 Schema 標記。我將其實現於 extend_head.html 中，確保這些專業資訊不僅存在於文章內，更存在於網頁的「機器可讀」層。在大數據時代，對於 AI 的自我定位應該像是寫代碼一樣精確、明確且具備結構感。

以下是我實際使用的 Person Schema 範例：

{
  "@context": "https://schema.org",
  "@type": "Person",
  "name": "Yu-Chi Ko (柯宥圻)",
  "jobTitle": "AI Systems & LLMOps Engineer",
  "knowsAbout": [
    "Large Language Models (LLM)",
    "LLMOps",
    "Agentic AI",
    "GraphRAG",
    "Quantitative Finance"
  ],
  "email": "datafox.tw@gmail.com",
  "sameAs": [
    "https://github.com/datafox-tw",
    "https://linkedin.com/in/koyuchi"
  ]
}

[!TIP] 結構化數據能幫助 AI 構建你的「知識圖譜」。當有人在 AI 搜尋引擎詢問技術關鍵字時，擁有明確 Schema 標記與 NTUAI 背景連結的你，將會比普通網頁更具競爭優勢。

3.2 Aligned 關鍵字策略

我沒有堆疊關鍵字。相對的我做的是「語義對齊」。

例如：

LLMOps
Agentic AI
Structured Reasoning
Intelligent Trading
Verifiable Systems

我刻意讓技術雷達與這些詞彙在語義上連動。

四、5 分鐘內完成的專業升級

專業感，很多時候來自「降低對方的摩擦成本」。

4.1 商務聯繫表單（Formspree）

我沒有寫後端。

我使用 Formspree：

前端 HTML 表單
直接轉寄到信箱
無需伺服器

我為了防止垃圾郵件 (Spam)，還加入了一個隱形的 Honeypot 欄位：

<form action="https://formspree.io/f/your_id" method="POST">
  <!-- 防垃圾郵件欄位 -->
  <input type="text" name="_gotcha" style="display:none" />
  
  <label>您的姓名 / Name:</label>
  <input type="text" name="name" required>
  
  <label>電子郵件 / Email:</label>
  <input type="email" name="_replyto" required>
  
  <button type="submit">傳送訊息 / Send Message</button>
</form>

只要將 action 指向 Formspree 給你的 ID，連 API 都不用接，馬上就能收信。

4.2 Calendly 預約整合

我加入：

雙語預約頁面
與 Google 日曆同步
自動排程

這讓商務洽談流程標準化。預設會議時長是30分鐘，只是因為他是預設，但我如果未來真的有新客人來問我相關事宜時我可以做介紹，和預留未來可以更改的空間。

五、流量與信任機制

5.1 Google Analytics 4：數據驅動的個人品牌優化

在傳統的觀點中，只有電商或大型網站才需要數據分析，但在 AI 時代，個人網站的「數據意識」同樣重要。

我導入 GA4 的核心目標是捕捉**「訪客對什麼感興趣」。對於個人網站來說，GA4 是現有的最強大、且完全免費**的追蹤工具。即使每個月只有 100 位訪客，你也能像專業 PM 一樣觀察數據：

精準捕捉訪客興趣：透過查看哪些頁面的點擊量最高（例如「作品集」vs「生活筆記」），我可以知道潛在的合作對象或人資（HR）真正關心我的哪項特質。
衡量參與深度與停留時間：GA4 改進後的「平均參與時間」比傳統的「停留時間」更具參考價值。如果一位訪客在我的 LLMOps 筆記停留了超過 3 分鐘，這代表內容成功觸發了深度閱讀，而非只是誤點。
追蹤互動行為：我可以設定追蹤「點擊預約按鈕」或「點擊 GitHub 連結」的行為。對我來說，這就是個人品牌的「轉化」。

在 PaperMod 這種現代主題中，安裝 GA4 就像呼吸一樣簡單，只需在 hugo.yaml 中配置一行評估 ID：

googleAnalytics: G-XXXXXXXXXX

[!NOTE] 對於每個月流量在幾萬人次以下的個人網站，GA4 幾乎是終身免費的。它能讓你在不需要投入資金的情況下，擁有與頂尖科技公司同等級的分析視角，幫助你快速迭代「關於我」頁面的內容。

5.2 不蒜子計數器

我加入了即時瀏覽數顯示，用來透明化流量，他是我最驚喜的一塊，因為真的不需要做任何設定，只需要在隨便一個地方插入兩行code就可以做到了，算是個意外之喜，也讓我可以有事沒事就簡單的觀察我的流量是否有成長。

在 footer.html 中注入這個簡單的腳本：

<script async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>
<span id="busuanzi_container_site_pv">| 總瀏覽量 <span id="busuanzi_value_site_pv"></span> 次</span>

當一個網站被搜尋引擎標記為「活著的」，它的排名與重要性就會慢慢爬升。

六、Cloudflare Email Routing：專業感的最小成本升級

當你有了自己的網域（例如 datafox.tw），如果想擁有一個專業的電子郵件（如 datafox.tw@gmail.com），通常需要購買 Google Workspace 或 Microsoft 365，每個月都要噴掉至少 6 美金的訂閱費。

但我發現了一個 完全免費 的強大方案：Cloudflare Email Routing。

6.1 將網域託管到 Cloudflare

這是我最推薦的一步。你可以把在 GoDaddy 買的網域，將 DNS 伺服器改指向 Cloudflare 的。這本身也是完全免費的，而且 Cloudflare 提供：

全球最強的 CDN：讓分散在全球的讀者都能飛快地載入你的靜態網頁。
企業級的安全防護：自動防護 DDoS 攻擊，即使是個人網站也能享有銀行等級的「護盾」。
極速的 DNS 解析：比絕大多數註冊商內建的介面更簡潔、且解析生效速度極快。

6.2 實現 Email Rerouting (轉寄機制)

只要在 Cloudflare 後台開啟 Email Routing，你就可以像魔法一樣建立「自定義信箱別名」，例如：

datafox.tw@gmail.com 👉 轉寄到我的 gmail
research@datafox.tw 👉 轉寄到另一個指定信箱

這對個人品牌的意義在於： 訪客在官網看到的是一個專業、具備強烈品牌一致性的信箱，但身為開發者的你完全不需要切換後台，直接在原本的 Gmail 處理所有進信。這是我認為投資報酬率最高（成本 0，專業度 +100）的一項隱藏版設定。

七、身份定錨：我到底是誰？

這一段，是技術之外最重要的。

我重新思考：

我要用哪個名字？
Vincent？
Yu-Chi Ko？
datafox？

最後統一為：

Yu-Chi Ko (datafox)

我更新了：

ACML 演講照片
NTUAI 講師照片
專業實績紀錄這部分的思考和掙扎我會放在之後一篇文章再談。

結語：從「想要」到「實現」

很多人常說：「有一天我也想弄個網站。」

但真正的分界點，就是在你動手的那一刻。

事實上，打造這一切比想像中簡單得多。如果你有基本的 Git 使用經驗，這整套流程完全可以在「一天之內」搞定。從網域購買到 Hugo 架站，再到今天提到的 JSON-LD、Formspree、GA4 與 Cloudflare 等工具的整合，只要把基本邏輯理清，後續的維護、內容更新與優化都非常順暢，就像是在 commit 程式碼一樣自然。

藉由這些現代化的分析工具與自動化流程，打造個人品牌真的可以「一天上手」。

datafox.tw 不是終點，它是我未來在：

LLM 系統研究
AI 技術推廣與教學
技術轉譯與寫作

深耕的基地。

如果你也在想：「要不要做一個屬於自己的網站？」我的建議只有一個：

「開始，永遠比完美更重要。」

datafox 竣工後記#

一、為什麼我要自己的網站？#

二、從 0 到上線：技術建構流程#

2.1 購買網域（GoDaddy 與其他選擇）#

2.2 GitHub Pages + Hugo 建站#

三、AI 時代的 SEO 設計#

3.1 導入 JSON-LD Person Schema#

3.2 Aligned 關鍵字策略#

四、5 分鐘內完成的專業升級#

4.1 商務聯繫表單（Formspree）#

4.2 Calendly 預約整合#

五、流量與信任機制#

5.1 Google Analytics 4：數據驅動的個人品牌優化#

5.2 不蒜子計數器#

六、Cloudflare Email Routing：專業感的最小成本升級#

6.1 將網域託管到 Cloudflare#

6.2 實現 Email Rerouting (轉寄機制)#

七、身份定錨：我到底是誰？#

結語：從「想要」到「實現」#