目次
- ホームページが表示されるまで
- 動的ページと静的ページ
ホームページが表示されるまで
作ったホームページがどうやって見られるかご存知でしょうか。
ホームページ作成の初心者で意外に気づいていないのが、どうやってページが表示されているか、その概念です。
ざっくり説明すると、こんな感じです。ホームページを作成するところからお話しします。
＜ホームページの準備＞
・自分のパソコンでHTMLページを作成
・サーバにアップロード(自分で借りるなど)
＜ホームページ訪問＞
・情報を見たい人が、サイトのURLをブラウザに入力。
・サーバがユーザに向けてHTMLを送信する。
・ユーザのブラウザがサーバから受け取ったHTMLを表示。
・ユーザのブラウザが、HTMLを解釈して、文字を大きくしたり、画像を配置したりする。
※GoogleやYahooなどに登録され、訪問者が検索することや、ドメインの参照、またCSSなどの詳細は割愛します。
※イメージ図
動的ページと静的ページ
WordPressでできたサイトや、楽天、アマゾンなどのショッピングサイトも基本的な考え方は同じですが、
HTMLだけでは、ショッピングカートなどの機能は実現できません。
ここで「静的ページ」「動的ページ」を理解できれば、ホームページがどうやって成り立っているかが判ると思います。
＜静的ページ＞
情報を表示するだけのページ。
例1：単なるHTMLページ。阿部寛の爆速ページ。
＜動的ページ＞
表示する時の条件によって表示内容を変えるページ。プログラムで処理した結果をHTMLに出力する。
例2：Amazonなどのショッピングサイトで商品を購入。注文履歴が表示され、入力した自分のメールアドレスに、注文内容が書かれたメールが届く。
例3：アクセスした時に、現在の時間が表示される。URLは変化がなく自動で秒がカウントされている。
ここで、例2と例3では「プログラムがどこで処理されるか」ということになるわけですが、
以上を纏めますと
例１：単なるHTMLページ
→文字(文章とHTML)だけをサーバが、ページを見ている人のパソコンやスマホに送信する。ページを見る人の端末にインストールされているブラウザが、受け取った文字情報を表示する。ブラウザはHTMLを解釈できるので、HTMLが送られてきた場合、文字を大きくして表示したり、改行したり、HTMLのルールで表示される。 ※デザインについては実際はCSSというものが行っていますがここでは割愛します。
例２：ショッピングサイトで商品を購入
→条件を基に、Webサーバ側が処理を行う。処理結果はサーバが文章（文章とHTML）でユーザに送信する。その後の処理は上の例１と同じ。
例３：ページにアクセスした時に現在の時間が表示され秒がカウントされている。URLは変化がない。
→ページを見ている人のブラウザが、ＰＣ内部の時間を取得し表示する。ネットが繋がっていなくてもできる。
※厳密には、サーバの時間も取れますがややこしくなるので割愛します。
イメージ、理解できましたでしょうか。
細かい話はまたの機会に。