TERM PRIMER
先に知っておく言葉
ブラウザはアプリの一つです。端末の共通機能を支える土台との違いは、OSの役割で確認できます。
自分の言葉で説明してみよう
自分の端末で、次の三つを確認してみてください。
使っているブラウザ名: ＿＿＿＿＿＿
よく使う検索エンジン名: ＿＿＿＿＿＿
よく見るURLのドメイン名: ＿＿＿＿＿＿
答えの例:
- 使っているブラウザ名: Chrome
- よく使う検索エンジン名: Google検索
- よく見るURLのドメイン名: example.com
ブラウザとは、URLを読み、Webページの材料を＿＿＿＿＿＿＿＿＿＿＿＿アプリです。
検索エンジンは、情報を＿＿＿＿＿＿＿＿＿＿＿＿サービスです。
ページが開かないときは、ブラウザだけでなく＿＿＿＿＿＿＿＿＿＿＿＿も分けて見ます。
答えの例は、「取りに行って画面に表示する」「探す」「URL、DNS、ネットワーク、サーバー側」です。ブラウザというアプリと、検索エンジンというサービスを分けて説明できるかを確認してください。
ピコ
URLの案内板を読んだあと、実際に動くのがブラウザだよ
イト
ブラウザって、検索するためのものじゃないの？
ユイ
検索エンジンとブラウザを分けるところから始めたいです
Chrome、Safari、Edge、Firefoxなどがブラウザです。検索エンジンは情報を探すサービスで、ブラウザはその検索エンジンやWebページを開くためのアプリです。
以下では、第40話「ブラウザは何をしている？」のWebページ工房をたとえにしながら、実際の画面のむこう側でブラウザがしている仕事を一つずつ確かめます。
URLを読んで材料を取りに行く
利用者がURLを入力したり、リンクをクリックしたりすると、ブラウザは必要な通信を始めます。URLという案内板の読み方は、URLとは で詳しく整理できます。ブラウザはサーバーからHTML、CSS、JavaScript、画像などを受け取り、それらを読み取って一つの画面として表示します。
ブラウザは、ただ文字や画像を並べているだけではありません。タブ、履歴、Cookie、キャッシュ、拡張機能、セキュリティ表示なども扱います。最初は「Webページを取りに行って画面に組み立てるアプリ」と押さえると分かりやすいです。
検索エンジンとの違い
ブラウザと検索エンジンは混ざりやすい言葉です。
ブラウザはアプリです。検索エンジンは、情報を探すサービスです。Google検索やBing検索などは検索エンジンで、ChromeやSafariなどはブラウザです。
同じ入力欄から始まるため、混乱しやすくなります。
| 入力するもの | ブラウザの動き |
|---|---|
https://example.com/ | URLとして読み、指定されたページへ向かう |
ブラウザとは | 検索キーワードとして検索エンジンに渡す場合がある |
| ブックマーク | 保存されたURLを開く |
「ブラウザで検索する」は日常会話として自然です。ただし仕組みを説明するときは、ブラウザというアプリの中で検索エンジンを使っている、と分けると正確になります。
ブラウザがページを作る流れ
Webページを開くとき、ブラウザは画面のむこう側でいくつもの仕事をしています。
- URLやリンクを読み取る
- 必要なら DNSとは で扱う仕組みで名前を宛先へ結びつける
- HTTP/HTTPSでサーバーへリクエストを送る
- HTML、CSS、JavaScript、画像などを受け取る
- HTMLで構造を読み、CSSで見た目を整える
- JavaScriptを実行し、必要な動きを加える
- 画面に表示する
たとえば、HTMLは設計図、CSSは色や配置の指定、画像は材料、JavaScriptは動きを加える道具です。ブラウザはそれらを工房で組み立て、利用者が見られるページにします。
ブラウザとサーバーのお願いと返事に注目するなら、リクエストとレスポンスとは が続きになります。
マコト
サーバーから届いた材料を、そのまま貼っているだけではないんだね
ピコ
うん。ブラウザが読み取り、組み立て、必要な動きも動かしているよ
ブラウザが覚えているもの
ブラウザは、ページを表示するだけでなく、いくつかの情報を覚える場合があります。
代表的なのが、履歴、Cookie、キャッシュです。
| 名前 | ざっくりした役割 |
|---|---|
| 履歴 | 開いたページの記録 |
| Cookie | ログイン状態や設定などに使われる小さな情報 |
| キャッシュ | 画像やファイルなどを再利用しやすくする保存 |
これらは便利ですが、トラブル時には影響することもあります。古いキャッシュが残って表示が変わらない場合や、Cookieの状態でログイン画面の動きが変わる場合があります。
ただし、消せばいつも解決するわけではありません。サービスの状態、ネットワーク、端末、拡張機能なども関係します。環境に合わせて確認します。
ページが開かないときの確認と切り分け
ページが開かないときは、「ブラウザの問題」とすぐ決めずに分けて見ます。
- 別のタブや別サイトは開くか
- URLの入力に間違いがないか
- 別のブラウザでは開くか
- 拡張機能を止めると変わるか
- キャッシュやCookieの影響がありそうか
- Wi-Fiや回線全体も遅いか
- サービス側の障害情報が出ていないか
特定のブラウザだけで起きるなら、ブラウザの設定や拡張機能、キャッシュが候補になります。どのブラウザでも同じなら、ネットワークやサービス側も候補に残します。
イト
検索する場所だけじゃなく、材料を読んで画面を作る工房なんだ
ユイ
検索エンジンとブラウザの役割を分けて説明できます
よくある疑問
Q1. ブラウザと検索エンジンは同じですか？
A. 同じではありません。ブラウザはWebページを見るアプリ、検索エンジンは情報を探すサービスです。
Q2. ブラウザは何を受け取って画面を作りますか？
A. HTML、CSS、JavaScript、画像などを受け取って画面に組み立てます。
Q3. ページが開かないとき、ブラウザだけを疑えばよいですか？
A. いいえ。URL、ブラウザ、拡張機能、ネットワーク、サーバー側などを分けて確認します。
LAB WHITEBOARD
自分の言葉で説明してみよう
「ブラウザを、Webページを取りに行って表示するアプリとして説明し、検索エンジンとの違いを分けられるようになる。」を、いまの自分の言葉で一文にしてみてください。途中の説明でも大丈夫です。
