非エンジニアも知っておくべきCMS新時代の注目キーワード ゼロからわかる 静的サイトジェネレーター

更新性のあるWebサイトを運用する手法の一つとして、徐々に注目を集めているのが「静的サイトジェネレーター」です。ここでは静的サイトジェネレーターの仕組みやメリット、デメリットを、非エンジニア向けにわかりやすく解説します。

既存のWebサイトやCMSとの違い

Q1　そもそも静的サイトとは？ 動的サイトと何が違う？

静的サイトジェネレーターの正体を探る前に、まずは「静的なサイトとは何か」についてお伝えしましょう。

静的なサイトとは、WebサーバにHTMLやCSSなどが設置され、訪問者が直接その内容を表示するタイプのWebサイトを指します。静的サイトと対照的な存在が、「動的サイト」と呼ばれるものです。これは、訪問者がアクセスするたびに、データベースから情報を読み出してページを生成します。

静的サイトと動的サイトの大きな違いは、内容が固定的かどうかです。静的サイトは、いつ誰が見ても同じ内容ですが、動的サイトは、訪問者の属性や行動履歴によって変わることがあります。ECサイトをイメージするとわかりやすいでしょう。

静的サイトと動的サイトの違い

Q2　静的サイトジェネレーターはこれまでのCMSと何が違う？

CMSも静的サイトジェネレーターも、更新性のあるWebサイトの運用手段ですが、記事の管理方法が大きく違います。

CMSは、基本的にはサーバにコンテンツを管理するプログラムがあります。プログラム上で作成したコンテンツはデータベースで管理され、そこからWebサイトに出力されます。

一方、静的サイトジェネレーターにコンテンツを管理する機能はありません。テキストファイルを読み込ませると、静的なWebページを生成します。もっともシンプルな運用方法の場合、静的サイトジェネレーターはサイト運営者のローカル環境にインストールされていて、生成されたHTMLをWebサーバにアップロードすることでページが公開されます。

CMSと静的サイトジェネレーターの違い

Q3　静的サイトジェネレーターのメリットって？ デメリットはある？

静的サイトジェネレーターを使った記事作成は、大まかにいうと右の図のような流れになります。

基本的に、静的サイトジェネレーターはコマンドラインで操作します。一般的なPC用アプリのようなGUI（グラフィカル・ユーザーインターフェイス）がないためハードルは高めです。Webページが生成された後は、FTPソフトなどを使ってWebサーバに設置します。記事内に画像がある場合は、画像も含めてアップロードするか、あるいは画像ホスティングサービスを活用し、画像URLをHTMLに記述する方法も考えられます。

また、自動化ツールを使うことで、一連の流れを自動化することも可能です。

静的サイトジェネレーターのメリット、デメリット

静的サイトジェネレーターの仕組み

Q4　静的サイトジェネレーターではどうやって記事を更新するの？

静的サイトジェネレーターを使った記事作成は、大まかにいうと右の図のような流れになります。

基本的に、静的サイトジェネレーターはコマンドラインで操作します。一般的なPC用アプリのようなGUI（グラフィカル・ユーザーインターフェイス）がないためハードルは高めです。Webページが生成された後は、FTPソフトなどを使ってWebサーバに設置します。記事内に画像がある場合は、画像も含めてアップロードするか、あるいは画像ホスティングサービスを活用し、画像URLをHTMLに記述する方法も考えられます。

また、自動化ツールを使うことで、一連の流れを自動化することも可能です。

静的サイトジェネレーターでのWebサイト更新の流れ

Q5　静的サイトジェネレーターにはいろいろな種類があるって本当？

静的サイトジェネレーターは、さまざまな種類のものがありますが、その最大の違いは使用している言語です。例えば、「Hugo（ヒューゴ）」という静的サイトジェネレーターは、Googleが開発したGo言語で書かれています。使用している言語によって処理速度が違ったり、周辺ツールのエコシステムが異なります。また、自分が知っている言語であれば、自分自身でツールをメンテナンス・カスタマイズできるようになります。

さらに、処理速度やプラグインの多さなども検討材料になるほか、ツールの人気や将来性も気にしておくといいでしょう。人気がなくなったツールは誰もメンテナンスしてくれず、やがて動かなくなってしまう可能性があるためです。

静的サイトジェネレーターでのWebサイト更新の流れ

Q6　エンジニア以外は静的サイトジェネレーターを活用できない？

コマンドラインを使ってHTMLを生成…と聞くと、エンジニア以外には利用できないと思うかもしれません。しかし、microCMSなどのヘッドレスCMSサービスと静的サイトジェネレーターを組み合わせることで、エンジニア以外の人でも静的サイトジェネレーターを利用できます。例えば企業サイトなどでは、Web制作会社がシステムを構築すれば、投稿者は普通のCMSと同じ感覚で投稿できるでしょう。

この場合、静的サイトジェネレーターはクラウド上に設置されます。ヘッドレスCMSで記事を投稿すると、APIを利用して情報が送信され、そこから自動処理でHTMLが生成されるという流れになります。

ヘッドレスCMSと静的サイトジェネレーターを組み合わせたシステムのイメージ

Q7　ヘッドレスCMSと組み合わせるとどんなメリットがある？

コマンドラインを使ってHTMLを生成…と聞くと、エンジニア以外には利用できないと思うかもしれません。しかし、microCMSなどのヘッドレスCMSサービスと静的サイトジェネレーターを組み合わせることで、エンジニア以外の人でも静的サイトジェネレーターを利用できます。例えば企業サイトなどでは、Web制作会社がシステムを構築すれば、投稿者は普通のCMSと同じ感覚で投稿できるでしょう。

この場合、静的サイトジェネレーターはクラウド上に設置されます。ヘッドレスCMSで記事を投稿すると、APIを利用して情報が送信され、そこから自動処理でHTMLが生成されるという流れになります。

ヘッドレスCMS＋静的サイトジェネレーターのメリット、デメリット

Text:小平淳一
Web Designing 2023年10月号（2023年8月18日発売）掲載記事を転載