静的HTML・自社CMS・Drupalを1つのサイトで併用する設計｜3つの仕組みをどうつなぐか

当社のWebサイトは、すべてを1つのCMSで管理しているわけではありません。

会社案内やサービス紹介は静的HTML、新着情報は自社開発のCMS、ブログはDrupalというように、用途ごとに異なる仕組みを使っています。

一見すると複雑そうに見えますが、訪問者から見れば普通の1つのWebサイトです。

では、なぜ1つのCMSに統一しなかったのか。

この記事では、実際に運用している構成を例に、なぜ情報の種類ごとに仕組みを分けたのか、そしてどうやって1つのサイトとしてつないでいるのかを紹介します。

1つのサイトに3つの仕組みがある

まず、当社サイトの構成を整理します。

それぞれ別の仕組みで管理していますが、最終的には同じドメインのWebサイトとして公開しています。

重要なのは、「1つのサイトだから、1つのシステムで管理しなければならない」わけではないということです。

なぜWordPressなど1つのCMSに統一しないのか

WordPressのようなCMSを1つ導入すれば、会社案内からお知らせ、ブログまでまとめて管理できます。

実際、多くのWebサイトではこの構成が採用されています。

それ自体は悪い方法ではありません。

ただ、当社の場合は情報ごとに求められる性質が違うため、あえて分けています。

会社案内は「頻繁に更新しない」ことが前提

会社概要やサービス紹介などは、毎日のように変更する情報ではありません。

こうしたページでは、管理画面から毎回データベースを読み込んでページを生成することよりも、シンプルにHTMLとして配信できることにメリットがあります。

そこで、当社ではこの部分を静的HTMLとして管理しています。

新着情報は「すぐ公開できること」が重要

一方、新着情報は更新頻度が高くなります。

担当者が管理画面から入力し、必要な情報をすぐ公開できることが重要です。

ただし、ブログほど複雑な編集機能は必要ありません。

そこで当社では、新着情報に特化した自社CMSを使用しています。

このCMSにはHTML生成機能もあり、入力した情報から記事ページや一覧ページなどを自動生成できます。

ブログは「長文を編集しやすいこと」が重要

技術記事やWeb制作の記録は、数千文字になることがあります。

見出し、表、コード、画像、リンクなど、扱う要素も増えていきます。

こうした用途では、記事を編集・管理するための本格的なCMSが便利です。

当社では、この領域にDrupalを使っています。

つまり、次のような考え方です。

• 頻繁に変更しない情報 → 静的HTML
• 短い情報をすぐ公開したい → 自社CMS
• 長文記事を継続的に書く → Drupal

すべてを1つにまとめるのではなく、それぞれに合った仕組みを使う。

これが当社のサイト設計です。

どうやって3つの仕組みを1枚のページにつないでいるのか

ここが、この構成で特に重要な部分です。

それぞれが独立して動いているだけでは、1つのWebサイトとして成立しません。

当社では、共通パーツとHTML断片を組み合わせて接続しています。

SSIで共通パーツを管理する

SSI（Server Side Includes）は、WebサーバーがHTMLを返す際に、別ファイルの内容を差し込む仕組みです。

例えば、HTMLに次のような記述をしておきます。

<!--#include virtual="/included/footer.html" -->

Webサーバー側で処理されると、この部分に指定したファイルの内容が差し込まれます。

そのため、共通のフッターを変更するときは、基本的に1つのファイルを変更すれば済みます。

ヘッダーやフッターなど、複数ページで共通して使う部分をまとめて管理するために利用しています。

Drupalの記事一覧をHTML断片として出力する

ブログの記事一覧については、Drupalが記事を保存したタイミングなどで、トップページに必要なHTML断片を生成します。

流れは次のようになります。

Drupalで記事を保存
↓
最新記事のHTML断片を生成
↓
静的サイト側から読み込む
↓
トップページに表示 

ここで重要なのは、トップページを表示するたびにDrupalへ問い合わせているわけではないことです。

すでに生成されたHTML断片を利用するため、Drupal側で記事を管理していても、トップページの表示時に毎回Drupalの処理を実行する必要がありません。

新着情報も同じ考え方

新着情報についても、記事を保存したときにHTMLを生成します。

詳細ページや一覧ページだけでなく、トップページで利用する情報も更新します。

つまり、管理や生成を行う場所と、訪問者に配信する場所を分けています。

この構成のメリット

表示時の処理をシンプルにできる

トップページの主要なコンテンツは、あらかじめHTMLとして生成されています。

訪問者がアクセスするたびに、複数のデータベースへ接続してページ全体を組み立てる構成ではありません。

そのため、表示時のサーバー側処理をシンプルにできます。

Drupalが一時的に停止しても、公開済みのページを維持できる

例えばDrupalに障害が発生したとしても、すでに生成済みのHTML断片が残っていれば、トップページ自体はその内容を利用して表示できます。

もちろん、Drupalが停止している間は新しいブログ記事の反映などはできません。

しかし、ブログのシステム障害が、そのままサイト全体の表示停止につながる構成ではありません。

システムを入れ替えやすい

ブログ部分が「HTML断片を提供する」という役割を守っていれば、将来的にDrupalを別のCMSへ変更することもできます。

静的サイト側は、そのHTML断片を利用するだけだからです。

システム同士の依存関係を必要以上に強くしないことも、この構成のメリットです。

もちろん弱点もある

この構成は万能ではありません。

むしろ、システムを分けたことで新しい管理上の問題も発生します。

共通パーツの管理場所が分かれることがある

SSIは静的ファイルを中心とした構成では便利ですが、CMS側のテンプレートまで同じ仕組みで管理できるとは限りません。

そのため、CMS側にヘッダーやフッターを別途持たせる構成になることがあります。

ここで問題になるのが、同じ内容を複数箇所で管理することです。

実際に当社でも、静的サイト側とブログ側で共通パーツに差が生じました。

CSSのバージョン、SNSリンク、コピーライト、ボタンの実装など、複数の取り残しが発生しました。

この問題については、別の記事で詳しく紹介しています。

静的サイトとCMSを併用すると起きる「共通パーツのズレ」｜二重管理をやめる方法

生成物と生成元がずれることがある

HTMLを自動生成する仕組みでは、生成されたHTMLを直接編集してはいけないという原則があります。

生成物を手で修正しても、次に再生成したときに消えてしまうからです。

当社でも、生成されたトップページにだけ存在し、テンプレートには存在しない記述がありました。

再生成した結果、その記述が消えてしまいました。

この経験からも、修正すべき場所は生成されたHTMLではなく、生成元のテンプレートや設定だと考えています。

構成を理解している人が必要になる

3つの仕組みを組み合わせているため、「この部分を変更すると、どこに影響するのか」を理解しておく必要があります。

担当者が変わる場合には、単にログイン情報を引き継ぐだけでは不十分です。

サイト全体の構成図と、それぞれの役割を引き継ぐことが重要になります。

すべてのサイトで分割構成にすべきなのか

もちろん、そうではありません。

システムを分ければ、その分だけ管理する仕組みも増えます。

情報量が少なく、更新頻度も低いサイトなら、静的HTMLだけで十分かもしれません。

ブログもお知らせも頻繁に更新するなら、1つのCMSにまとめた方が管理しやすい場合もあります。

大切なのは、「WordPressを使うか」「Drupalを使うか」「静的HTMLにするか」というツール選びから始めないことです。

先に「その情報は、誰が、どのくらいの頻度で、どのように更新するのか」を考えます。

その答えに合わせて、必要な仕組みを選びます。

Webサイトは「1つのシステム」である必要はない

Webサイトというと、「WordPressを入れて全部そこで管理する」という構成を思い浮かべる方も多いと思います。

しかし、Webサイトは必ずしも1つのCMSだけで作る必要はありません。

静的HTML、自社CMS、Drupalなど、役割の違う仕組みを組み合わせても、訪問者から見れば1つのWebサイトとして成立します。

重要なのは、システムを増やすことではありません。

「何を、どの仕組みで管理するのが最も合理的なのか」を設計することです。

まとめ

当社のトップページは、静的HTML・自社開発CMS・Drupalという3つの仕組みを組み合わせて構成しています。

• 会社案内などは静的HTMLで管理する
• 新着情報は自社CMSで素早く更新する
• 長文のブログはDrupalで管理する
• SSIやHTML断片を利用して、訪問者には1つのWebサイトとして見せる
• システムを分けることで、表示時の処理や依存関係を整理できる
• 一方で、共通パーツの二重管理や構成の引き継ぎには注意が必要

Webサイトを作るなら、とりあえずWordPressという考え方もあります。

しかし、重要なのはCMSを入れることではありません。

更新する情報の性質に合わせて、必要な仕組みだけを組み合わせること。

それが、当社が考えるWebサイト設計です。

これからWebサイトを作る方や、既存サイトの構成を見直したい方は、「何のCMSを使うか」だけではなく、「どの情報を、誰が、どの頻度で更新するのか」から考えてみることをおすすめします。