# 開発ガイドライン

> 制作現場において、担当者の交代や引き継ぎを円滑に行えるよう、ルールや方針を統一し、クオリティを維持するためのガイドラインです。

## Frontend

- [共通ルール](https://guidelines.glanz-web.jp/frontend): フロントエンド全体に共通する対応ブラウザとユーザビリティの方針、品質の基準へのリンク
- [開発環境テンプレート](https://guidelines.glanz-web.jp/frontend/environment): 本ガイドラインのコードスタイルに合わせて設定済みの、静的サイト用 Vite・Astro テンプレートと WordPress 用 wp-env テンプレート

### HTML

- [HTML の基本ルール](https://guidelines.glanz-web.jp/frontend/html/basics): スタイル・処理の分離、正しい記述と検証など、HTML 全体に共通するルール
- [HTML のコードスタイル](https://guidelines.glanz-web.jp/frontend/html/code-style): テンプレートごとのフォーマッター・リンターと、HTML のインデント・コメントのルール
- [要素の使い分け](https://guidelines.glanz-web.jp/frontend/html/semantics): 言語指定、ランドマーク、ボタンとリンク、フォーム、ダイアログのマークアップルール
- [見出しタグ](https://guidelines.glanz-web.jp/frontend/html/heading): 見出しの階層構造、h1 の使い方、装飾ラベルの扱い、SEO を意識した見出しの書き方
- [パスとリンク](https://guidelines.glanz-web.jp/frontend/html/link): ルート相対パスの使用、ページ内リンク、外部リンクの設定ルール

### CSS

- [CSS の基本ルール](https://guidelines.glanz-web.jp/frontend/css/basics): クラスセレクタの優先、インラインスタイルの回避など、CSS 全体に共通するルール
- [CSS のコードスタイル](https://guidelines.glanz-web.jp/frontend/css/code-style): テンプレートごとの CSS のフォーマッター・リンター
- [クラス命名規則（BEM）](https://guidelines.glanz-web.jp/frontend/css/architecture): BEM 記法によるクラス命名規則、状態の表し方、セレクタ・属性の使い方
- [プロパティの記述順](https://guidelines.glanz-web.jp/frontend/css/order): プロパティの記述順と、Biome・Stylelint による自動整列の設定
- [カスタムプロパティ](https://guidelines.glanz-web.jp/frontend/css/variables): カスタムプロパティの定義・命名・スコープ・テーマ切り替え
- [記述ルール](https://guidelines.glanz-web.jp/frontend/css/rules): 数値・font-size・font-weight の指定方法と、transition・z-index の使用ルール
- [レスポンシブ](https://guidelines.glanz-web.jp/frontend/css/responsive): ブレークポイントの管理、メディアクエリの範囲構文、コンテナクエリ、ネストの深さのルール
- [Web フォント](https://guidelines.glanz-web.jp/frontend/css/fonts): 利用できる Web フォント、Adobe Fonts のライセンス、表示速度に配慮した読み込み方法
- [Tailwind CSS](https://guidelines.glanz-web.jp/frontend/css/tailwind): Tailwind CSS v4 の導入方法、テーマ変数、@apply、BEM との併用方針

### JavaScript

- [JavaScript の基本ルール](https://guidelines.glanz-web.jp/frontend/js/basics): モダンな構文、インラインスクリプトの回避、エラーハンドリングなど、JavaScript 全体に共通するルール
- [JavaScript のコードスタイル](https://guidelines.glanz-web.jp/frontend/js/code-style): 静的サイトは Biome、WordPress は ESLint と Prettier による自動フォーマットと静的解析
- [JavaScript の命名規則](https://guidelines.glanz-web.jp/frontend/js/naming): 変数・関数・クラス・ファイルの命名規則と、JavaScript から要素を参照する方法
- [スクリプトの読み込み](https://guidelines.glanz-web.jp/frontend/js/loading): type="module" と defer 属性によるスクリプトの読み込み方法と、インラインスクリプトを使ってよい例外
- [モジュール分割](https://guidelines.glanz-web.jp/frontend/js/module-structure): ES モジュールの分割方針、エントリーポイントでの初期化、実行タイミングの制御
- [エラーハンドリング](https://guidelines.glanz-web.jp/frontend/js/error-handling): try...catch と非同期処理のエラーハンドリング、失敗時の表示
- [JavaScript のパフォーマンス最適化](https://guidelines.glanz-web.jp/frontend/js/performance): 高頻度で実行される処理の間引き、Observer API と CSS による代替、長いタスクの分割
- [ライブラリの利用](https://guidelines.glanz-web.jp/frontend/js/libraries): 外部ライブラリの選定基準、利用できるライブラリ、導入方法、更新と脆弱性の管理

### 画像・メディア

- [画像フォーマット](https://guidelines.glanz-web.jp/frontend/media/formats): WebP・AVIF の選定基準、複数フォーマット対応、解像度とファイル容量の目安、レスポンシブ画像の実装
- [画像の読み込み最適化](https://guidelines.glanz-web.jp/frontend/media/optimization): レイアウトシフト（CLS）対策、遅延読み込み、LCP 画像の優先読み込み、画像の圧縮、動画の読み込み
- [画像・メディアのアクセシビリティ](https://guidelines.glanz-web.jp/frontend/media/accessibility): alt 属性、figure 要素、アイコンボタン、色とコントラスト、アニメーションと動画、インライン SVG のアクセシビリティ対応
- [画像ファイルの命名規則](https://guidelines.glanz-web.jp/frontend/media/naming): 接頭辞ルール、ディレクトリ構成、ファイル名の構成、レスポンシブ・連番対応の命名規則

### 品質

- [アクセシビリティ](https://guidelines.glanz-web.jp/frontend/quality/accessibility): WCAG 2.2 レベル AA を目安とした基準、ページ全体で守るルール、自動チェックと手動での確認方法
- [パフォーマンス](https://guidelines.glanz-web.jp/frontend/quality/performance): Core Web Vitals（LCP・INP・CLS）の目標値、開発中と公開後の計測方法、指標ごとの対策、キャッシュ制御
- [セキュリティ](https://guidelines.glanz-web.jp/frontend/quality/security): HTTPS とセキュリティヘッダー、CSP、公開ディレクトリに置かないファイル、XSS を防ぐ DOM 操作、フォームの入力検証とスパム対策
- [SEO](https://guidelines.glanz-web.jp/frontend/quality/seo): title・meta description・OGP・canonical などのメタ情報、構造化データ、sitemap.xml と robots.txt、リニューアル時のリダイレクト、Search Console

## Git

- [Git ガイドライン](https://guidelines.glanz-web.jp/git): リポジトリ、ブランチ、コミットメッセージ、Pull Request、権限とセキュリティに関する Git / GitHub の運用ルール
- [リポジトリ運用](https://guidelines.glanz-web.jp/git/repository): リポジトリの所有者と責任範囲、命名規則、可視性、README の整備
- [ブランチ戦略](https://guidelines.glanz-web.jp/git/branch): ブランチ構成、運用フロー、命名規則、保護ルールの設定
- [コミットメッセージ](https://guidelines.glanz-web.jp/git/message): Conventional Commits に準拠したコミットメッセージの書き方
- [Pull Request 運用](https://guidelines.glanz-web.jp/git/pull-request): PR の作成タイミング、タイトルと説明文の書き方、サイズ、レビュー、マージ戦略
- [GitHub 権限・セキュリティ](https://guidelines.glanz-web.jp/git/security): リポジトリの権限、アカウントの保護、Secrets・環境変数の管理、機密情報の漏洩時の対応

## Deploy & Release

- [Deploy & Release](https://guidelines.glanz-web.jp/deploy-release): CI、デプロイ、リリースとロールバックの運用ルール
- [CI](https://guidelines.glanz-web.jp/deploy-release/ci): Lint・ビルドなどのチェックを PR ごとに自動で実行する CI（継続的インテグレーション）の運用ルール
- [デプロイ](https://guidelines.glanz-web.jp/deploy-release/deploy): GitHub Actions などの CI/CD を使い、ブランチへのマージをきっかけに自動でデプロイする運用ルール
- [リリースとロールバック](https://guidelines.glanz-web.jp/deploy-release/release): 本番環境へのリリース手順、タグ運用、リリースノート、ロールバックの方法

## AI

- [利用ツールと契約](https://guidelines.glanz-web.jp/ai/tools): 業務で使用できる AI コーディングツール、契約プランと学習設定、クライアント案件での利用条件
- [機密情報の保護](https://guidelines.glanz-web.jp/ai/sensitive-data): AI コーディングツールの利用時に、入力・保管・コミットの 3 層で機密情報の漏洩を防ぐ多層防御
- [AI 生成物のレビューと責任](https://guidelines.glanz-web.jp/ai/review): AI が生成したコードの責任の所在と、コミット前・レビュー時に確認すること

## WordPress

- [テーマの構成](https://guidelines.glanz-web.jp/wordpress/theme): wp-env-starter のディレクトリ構成を前提にした、テーマのファイル配置、functions/ の分け方、テンプレートの分割、アセットの読み込み、ブロックテーマの扱い
- [PHP のコードスタイル](https://guidelines.glanz-web.jp/wordpress/code-style): Prettier による PHP の自動整形と、WordPress の慣習に合わせた命名、テンプレートでの PHP の書き方
- [WordPress のセキュリティ](https://guidelines.glanz-web.jp/wordpress/security): テーマのコードで守るセキュリティのルール。出力時のエスケープ、入力のサニタイズ、nonce と権限の確認、SQL のプレースホルダー
- [ブロックエディター](https://guidelines.glanz-web.jp/wordpress/blocks): theme.json で編集者が使える色や文字サイズを制限し、カスタムブロックとパターンで編集する部品を用意するルール
- [コンテンツ設計](https://guidelines.glanz-web.jp/wordpress/content-model): カスタム投稿タイプ、タクソノミー、カスタムフィールドの設計と登録方法。ACF / SCF とコードでの登録の使い分け
- [プラグイン](https://guidelines.glanz-web.jp/wordpress/plugins): 標準で入れるプラグインの種類と、プラグインを採用するときの基準
- [運用と保守](https://guidelines.glanz-web.jp/wordpress/operations): WordPress サイトの本番環境の設定、管理画面のアカウント、本体とプラグインのアップデート、バックアップ、データベースの移行

## Agent resources

- [llms-full.txt](https://guidelines.glanz-web.jp/llms-full.txt): The full Markdown of every page in one file.
- [Page Markdown](https://guidelines.glanz-web.jp/index.md): Append `.md` to any page URL to fetch that page as raw Markdown.
- [JSON API](https://guidelines.glanz-web.jp/api/docs/pages.json): Page index of the JSON docs API; each entry links the page's JSON and Markdown forms. Described by the OpenAPI document at https://guidelines.glanz-web.jp/openapi.json.
- [API catalog](https://guidelines.glanz-web.jp/.well-known/api-catalog): RFC 9727 linkset of the APIs documented here.
- [AI catalog](https://guidelines.glanz-web.jp/.well-known/ai-catalog.json): ARD manifest of the agent-facing resources on this site (MCP server, skills, APIs).
- [agent-readability.json](https://guidelines.glanz-web.jp/agent-readability.json): Manifest of every agent-facing artifact on this site.