静的サイトとは何か。WordPressとの違いをお店にたとえて説明します

「静的サイト」という言葉を、このサイトでは何度も使っています。でも説明していませんでした。

技術用語を使わずに説明します。自分の店のサイトをどちらで作るか決めるための記事です。

ひとことで言うと

訪問者が来るたびに、サーバーが何かを計算するかどうかの違いです。

動的サイトは、誰かがページを開くたびに、サーバーの中でプログラムが動きます。データベースから文章や画像の場所を取り出し、その場でページを組み立てて返します。WordPressはこの方式です。

静的サイトは、あらかじめ完成しているHTMLファイルを、そのまま渡すだけです。計算することがありません。

飲食店にたとえるなら、こうです。

• 動的 … 注文を受けてから、厨房で一から作る
• 静的 … 作り置きを、そのまま渡す

料理なら作りたてのほうがいいのですが、ウェブサイトの場合、「毎回作り直す」必要がある情報はほとんどありません。 営業時間も、メニューも、地図も、昨日と今日で変わりません。

静的だと何が変わるのか

① サーバー代が0円になる

ファイルを置いて返すだけなら、計算する力が要りません。だから無料で配ってくれる場所があります。

このサイトも月0円です。内訳はホームページの維持費を全部公開するに全部出しました。

② 速い

すでに完成しているので、待ち時間がありません。

参考までに、このサイトの表示速度は0.128秒です。Googleが「良好」とする基準は2.5秒なので、その20分の1です。組み立て作業をしていないからです。

③ 壊れにくい

WordPressは本体・テーマ・プラグインが別々に更新されます。更新しないと危険で、更新すると壊れることがあります。

静的サイトには、更新しないと壊れるものがありません。動いているプログラムが無いからです。

④ 乗っ取られにくい

ニュースで見る「サイトが改ざんされた」の多くは、サーバーで動いているプログラムの弱点を突かれたものです。

動いているプログラムが無ければ、突く場所がありません。 ログイン画面すら存在しません。

では、静的では足りないのはどんな場合か

正直に書きます。次のような機能は、静的なファイルだけでは実現できません。

• 会員登録とログイン
• サイトの中で完結する決済
• 予約状況のリアルタイム表示
• 投稿者ごとの管理画面

ただし、これらは外部のサービスを組み合わせれば足りることがほとんどです。 決済はStripeやSquare、予約はそれ専用のサービス。サイト本体は静的なまま、必要な部品だけ借りてきます。

この「静的なファイル＋必要な機能だけ外部サービス」という作り方に付いた名前が JAMstack です。技術者向けの記事でよく見る言葉ですが、中身はいま説明したことと同じです。新しい概念ではありません。

「更新が大変では」という疑問について

いちばんよく聞かれるところだと思います。

更新のたびに作り直しは必要です。 ただし、その作業は自動化できます。

このサイトの場合、文章を書いて保存すると、ページが自動で作り直されます。手でHTMLを書き換えているわけではありません。書く作業だけを人間がやって、組み立ては機械がやるという分担です。

つまり「毎回組み立てる」こと自体は無くなっていません。組み立てるタイミングが、訪問者が来たときではなく、書いたときに移っただけです。

1日1万人が見るサイトなら、1万回組み立てるか1回組み立てるかの違いになります。どちらが無駄かは明らかです。

どちらで作るべきか

多くの小さな事業に必要なのは、上の3つだけだと思います。

作り方は無料のレンタルサーバーで事業用サイトを運用してはいけない理由とCloudflare Pagesで独自ドメインのサイトを公開する手順に、必要なドメイン代は独自ドメインは年いくらかに書きました。

まとめ

• 静的サイト＝訪問者が来るたびに計算しないサイト
• だから安く・速く・壊れにくく・乗っ取られにくい
• 会員機能や決済が要るなら、外部サービスと組み合わせる
• その組み合わせ方の名前が JAMstack
• 更新は自動化できる。組み立てるタイミングが前倒しになるだけ

「WordPressでないと駄目」と言われたことがあるなら、本当にそうか、この記事の表で確かめてみてください。