---
# System prepended metadata

title: 使用 AI 建置你的一頁式網頁

---

# 使用 AI 建置你的一頁式網頁

我使用的 AI 工具是 https://claude.ai/new
這個 AI 工具支援簡報製作、網頁製作等等。

首先我請他幫我設計：
```
可以幫我做個漂亮的menu 嗎？

🍪 餅乾 Cookies
92 ± 3 g 紐約風軟餅乾｜每個 $90
(・)蘭姆葡萄
(・)三重巧克力
(・)紅絲絨白巧
(・)原味核桃
(dessert) 捲捲 Bites
33 ± 3 g 迷你一口捲｜每個 $50
(・)黑糖肉桂
(・)黑甜巧克力
(・)肉桂巧克力
(・)黑糖芝麻
(・)抹茶白巧克力
(・)OREO 餅乾
(・)無花果醬
```

他馬上幫我製作了一個網頁

![image](https://hackmd.io/_uploads/S16-w1Wpeg.png)

如果你對於色系、排版樣式有其他想法，可以再讓 AI 幫你微調。
如果這個版本是你喜歡的，你也可以直接點選發布， AI 會送你一個網址：
![image](https://hackmd.io/_uploads/r1MwD1Z6gx.png)

舉例來說，我上次發布了一個台灣軟體工程師職涯地圖：
https://claude.ai/public/artifacts/232a216f-1e8c-4f3d-917d-d3bb9eceb90b
大家可以看看。

![image](https://hackmd.io/_uploads/SkDxOy-peg.png)

如果你想要下載檔案後續自行微調，可以點選右上角的 copy 下載為 HTML 檔案，修改好再上傳到自己的伺服器上。

![image](https://hackmd.io/_uploads/S12uu1ZTgl.png)