1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

初学者にもわかるWebページが表示されるまでの流れ

Posted at

皆さんがブラウザでWebページを見る時、裏側では何が起きているのでしょうか?この記事では、URLを入力してから画面に表示されるまでの流れを、初学者の方にもわかりやすく解説します。

Webページ表示の基本的な流れ(4ステップ)

  1. URLがDNSサーバーにリクエストされ、IPアドレスがレスポンスされる
  2. IPアドレスを使ってウェブサーバーにHTTPリクエストを送る
  3. ウェブサーバーがリクエストされたコンテンツをレスポンスする
  4. ブラウザがHTMLを解析してDOMを構築し、画面に表示する

この4ステップを詳しく見ていきましょう。

具体例:「http://abehiroshi.la.coocan.jp/」にアクセスする場合

ステップ1:DNSルックアップ

まず、ブラウザは「abehiroshi.la.coocan.jp」というドメイン名をIPアドレスに変換する必要があります。

ブラウザ → DNSサーバー「abehiroshi.la.coocan.jpのIPアドレスを教えて」
DNSサーバー → ブラウザ「IPアドレスは210.189.xxx.xxxだよ」(例)

ポイント

  • ドメイン名とは、人間が覚えやすいWebサイトの住所です
  • IPアドレスとは、インターネット上のコンピュータを特定する番号です
  • DNSサーバーは、ドメイン名とIPアドレスの対応表を持っています

ステップ2:HTTPリクエストの送信

次に、ブラウザは取得したIPアドレスのサーバーにHTTPリクエストを送信します。

ブラウザ → Webサーバー「210.189.xxx.xxxさん、トップページをください」

ポイント

  • HTTPとは、WebブラウザとWebサーバー間の通信プロトコル(約束事)です
  • リクエストには「どのページが欲しいか」などの情報が含まれています

ステップ3:サーバーからのレスポンス

Webサーバーは、リクエストに対応するコンテンツを返します。

Webサーバー → ブラウザ「はい、トップページのHTMLファイルです」

ポイント

  • サーバーは、HTMLファイル、画像、CSSなどのコンテンツを返します
  • 見つからない場合は「404 Not Found」などのエラーを返します

ステップ4:ブラウザでの表示

最後に、ブラウザはHTMLを解析して画面に表示します。

ブラウザ「受け取ったHTMLを解析して、画面に表示しよう」

ポイント

  • ブラウザはHTMLを解析してDOM(Document Object Model)を構築します
  • CSSを適用し、JavaScriptを実行します
  • 最終的に画面にレンダリング(描画)されます

まとめ

Webページの表示は、このシンプルな4ステップで行われています。GoogleやYahooなどの検索エンジンを使う場合も、クリックした後はこの同じプロセスが実行されています。

かつては、URLを直接入力する必要がありましたが、現在では検索エンジンやリンクを通じて簡単にアクセスできるようになりました。

この基本的な流れを理解しておくと、Web開発やネットワークの勉強を進める上で大きな助けになります。


皆さんも、次にブラウザでWebページを開く時には、裏側でこの4ステップが実行されていることを思い出してみてください。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?