作品案例
NoCodeIsOK 官網
角色
NoCodeIsOK 自有品牌官網，也是給未來客戶看的「成品 reference」。 訪客打開時，正在體驗成品本身——這比任何作品集圖更有說服力。
做了什麼
- 8 個主要靜態頁面（首頁、關於、服務、作品集、部落格、聯絡、隱私權、服務條款）
- 動態 blog 與 works collection（純 Markdown，客戶可自主新增）
- Build-time 自動生成 Open Graph 圖（無需手工製作每篇文章的預覽圖）
- 內嵌 Tally 諮詢表單，無 cookie 流量分析
- 完整品牌系統：Noto Serif TC + Fraunces + JetBrains Mono、深墨綠 + 深琥珀色票
用多久
從 spec 寫定到上線，約 1 週：
- 規格與設計系統建立：1 天
- 共用元件與內容架構：1 天
- 各頁面實作：2 天
- 內測與調校：1 天
- SEO / Lighthouse / a11y 驗收與部署：1 天
結果
- Lighthouse 四項分數 ≥ 95（Performance / Accessibility / Best Practices / SEO）
- 首頁 LCP < 1.5 秒，總傳輸 < 500KB
- 所有頁面 320–1440px 寬度區間完整響應式
- 客戶（也就是創辦人本人）可用 Claude Code on the web 全自主維護
想要一個這樣的網站？
我們可以幫你做。和 NoCodeIsOK 自家網站不同的地方在於：你的網站會反映你的品牌調性、 你的內容、你的客群——但「原始碼是你的、不收維護費、用 AI 自主維護」這三件事不變。