diff --git a/index.html b/index.html index 6a09c3c..598ebf8 100644 --- a/index.html +++ b/index.html @@ -1,37 +1,443 @@ - - - - - - - - - - - - - \ No newline at end of file + Your Name · Frontend Dev — 個人品牌網站
+
+ +
+
+
+
+

個人品牌 - 前端工程師骨架範本

+

此為個人網站骨架(Phase 1)。未來會放置一句簡短自我介紹、職稱與行動呼籲(瀏覽作品集 / 下載履歷)。

+

之後會用 Section SDD 的 Prompt 產生正式文案與版面,再把整個 section 整段貼回取代本區塊。

+ + +
+ +
+ 在筆電前撰寫程式碼的前端開發者 +
+
+
+
+ + + +
+
+

關於我

+ +
+
+

+ 我是一位前端工程師,目前主要從事前端開發、教學與網站相關接案。 + 熟悉的技能包含:HTML、CSS、JavaScript、RWD、UI Layout、無框架前端工程。 +

+ +

+ 我的背景讓我特別重視「溝通」與「把事情講清楚」這件事。 + 我喜歡教學、也習慣把複雜內容整理成能看懂的結構與流程。 +

+ +
    +
  • 協助規劃網站結構與前端技術方向
  • +
  • 提供清楚、可維護的前端程式碼
  • +
  • 協助非工程背景者理解技術概念
  • +
+ + +
+ +
+ 工程師正在使用筆電寫程式的示意照片 +
+
+
+
+ + + + +
+
+

技能(占位)

+

此區為技能占位,未來會列出主要技術棧、工具與熟練度。請以 Section SDD 產出詳細內容後,整段貼回覆蓋在這兩個註解之間。

+ +
+ HTML5 + CSS3 + RWD + Accessibility + Performance + Design Systems +
+
+
+ + + +
+
+

作品集(占位)

+

此區為作品集占位,未來會以卡片或案例頁顯示完整專案說明與連結。請用 Section SDD 產生正式內容並整段貼回替換。

+ +
+
+

範例專案 A

+

占位描述:專案簡介、使用技術、角色與連結(例如 GitHub / Demo)。

+
+ +
+

範例專案 B

+

占位描述:專案簡介、使用技術、角色與連結(例如 GitHub / Demo)。

+
+ +
+

範例專案 C

+

占位描述:專案簡介、使用技術、角色與連結(例如 GitHub / Demo)。

+
+
+
+
+ + + +
+
+

聯絡我(占位)

+

此處為聯絡方式占位。以下提供範例連結:郵件、電話與專業社群連結。請在 Phase 2 用 Section SDD 產生更完整內容,並將新的 section 程式碼整段貼回替換這裡。

+ +
+
+ Email: + hello@example.com +
+ +
+ 電話: + +886 900 000 000 +
+ +
+ GitHub: + github.com/yourname +
+ +
+ LinkedIn: + linkedin.com/in/yourname +
+
+
+
+ + +
+ + +
\ No newline at end of file