web
第 1 層 — 領域基礎 (v2.0)
適用於每個網路專案的通用網路開發原則,無論使用何種框架。 React、Vue、Svelte、純 JavaScript — 這些原則都適用。
理念
此套件編碼了代理程式在獨立處理時常能正確應用,但在實務中卻容易遺漏的基礎網路平台知識。代理程式知道什麼是 ARIA 標籤,但卻產出一個對螢幕閱讀器沒有錯誤提示的表單。代理程式知道 Core Web Vitals,但仍渲染出一張 2MB 且未設定尺寸的英雄圖片。
差距不在於知識 — 而在於一致性的應用。
包含內容
| 類型 | 數量 | 涵蓋範圍 |
|---|---|---|
| 模式 | 7 | 無障礙性 (WCAG 2.2)、效能 (Core Web Vitals)、安全標頭 (OWASP)、SEO、響應式設計、錯誤使用者體驗、載入狀態 |
| 反模式 | 6 | 過多的 div、缺少替代文字、版面位移、未保護的表單、客戶端專屬的關鍵路徑、缺少安全標頭 |
| 憲法 | 7 | 原則 |
基於:W3C WCAG 2.2 (2023 年 10 月)、Google Core Web Vitals (2025)、 OWASP 安全標頭專案、OWASP CSP 備忘錄、MDN Web Docs、 Web Almanac 2025、歐洲無障礙法案 (2025 年 6 月)。
此套件未涵蓋項目
- 框架特定模式(請參閱
react、nextjs等) - CSS 方法論觀點(BEM 與 utility-first 與 CSS-in-JS)
- 建置工具設定(Webpack、Vite、Turbopack)
- 後端/API 模式(請參閱
api或baas)