「インターネット」や「Web」 は、一般的によく使われている言葉ですが、この二つの違いはご存知でしょうか？
まずは、「Web」と「インターネット」について理解していきましょう！
目次
インターネットとWeb
インターネットとは、世界規模でコンピューター同士を繋げ、様々な情報のやりとりをする仕組みのことです。
それでは、「Web」との違いはなんなのでしょうか？
Webというのは英語で「蜘蛛の巣」、正式には「World Wide Web」(=WWW)というもので、インターネット技術が利用されている機能の一つです。
このように名付けられたのは、「ハイパーテキスト」というWebサイト同士を結びつける機能によって、世界規模で張り巡らされた文書データが蜘蛛の巣のように繋がって見える、という理由からです。
「ハイパーテキスト」とは直訳で「文書を超える」という意味ですが、ハイパーリンクによって、複数のWebの文書データ（文章、画像、音声など）を結びつける機能のことです。「ハイパーリンク」は、一般的に「リンク」と呼ばれます。例えばサイトのナビやリンクテキスト、リンク画像など、Webサイト同士をつなげる役割をしています。
テキストや画像をクリックすることで別のページに移動できるのは、ハイパーリンクがあるからです。
WWWは無数の「Webページのまとまり」から出来ています。今ご覧いただいているこのページも「WWWの中のWebページ」であるということです。
また、みなさんは今Webページを ”Webブラウザ(以下、ブラウザ)” を通して見ていると思います。ブラウザはパソコンやスマートフォンでインターネットに接続し、Webページやインターネット上のシステム(クラウドサービス)を閲覧・操作する時に使用するアプリケーションの総称です。
前章でダウンロードを推奨したGoogle Chromeもこの中の1種です。
「Web」について何となく理解したところで、その仕組みについて学んでいきましょう。
Webサイトの仕組みを理解するために知っておくべきこと
Webサイトの仕組みを理解するために、まずは「ドメイン」「サーバー」について理解しましょう。
ドメイン
ドメインは、WebサイトのURLやメールアドレスの中で使われています。
インターネット上に存在するコンピューターやネットワークを、識別するための名前のことですが、単純に「インターネット上の住所」と説明ができます。Webサイトが「どこにあるのか」を判別する情報は、ドメインに紐づく「IPアドレス」というものにあります。
IPアドレスは「000.00.00.00」といったような数字のみを用いた文字列です。見たいページのIPアドレスを、ドメインのアドレスバーに入力すればそのページを開くことができます。
しかし、「数字だけでは覚えづらく、わかりにくい」ということから、文字列(名前)に変換してWebサイトの場所を示したものが 「ドメイン」です。
ドメインには「独自ドメイン」と「サブドメイン」があります。
「独自ドメイン」というのは、ムームードメインやお名前.comのようなドメイン取得サービスを用いて、ユーザーが好きなように名前を決め、利用できるドメインです。
「サブドメイン」というのは、独自ドメインをさらに細かく分割し、複数のユーザーに割り振るためのドメインです。独自ドメインを取得することで作成することができ、独自ドメインの前に「.(ドット)」、その前に好きな文字列を挿入して使用します。
例えば、レンタルサーバー「ロリポップ！」に登録した際に使用できるドメインは「ロリポップ！が所有している独自ドメイン」ということになります。サブドメインを作成（自分の好きな文字列を決めて使用）することが可能ですが、ドメインの一部を間借りするような状態です。つまり、ドメイン自体の所有者はロリポップ！ということになります。
独自ドメインを取得・使用するメリット
好きな文字列が決められる
サイトの内容や世界観をドメインを見て分かるようにすることでユーザーに覚えてもらいやすくなり、ブランドイメージを確率する1つの要素にもなります。
信頼度が高まる
ドメイン名に会社やお店の名前、サイト名を含ませることで認知度や信頼度が高まります。メールアドレスとしての使用も可能なので、オリジナルのアドレスを使用することでビジネスでの信頼度アップにもつながります。
ずっと使い続けることが可能
ドメインの所持者が登録者自身であるため、サーバーを変更するということがあっても、そのままのドメインを使用することができます。レンタルサーバーなどのサービスが提供しているドメインとは違い、サービスの終了などにより消去されてしまうリスクがありません。
サーバー
次に、前項で出てきた 「サーバー」 について説明していきます。
サーバーとは「サービスを提供する側のコンピューター」を指します。パソコンやスマホと同じような、「サーバー」という種類のコンピューターがあるのです。サーバーにはクライアントの要求に応じて、加工したデータを送ったり、データを保存する役割があります。
サービスを提供する側に対して、「そのサービスを受け取る側」のことを、「クライアント」と呼びます。つまり、サーバーとクライアントは供給と需要の関係にあります。
私たちは普段コンピューターを使用してWebサイトを見たり、メールを送ったりします。これが「リクエスト（クライアントからの要求）」です。そして、サーバーからそれに応じたデータファイル（画像ファイルやHTMLファイル）が送り返されます。これが「レスポンス」です。
Webサイトに例えると、ユーザー（クライアント）に対してサーバーがWebサイトを表示する役割をしています。このサーバーとクライアントのやり取りによって、ユーザーは様々なサービスを受けられるようになっています。
サーバーの利用方法と種類
次に、サーバーの利用方法と種類について説明していきます。
「レンタルサーバー」はサーバーの機能の貸し出しを行っているサービスです。ユーザーはレンタルサーバーの運営会社と契約をしてサーバーを利用することができます。
運営会社側でサーバーの管理を行ってくれるため、サーバー構築やメンテナンスを自分でする必要はありません。レンタルサーバーを借りることで、自分ホームページやブログ・アフィリエイトサイト・インターネットショップなどの公開を行うことができたり、独自ドメインのメールアドレスの利用が可能となります。
レンタルサーバーにも種類があるので、それぞれ紹介します。
共有サーバー
エックスサーバーやロリポップ！などのような、運営会社が持つ1つのサーバーを複数のユーザーが共有して使用するサーバーのことです。
専用サーバー
1契約者が1台のサーバーをレンタルして利用するタイプです。法人などのビジネス利用ではこのタイプが選ばれることが多いです。
他にも、レンタルサーバーの中には仮想サーバーと言われるVPS（バーチャル・プライベート・サーバー）、クラウドサーバーといったものがありますが、どちらも専用サーバー同様、利用をするには専門の高度な知識やスキルが必要です。
Webの仕組み
Webサイトを閲覧する際に入力する「URL」の構造について説明します。
このようなURLの場合、画像のように3つの要素に分けることができます。
HTTPプロトコル（HyperText Transfer Protocol）
プロトコルとはコンピューター同士が通信をする際の手順や約束事。
よってHTTPは、Webブラウザを使用してWebサイト（Webサーバー）にアクセスする際にハイパーテキストをやり取りするための手順・約束事。
ドメイン名
「www」など、ドメインの前に「.」で区切られた文字列がある場合、それはホスト名になります。
パス
Webブラウザで表示させたいWebページのファイル名を指定する部分。デフォルトはindex.html
Webページの表示は、HTTPというとてもシンプルなプロトコルによって行われています。ブラウザとサーバとの間で、データを要求する「HTTPリクエスト」と、要求に応じてデータを送り返す「HTTPレスポンス」です。
このようなやり取りの繰り返しで私たちが閲覧しているWebページが成り立っています。
ここまでの説明を踏まえて、私たち（ユーザー）がWebサイトにアクセスして、サイトが表示されるまでの仕組みについて説明します。
例）http://zero-plus.io/index.html にアクセスする場合
※ドメイン「zero-plus.io」のIPアドレスは「000.000.000.00」とします
- ユーザーがブラウザにURL(http://zero-plus.io/index.html)を入力しEnterを押す
- Webブラウザ：DNSサーバにドメイン「zero-plus.io」のIPアドレスを要求
- DNSサーバ：対応するIPアドレス「000.000.000.00」をWebブラウザに返信
- Webブラウザ：確認したIPアドレスのWebサーバにアクセスし、Webページのデータを要求(=HTTPリクスト)
- Webサーバ：Webブラウザから受信したHTTPリクエストを解析→要求されたデータを返信(=HTTPレスポンス)
- Webブラウザ：HTTPレスポンスを解析してWebページとして表示
- ユーザーが閲覧
このようにして、Webページの表示が行われています。
Webサイトを構成する言語
Webサイトの見た目は、
- テキストや画像に構造を指定するための言語 →「HTML」
- 構造化されたテキスト・画像に装飾を加える言語 →「CSS」
- サイトに動きを加える言語 →「JavaScript」
の、3つの言語で構成されます。どのようなものか簡単に説明していきます。
HTMLとは
「HTML」とは「Hypertext Markup Language（ハイパーテキスト・マークアップ・ランゲージ）」の略で、プログラミング言語ではなくマークアップ言語です。
Webサイトを開いた時に見えているテキストや画像に、構造を指定するための言語で、他にも主要なマークアップ言語としてSGML、XHTML、XMLがありますが、最も基本的なものがHTMLです。
その名のごとく「マークアップ＝しるし（タグ）をつける」をすることで、文書の中で「見出し」「段落」「画像」「表」「リスト」など、それぞれのテキストや画像に意味付け、構造化する役割があります。
CSSとは
「CSS」とは、「Cascading Style Sheet(カスケーディング・スタイル・シート)」の略で、HTML同様、プログラミング言語ではなくマークアップ言語です。
HTMLと組み合わせて使用され、HTMLで構造化されたテキストや画像に対し、見た目・スタイル(装飾)を加える役割があります。
CSSで指定できるものには、
- 色・サイズ・背景・レイアウトなどの「表示スタイル」
- プリンタ等の機器で印刷や出力をする際の「出力スタイル」
- 音声で再生される際の「再生スタイル」
などがあります。
JavaScriptとは
「JavaScript」はHTML/CSSとは異なり、Webページを”活かすため”に作られたプログラミング言語です。Webサイトを表示するブラウザ上で動くプログラムで、ユーザーが何らかのアクションをすることで、それに対応して動きを加えるための指定をする言語です。
JavaScriptで出来ることには、
- 「ページを読み込んだ時」「クリックした時」に起こすイベントの操作
- 入力フォームに入力があった際に入力値をチェックして表示、入力ミスがあった際のアラート表示
- 一定時間毎に文字や画像を切り替えるなどのタイマーの操作
などがあります。
JavaScriptは、通信（インターネット）がなくても動作することができます。また、時間やマウスの動きなど、クリック以外の動作にも対応ができる、などの特徴があります。
WordPressとは
「WordPress」とは、「無料で楽にブログ運営を行うことが出来るソフトウェア」のことです。Webサイトを作成するために「HTML」「CSS」「JavaScript」を用いてコードを書くことを「コーディング」といいます。
コーディングをしてブログサイトを作成することはもちろん可能ですが、長いコードを書かなければいけなかったり、ブログ更新を行う度にHTMLファイルを新たに作成・コードの編集を行わなければいけません。また、公開する際には、作成したファイルを自力でサーバーにアップロードしたりと、何かと大変で面倒です。WordPressを使うと、ブログやサイトの更新を楽に行うことができます。
WordPressを使用するためにはレンタルサーバーを借り、サーバーにWordPressをインストールする必要があります。ですが、WordPressのインストールさえしてしまえば、HTMLをいじることなく、簡単にブログの管理・アップロードを行うことが出来るようになります。
