今回は、WEBサイトにおける「静的サイト」と「動的サイト」の違いについてとメリットとデメリットを説明していきます。
静的サイトとは
静的サイトはその名の通り何も動かないサイトです。
ただし視覚的に動かないサイトではありません。
アニメーションが入っていてキャラクターが動くサイト、スクロールしてくとコンテンツ部分がスライドするサイトも静的サイトな場合があります。またページが複数あるサイトも静的サイトの場合があります。
静的サイトの「静」はページ上の動作の事を指している訳では無く、ユーザーがサイトに訪れた際の読み込み時のレスポンスを指しています。
静的サイトの主な特徴は、基本的にHTMLファイルで出来ているサイトで、ユーザーがサイトにアクセスした際にいつも同じ見た目、同じ動きをしたサイトです。
静的サイトに適したサイト
- コーポレートサイト
- ランディングページ
- 特設サイト
- 求人サイト
例）実際の静的サイト
UUUM採用サイト
株式会社ノワール
Flamingo
Braun
動的サイトとは
動的サイトもまたその名の通り、動きのあるサイトです。
動的サイトでは、読み込み時のレスポンスに動きがあるサイトを指します。
なのでアニメーションが無くても、動画が無くても動的サイトの場合があります。
例えば、TwitterやFacebookなどのSNSサイトでは、誰かが投稿をすればそれが表示され、昨日と違ったページになります。このような可変的なサイトを動的サイトと言います。
また人気記事一覧や検索システムなどがあるサイトも動的サイトです。
動的サイトの特徴は、基礎部分となる要素はPHPファイルで作成し、可変的な部分はDB（データベース）に格納します。ユーザーがサイトを表示した際の要求に応じてDBから該当する応答内容を引き出して表示されるといった動きが起きます。
人気記事を表示する際は、ページの表示件数をカウントするDBが存在し、ユーザーがページに訪れた際にDBから応答されたカウント数を元に該当したページを表示しています。
検索システムでは、この場合はこれ、この場合はあれと何万件となるif分肢された情報をDBに格納しユーザーの検索の内容に応じて応答します。
動的サイトに適したサイト
- ブログサイト
- ECサイト
- 検索サイト
例）実際の動的サイト
カカクコム
クックパット
株式会社博報堂
Humaan
メリットとデメリット
静的サイトのメリット
- ページの読み込み速度が速い
- 制作コストが安い
- サーバーダウンが起こりづらい
- セキュリティ対策が簡単
静的サイトのメリットは、ファイルを配信するサーバーに依存しないため、格安レンタルサーバーやAWSなどのクラウドサービスで十分でしょう。 つまり提供コストが安いことがメリットになります。また難しいプログラムのメンテナンスが不要なので運用面でも費用が安くなります。
また静的サイトは常に1ページにつき1ファイルを読み込むためページの読み込み速度が速いです。これによりアクセス集中にも耐えやすくなりサーバーダウンが起きづらいです。
管理面でも、基本的にはサーバー面と各ファイルのデータのみなのでセキュリティ対策が非常に簡単に行えます。
静的サイトのデメリット
- 情報がリアルタイムに反映しづらい
- ユーザー毎に異なる内容を表示できない
静的サイトで、最新の情報を表示する場合は、そのページの改修作業を行わなくては行けません。気楽に最新情報を表示できないのは静的サイトの一番のデメリットかもしれません。
デメリットとは言い難いが、静的サイトではどんなユーザーにも毎度同じ内容が表示されます。サイトに訪れたユーザー層に合わせて可変的な内容を表示したいなら動的サイトにする必要があります。
動的サイトのメリット
- 常に最新の情報を表示できる
- ユーザー一人一人に適した表示が可能
システムで動作するため、簡易的な文章の入力のみで新しいページを作成できます。そのためリアルタイムで最新情報を更新することが出来ます。このサイト運用の改修作業のコストを無くせます。つまり運用面でのメリットを感じやすいことになります。
またユーザーの要求に応じてページを生成する動的ページは、検索結果や位置情報などユーザーごとに異なる情報を表示させることが可能です。これは、静的ページでは再現することができません。
動的サイトのデメリット
- ページの読み込み速度が遅くなりがち
- サーバーダウンが起きやすい
動的サイトは、ページの生成や要求の返答などのプログラムがWebサーバー上で一度実行され、それをブラウザがWEB上に読み込む2段階の動作が起きます。そのためCPUに負荷がかかるので、Webページの表示速度は遅くなりがちです。またアクセスが集中するとサーバー側の動作が多くなりサーバーダウンが起きやすくなってしまします。
以下の表はメリットとデメリットを比較した表です。
| 静的サイト | 動的サイト |
|---|---|
| ページの読み込み速度が速い | ページの読み込み速度が遅くなりがち |
| 制作コストが安い | 制作コストが高い |
| 運用コストが高い | 運用コストが安い |
| サーバーダウンが起こりづらい | サーバーダウンが起きやすい |
| 情報がリアルタイムに反映しづらい | 常に最新の情報を表示できる |
| ユーザー毎に異なる内容を表示できない | ユーザー一人一人に適した表示が可能 |
| セキュリティ対策が簡単 | セキュリティ対策に必要な知識が多い |
静的サイトと動的サイトはどちらがいいのか？
最後に、静的サイトと動的サイトではどちらで運用していけばいいのか？を考えていきます。
結論から言いますと、ここでは決めれないと思っています。
というのは、実際にどの様なサイトを作成して、どの様な運営の仕方をしたいのか？また費用面や運用者のWEBに関する知見はどの程度あるのか？さらには効率を求めるか、クオリティを求めるか、時間のリソースにはどのくらい避けるのか？といろんな角度から検討すべき事だからです。
静的サイトでは、制作会社にお願いする場合のコストは動的サイトよりか半分くらい安いが、WEBに関する知見がないと毎度改修作業で費用がかかってきます。逆に動的サイトだと、自身で更新できる機能をつければそれっきりです。
また静的サイトは、プログラムの縛りがないため奇抜なデザインや特殊な動きなど、非常にデザインクオリティの高いページが作成できます。反対に動的サイトではデザインは凝らず、運用時の効率化を測りやすいです。
この様にケースバイケースだと思っていただきたいです。
あえていうならば、そこまで更新作業が無くクオリティが重要な「商品の特設サイト」や「採用サイト」の場合は静的サイトの方が良いでしょう。逆に「役所系サイト」や「ECサイト」など新着情報や、商品の入れ替えなどの頻度が高い様なサイトは動的サイトの方が良いでしょう。
下記の表は、個人的に多いいなと思った両者の例です。（どちらのパターンでも静的サイトの場合がありますし動的サイトの場合もあります。）
| 静的サイト | 動的サイト |
|---|---|
| 広告ページ | ECサイト |
| 商品特設サイト | ブログサイト |
| 採用サイト | 検索サイト |
| コーポレートサイト | 予約サイト |
以上が「動的サイトと静的サイトの違い【メリット&デメリットを比較】」でした。
静的サイトと動的サイトの違いを知れば、WEBサイトを制作するときに何を重要視するのか？目的はなんなのかを整理しやすくなるかと思います。
