🔗 本章は「Vol.8.9〜：Struts2 タグライブラリ応用編（実務／初級応用）」シリーズです。

🧭 はじめに

本記事では、Struts2アプリケーションにおいて 共通レイアウト（ヘッダー・フッター・メニュー等）を再利用できる構造 を実現するための方針と、実装例を解説します。

複数画面に共通する部品を適切に分離・再利用することで、

コードの重複削減
デザインの一貫性維持
メンテナンス効率の向上

が可能になります。

📌 本記事の対象内容

項目	説明
`common/header.jsp`	ロゴやナビゲーションなどの共通ヘッダー
`common/footer.jsp`	フッター・著作権表示など
`common/menu.jsp`	ログイン後ユーザーメニュー
`<%@ include %>`	静的インクルードによる共通化
`<s:include>`	Struts2タグによる動的インクルードとの違い

🧱 ディレクトリ構成案

/WebContent/
├── view/
│ ├── common/
│ │ ├── header.jsp
│ │ ├── footer.jsp
│ │ └── menu.jsp
│ ├── BulletinboardManagementScreen.jsp
│ ├── UserManagementScreen.jsp
│ └── ...

🧩 `header.jsp` の例（共通ヘッダー）

<!-- /view/common/header.jsp -->
<div class="header">
    <h1>My Bulletin Board</h1>
    <hr/>
</div>

🧩 `footer.jsp` の例（共通フッター）

<!-- /view/common/footer.jsp -->
<hr/>
<div class="footer">
    <small>&copy; 2025 My Company</small>
</div>

🧩 `menu.jsp` の例（ログイン後メニュー）

<!-- /view/common/menu.jsp -->
<div class="menu">
    <ul>
        <li><a href="userPortal.action">ポータル</a></li>
        <li><a href="moveUserManagement.action">ユーザー管理</a></li>
        <li><a href="moveBulletinboardManagement.action">掲示板管理</a></li>
        <li><a href="logout.action">ログアウト</a></li>
    </ul>
</div>

💡 JSP内での共通部品読み込み

以下のように各画面で共通部品を読み込むことで、再利用性を高められます。

<%@ include file="common/header.jsp" %>
<%@ include file="common/menu.jsp" %>

<h2>掲示板管理画面</h2>
<!-- 各画面固有の内容 -->

<%@ include file="common/footer.jsp" %>

❓ `<%@ include %>` と `<s:include>` の違い

比較項目	`<%@ include %>`	`<s:include>`
タイプ	静的インクルード	動的インクルード（Struts2タグ）
読み込み時点	コンパイル時に結合	実行時に読み込み
利用場面	基本的な共通部品	条件付き切替などが必要な時

📎 CSS・JSの共通読み込みも一括管理

例えば header.jsp に共通スタイルやスクリプトを追加すれば、全画面に適用できます。

<link rel="stylesheet" href="css/style.css" />
<script src="js/common.js"></script>

📘 まとめ

ポイント	内容
✅ 共通レイアウトをファイル分離	`header.jsp` や `footer.jsp` 等に共通化
✅ 再利用で修正コスト削減	デザイン変更も一括対応可能
✅ JSP標準構文で簡単導入	`<%@ include %>` で画面構成を効率化

📚 各記事リンクとテーマ概要

Vol	タイトル	内容のポイント
📘 Vol.8.9	UIを条件で自在に制御！〜 `<s:if>` / `<s:else>` / OGNL活用〜	状態や権限による動的出し分け、見やすい条件分岐
📗 Vol.8.10	タグの自作入門〜カスタムJSPタグライブラリ基礎〜	再利用可能な部品化でUI開発の効率を劇的改善
📗 Vol.8.11	見た目を整えろ！〜タグ構造のパターン化Tips 〜	タグの入れ子・定型化でスタイリッシュなJSPに
📗 Vol.8.12	共通レイアウト設計術〜 `<%@ include %>` 活用と部品化〜	ヘッダー・メニュー・フッターの共通化と構造整理術