← 回設計展示總覽WEBSITE / STARTER PLANNER

SITE BRIEF / GUIDED SETUP

從喜歡的設計開始
規劃自己的網站

先選用途與首頁的閱讀動線，再決定品牌色、頁面與導航。最後取得一份可以交給 AI 接續開發的網站規格。

這裡是規劃工具，不會直接修改正式網站、建立新 Repository 或發布。

01

網站用途與版型

先選最接近你想要的設計就好，不必一次決定所有細節。後續可以參考八款 Demo、12 款版型與構圖配方，再調整版面、增減區塊、修改導航與品牌視覺。

我想建立的是
02

品牌視覺

先選一組配色起點，再自由調整五色盤。這些是配色預設，不會改變你在步驟 01 選的整頁 Layout。

視覺風格

品牌配色（五色盤）

先從上方風格取得一組搭配，再自行調整五個角色。不是五種顏色都要大量使用，背景與文字也有自己的工作。

BRAND PALETTE PREVIEW讓內容清楚，也讓品牌有自己的樣子。

這段文字展示背景與文字色，按鈕展示主色與強調色。

主要按鈕輔助元素

正式網站仍需要檢查對比：一般文字與背景至少 4.5:1，大字至少 3:1；AI 不能直接假定所有配色都合格。

03

頁面架構與導航列

這裡會依照步驟 01 選擇的網站方向，帶入一組預設導航項目：A01–A06（知識／部落格）使用內容型預設，B01–B06（助人者／專業服務）使用服務型預設。目前同類型的六款 Layout 共用初始項目，並非每款版型都有不同選單；你可以自由新增、刪除、排序及設定第二層選單。

網站導覽

拖曳 ⠿ 調整順序；→ 縮排為子選單、← 提升層級。觸控或鍵盤可使用 ↑ ↓ 排序。所有頁面都可刪除或暫時取消勾選；有子選單的頁面刪除前會先詢問。

04

選擇組合樣板（選填）

組合樣板不是單顆按鈕，而是完成一件事的整段內容。例如「精選文章／作品」會把標題、說明、代表內容與下一步串起來，幫第一次來的讀者快速找到值得看的東西。

看「精選作品／文章」的整段示範 ↗

適合首頁：先介紹這一區，再放 2–3 篇精選文章、作品或專題，最後提供「查看更多」入口。不是填數字或憑空聲稱成果。

這一段包含：區段前言 → 精選項目列表 → 清楚的下一步

查看完整區段與所需資料 ↗

讓訪客先了解合作範圍、服務適合度與實際聯絡方式，而非只看到預約按鈕。

這一段包含：專業服務定位 → 服務適合度 → 可核實信任資訊 → 低壓下一步

查看完整區段與所需資料 ↗

頁腳會自動放在整站所有頁面的底部。只要選一種，不用選擇放哪頁；也可以選「不另外設定」，之後再調整。

選擇頁腳

FOOTER PREVIEW / 排版結構示意

YOUR PERSONAL SITE我的個人網站
網站導覽文章關於我
© 2026 我的個人網站隱私權／法律頁面未設定，正式網站不顯示假連結

展示頁腳的欄位與結構，不代表固定配色；顏色會依上方品牌主色與後續 Theme Tokens 調整。正式站仍需填入真實網址。

查看三種頁腳完整展示 ↗
05

交給 AI 接續組裝

這份 Site Brief 描述你的選擇；不代表版型已自動轉換為完整網站。