静的サイトとは
静的サイト(Static Site)は、あらかじめ作成されたHTMLファイルをそのまま表示するWebサイトのこと。アクセスがあったとき、サーバーはファイルをそのまま返すだけで、プログラムの実行やデータベースへの問い合わせは行わない。
このメモ帳(ツバサのメモ帳)もGitHub Pagesで運営している静的サイトだ。HTMLファイルをGitHubのリポジトリにpushするだけで公開される。サーバー代は無料で、WordPressのようなデータベースやPHPの管理が不要なのが助かっている。
ツ GitHub Pages tsubasa-memo.github.io/glossary/github-pages.html ツ GitHub tsubasa-memo.github.io/glossary/github.htmlMDN Web Docsでは、Webページの種類として静的ページと動的ページの違いが解説されている。Cloudflareの解説でも、静的サイトは事前に生成されたファイルを配信する形式として説明されている。
外 MDN Web Docs developer.mozilla.org 外 Cloudflare cloudflare.comブログ運営・Web制作で出てくる場面
「ブログを始めたい」と思ったとき、最初に候補に上がるのはWordPressやnoteだろう。WordPressは動的サイトで、サーバー契約・ドメイン取得・PHPとデータベースの管理が必要になる。noteは手軽だがデザインの自由度が低い。
静的サイトは第三の選択肢だ。GitHub Pagesを使えば無料でホスティングでき、HTMLとCSSの知識があれば自由にデザインできる。最近はClaude CodeのようなAIツールを使えばHTMLの記述を自動化できるため、コーディングが苦手でも運用のハードルは下がっている。
このメモ帳でも、AIでブログを構築した記録をまとめている。記事の追加・更新はGitHub経由のpush操作で行い、下書き→本番公開のブランチ運用も可能だ。
ツ AIでブログを構築した記録 tsubasa-memo.github.io/glossary/ai-blog-building.html覚えておきたいポイント
静的サイトのメリットは表示速度・コスト・セキュリティの3つに集約される。サーバー側の処理がないため表示が速く、GitHub Pagesなら月額0円で運営でき、データベースがないためSQLインジェクションなどの攻撃対象にならない。
デメリットはHTMLの知識が必要なことと、記事更新のたびにファイルを編集してpushする手間がかかること。コメント欄・お問い合わせフォーム・サイト内検索といった動的な機能は外部サービスやJavaScriptで補う必要がある。
ECサイトそのものを静的サイトで運営するのは難しい(カートや決済が動的処理を必要とする)が、ECの補助的なコンテンツ——たとえば商品撮影のノウハウブログ、用語集、料金比較ページ——を静的サイトとして独立運用するケースは増えている。
静的サイトと動的サイトの違い
静的サイトはサーバーに置いたHTMLファイルをそのまま表示する。動的サイトはアクセスのたびにサーバー上のプログラム(PHPやRubyなど)がデータベースからデータを取得し、HTMLを生成して返す。
WordPressが動的サイトの代表格で、管理画面から記事を書くとデータベースに保存され、閲覧者がアクセスするたびにPHPがHTMLを組み立てる。プラグインで機能を追加しやすい反面、PHPやデータベースの脆弱性を突かれるリスクがある。
静的サイトはファイルを直接配信するだけなのでプログラムの実行がなく、高速かつ安全だ。ただし記事が数百ページを超えると管理の手間が増える。その場合は静的サイトジェネレーター(Hugo、Jekyllなど)を使ってMarkdownからHTMLを自動生成する方法もある。静的サイトと動的サイトの比較記事で詳しくまとめている。
ツ 静的サイトと動的サイトの比較記事 tsubasa-memo.github.io/glossary/static-vs-dynamic-site.html