web
レイヤー1 — ドメイン基盤 (v2.0)
フレームワークに関係なく、すべてのウェブプロジェクトに適用されるユニバーサルなウェブ開発原則。 React、Vue、Svelte、バニラJS — これらの原則はどのフレームワークでも通用します。
哲学
このパックは、エージェントが個々には正しく理解しているものの、実際の開発では見落としがちな、ウェブプラットフォームの基礎知識をエンコードしています。エージェントはARIAラベルが何かを知っています。しかし、スクリーンリーダー向けのエラー通知がないフォームを生成してしまいます。エージェントはCore Web Vitalsを知っています。それでも寸法指定なしで2MBのヒーロー画像をレンダリングします。
問題は「知識」ではなく、「一貫した適用」です。
含まれる内容
| タイプ | 数 | カバレッジ |
|---|---|---|
| パターン | 7 | アクセシビリティ（WCAG 2.2）、パフォーマンス（Core Web Vitals）、セキュリティヘッダー（OWASP）、SEO、レスポンシブデザイン、エラーUX、ローディング状態 |
| アンチパターン | 6 | Divスープ、代替テキスト欠落、レイアウトシフト、保護されていないフォーム、クライアントのみのクリティカルパス、セキュリティヘッダーなし |
| 憲法 | 7 | 原則 |
基盤とする資料：W3C WCAG 2.2（2023年10月）、Google Core Web Vitals（2025年）、 OWASP Secure Headers Project、OWASP CSP Cheat Sheet、MDN Web Docs、 Web Almanac 2025、European Accessibility Act（2025年6月）。
このパックがカバーしないこと
- フレームワーク固有のパターン（
react、nextjsなどを参照） - CSSメソッドの意見（BEM vs ユーティリティファースト vs CSS-in-JS）
- ビルドツールの設定（Webpack、Vite、Turbopack）
- バックエンド/APIパターン（
apiまたはbaasを参照）