Webサイト

ヘッドレスCMSとは?WordPressとの違いと向き不向きを解説

記事や画像を管理する箱から、APIを通じてWebサイト・スマートフォン・店頭の画面へ中身が届く様子を表したアイキャッチ
マワルくん マワルくん
こんな人におすすめ
・制作会社からヘッドレスCMSを提案され、WordPressと何が違うのか知りたい
・速い、安全と聞くが、代わりに何が増えるのかを先に知っておきたい
・自社のサイトに向いているか、移行で何を確かめるかを判断したい

サイトの作り直しを相談すると、WordPressの代わりにヘッドレスCMSを勧められることがあります。表示が速い、安全、デザインが自由といった説明を受けても、何が変わるのかは見えにくいものです。

ヘッドレスCMSは、記事や画像を管理する仕組みだけを持ち、表示はAPIの先で別に作るCMSです。ヘッドレスにするかは技術の新しさではなく、表示を作って持ち続ける体制があるかで決まります。本記事では仕組み、WordPressとの違い、増える負担、向き不向き、移行の確認点を整理します。

この記事のゴール(読了目安 約8分)

ヘッドレスCMSの仕組みとWordPressとの違いを説明でき、自社に向いているか、移行の前に何を確かめるかを判断できるようになる。

ヘッドレスCMSとは

管理と表示を切り離す

ヘッドレスCMSは、表示の部分を持たないCMSです。AWSは、コンテンツの管理と保存を表示から切り離し、任意の画面へ届ける仕組みと説明しています。頭(表示)が無いので、ヘッドレスと呼ばれます。更新担当が使う管理画面は、CMS側にそのまま残る形です。

APIで中身を渡す

記事の本文や画像は、APIという窓口を通じてデータとして渡されます。受け取った側のWebサイトやアプリが、それぞれのデザインで表示します。CMSが受け持つのは中身の管理までで、見た目は表示側の仕事です。たとえば同じお知らせを、Webサイトでは一覧の中に、アプリでは通知の文面として出し分けられます。

管理と表示が1つの箱に入った一体型のCMSと、管理だけを持ちAPIを通じて複数の表示へ中身を渡すヘッドレスCMSを左右に並べた図

WordPressとの違い

WordPressのような従来型は、管理画面と表示を1つの仕組みで持つ一体型です。違いを並べると次のとおりです。

項目 一体型(WordPressなど) ヘッドレスCMS
表示を作るもの テーマとプラグイン 別に開発する表示側の仕組み
更新画面 記事と見た目を同じ画面で扱う 決められた入力欄に中身を入れる
プレビュー 標準で付いている 表示側と合わせて作る
保守の対象 本体・テーマ・プラグイン CMSと表示側の2つ
出し先 主にそのWebサイト サイト・アプリなど複数

一体型は「すぐ使える」、ヘッドレスは「組み合わせて作る」と捉えると違いが見えやすくなります。一体型でもテーマを自作すれば自由度は上がりますが、表示の仕組みはCMSの中に残ります。

WordPressもヘッドレスにできる

WordPressは、記事などのデータをJSONで受け渡すREST APIを標準で備えています。GraphQLで取り出すWPGraphQLも、公式ディレクトリで「公式の位置づけのプラグイン」へ移行中と案内されています。

そのため、管理画面はWordPressのまま、表示だけを別に作る構成も取れます。更新担当が慣れた画面を残したまま、表示側だけ作り替えられるのが、この形の利点です。

ただし、表示に関わるプラグインの多くは、別に作った表示側では働きません。フォームや目次、検索向けの設定などは、表示側で作り直すことになります。

ヘッドレスCMSの利点

利点としてよく挙がるのは次の3つです。

  • 出し先を増やせる: 同じ記事をWebサイト、アプリ、店頭の画面などに出し分けられる
  • 表示の技術を選べる: CMSの制約を受けずに、表示側の作り方を決められる。CMSを替えても表示側は残せる
  • 公開サイトと管理画面を分けられる: 管理の仕組みを公開サイトと別の場所に置け、公開サイト側から管理画面を狙われにくい

速さや安全性は、表示側の作り方と運用で決まります。ヘッドレスにしただけで速く安全になるわけではありません。利点が出るのは、出し先が複数あるか、表示側を自社で作り込みたい場合です。

見落としやすい負担

一方で、一体型なら最初から付いていたものを自分で用意する負担があります。提案書では利点が先に並びやすいので、次の4つを確かめておきます。

  • 表示の開発費: テーマを選ぶ代わりに、表示側を一から作る
  • 確認の手間: 公開前の見た目を確かめるプレビューを、表示側と合わせて作る
  • 保守が2つになる: CMSと表示側の両方に、更新と不具合の対応が要る
  • 編集の自由度が下がる: 入力欄に無い要素は、開発者に頼まないと足せない

費用は作るときより、作った後に増えると見ておくのが安全です。

出し先を増やせる・表示の技術を選べるといった利点と、表示の開発費・プレビュー・2つの保守・編集の自由度の低下という負担を天秤に載せた図

表示側で作るもの

ヘッドレスCMSを選ぶと、表示側で次のものを作る必要があります。

  • ページの型: 記事一覧、記事ページ、お知らせなどの表示
  • プレビュー: 公開前に見た目を確かめる画面
  • サイト内検索とフォーム: 問い合わせや検索の仕組み
  • 公開の仕組み: 更新を表示側へ反映させる手順
  • 置き場所: 表示側を動かすサーバーや配信の契約

公開の仕組みには、更新のたびにページを作り直して配信する方式と、表示のたびにAPIへ取りに行く方式があります。前者は表示が速い反面、反映までに少し時間がかかることがあります。どこまでを見積もりに含めるかは、制作会社ごとにまちまちです。見積もりを比べるときは、この5つが含まれているかを確かめます。

向いている会社・向かない会社

判断の目安を並べると次のとおりです。

向いている 向かない
同じ中身をサイトとアプリなど複数に出したい 出し先はWebサイト1つだけ
表示側を保守する開発者がいる 更新も保守も担当者1人で回す
記事の型が決まっていて、数が多い ページごとに自由に組みたい
表示側を作り替える予定がある 今のテーマで困っていない

右の列に多く当てはまるなら、一体型のほうが手堅い選択です。逆に左が多くても、表示側を保守する人がいなければ、公開後に手が止まります。

移行するときの確認点

一体型から移るときは、次の4つを先に確かめます。

  • 入力欄の作り直し: 既存の記事を、新しい入力欄にどう割り当てるか
  • URLと転送: 今のURLを保つか、転送の設定を用意するか
  • 書き出し手段: 将来CMSを替えるとき、データを一括で取り出せるか
  • 練習期間: 更新担当が新しい画面に慣れる時間。旧サイトとの並行期間も含めて見込む

特に書き出し手段は見落とされがちです。クラウドのサービスは提供が終わることもあるため、契約前に書き出しの方法と形式を確かめておきます。リニューアル時に検索順位を落とさない注意点は、別記事で解説しています。

ツールは3つの型に分かれる

ヘッドレスCMSのツールは、提供の形で3つに分かれます。

  • クラウドで使うサービス: 国産のmicroCMSや、海外のContentfulなど
  • 自社で動かすオープンソース: Strapiなど。ソフトは無料でも、サーバーの管理と更新は自社側
  • WordPressのヘッドレス利用: 既存の管理画面を生かす

どの型を選ぶかは、サーバーを誰が管理するかでほぼ決まります。料金や日本語対応を含めた比較は、ツールの比較記事で詳しく扱う予定です。

【プロの視点】入力欄を決めるのが本題

ヘッドレスCMSの比較は、API の速さや対応する技術の話になりがちです。しかし導入後に影響が大きいのは、更新担当が毎日触る入力欄の設計です。ヘッドレスでは、記事にどんな欄を持たせるかを最初に決めます。この設計はコンテンツモデルと呼ばれ、後から変えると既存の記事も移し替えることになります。

この判断は、CMSの種類を問わず難しいものです。制作中のサイトで、管理画面をどこまで自由にするかを決めたことがあります。求人情報は決まった欄に文字を入れるだけにし、製品のページには既存の製品を複製して書き換えられるボタンを足しました。自由に書ける画面は扱いにくく、欄を絞りすぎると例外に対応できないからです。

一体型なら運用しながら少しずつ決められますが、ヘッドレスはこの線引きを、作る前に決めることを求めます。見るべきは機能表ではなく、自社の記事を何種類の型に分けられるかです。明日やる最初の一歩は、直近1年の更新を種類ごとに数え、型に収まらなかったページを書き出すことです。

自由に書ける画面と、決められた入力欄だけの画面を両端に置き、その間で入力欄と複製ボタンを組み合わせて折り合いをつける考え方を示した図

【waltsu視点】開発者を呼ぶ回数で選ぶ

waltsuが編集の軸にしているのは、試行回数を増やすことです。サイトでいえば、ページを足したり文言を変えたりして、反応を見る回数です。

ヘッドレスは表示の自由度が高い一方、入力欄に無い要素を足すたびに開発者の手が要ります。担当者だけで回せる変更が減ると、試す回数も減ります。新しい型のページを1つ足すのに、開発の依頼、見積もり、公開まで数週間かかれば、試せる案は限られます。CMSは、更新担当が開発者を呼ばずにできる範囲の広さで選ぶのが、この局面での基準です。更新する人を要件決めに入れる進め方は、別記事で解説しています。

明日やる最初の一歩は、過去3か月の更新作業を書き出し、開発者に頼んだ回数を数えることです。回数が多ければ型の設計から見直し、少なければ今のCMSで試す回数を増やすほうが先です。

更新担当だけで回せる変更が多いほど試す回数が増え、開発者への依頼が多いほど試す回数が減ることを示した図

よくある質問

ヘッドレスCMSは表示が速い?

速くしやすい構成ですが、速さは表示側の作り方で決まります。CMSを替えるだけでは速くならず、画像の扱いや配信の設定も関わります。

WordPressより安全?

管理の仕組みを公開サイトから離せる点は有利です。ただし表示側の更新と、APIの鍵の管理が新たに要ります。

小さな会社でも使える?

無料プランのあるサービスもあり、使えます。ただし表示側を作り、保守する人を確保できるかが先です。制作会社に任せるなら、公開後の保守の範囲まで契約で決めておきます。

SEOに不利にならない?

表示側で見出しやメタ情報を正しく出せば不利にはなりません。一体型でプラグインに任せていた設定は、表示側で作り込むことになります。

WordPressから乗り換えるべき?

出し先が1つで更新担当が少ないなら、急ぐ理由は薄いです。表示だけ替えたいなら、WordPressのヘッドレス利用も選べます。まずは何に困っているかを書き出してから決めます。

この記事の要点

・ヘッドレスCMSは中身の管理だけを持ち、表示はAPIの先で別に作る
・WordPressもREST APIで、管理画面を残したままヘッドレスにできる
・表示の開発費と、CMSと表示側の2つの保守が増える
・入力欄の設計と、担当者だけで回せる変更の範囲で判断する

まとめ

ヘッドレスCMSは、中身の管理と表示を切り離し、APIで渡す仕組みです。出し先を増やせる利点がある一方、表示側の開発と2つの保守が加わり、入力欄に無い変更には開発者が要ります。

自社に向くかは、出し先の数、保守の体制、更新担当だけで回せる範囲で決まります。WordPressのヘッドレス利用も、中間の選択肢の1つです。CMSの選び方や入力欄の設計に迷う場面が出てきたら、waltsuが更新の現場に合ったサイトづくりをご支援します。

集客・採用のお悩みは
今すぐプロに相談

60分無料相談はこちら
SHARE

この記事を書いた人

藤井 俊輔

代表取締役

藤井 俊輔/ フジイ シュンスケ

ベンチャー企業の外部CMOや水族館のマーケティング担当などに従事。オンライン/オフライン問わず集客を中心としたマーケティング施策に強み。

システム・アプリ開発Web広告運用Web集客全般
ブログ一覧へ戻る

集客・採用のお悩みは
今すぐプロに相談

60分無料相談 今すぐプロに相談
資料ダウンロード