※この記事は2020年4月19日に更新されました。
WEBサイトの制作を進める前にまずは、WEBという概念は一体なんなのか？
毎日触れているWEBですが、実は知らない！と言う方も多いのではないでしょうか？
しかし、この概念を理解しないとWEBサイトの制作はできませんし、情報を発信し、整理していくことはできません。
逆に言うと、WEBを理解してしまえば、HTMLは理解できたも同然です！
当記事でWEBとは何なのか？！簡単でもいいので概念を理解しておきましょう。
World Wide Web
（ワールド・ワイド・ウェブ、略名：WWW）は、ハイパーテキストシステムのことを指します。
このハイパーテキストシステムを創り出した人が、ティム・バーナーズリー博士。
[su_box title=”ティム・バーナーズリー博士とは・・・” box_color=”#84ff21″]・1955年ロンドンに生まれ。
・1976年オックスフォード大学（クイーンズカレッジ：物理学）卒業。
・様々な企業を経て1984年からＣＥＲＮ ＥＣＰ部門で働く。
・CERNの中でＷＷＷの構想、開発を行い、ＵＲＬ，ＨＴＴＰ、ＨＴＭＬなどの現在のＷＷＷの基本となるプロトコルを創りました。
・1994年から、現在まで、ＭＩＴ（マサチューセッツ工科大学)の計算機科学研究所の主任研究員であると共に、ＷＷＷコンソーシアム（W3C）ディレクタとして活躍。 [/su_box]
ティム博士がwwwを開発した経緯としては、CERN内の膨大な資料、テキストデータを整理整頓するという仕事を与えられ、なんとか効率よく資料へのアクセスやシェアができないかと構想したのがきっかけでした。
1980年代、資料へのアクセスと言えば膨大な紙の中から目的の資料や情報を探し出す必要がありました。
開発当初は「ローカルネット資料室」のような感覚だったと思います。
当時は○○年の○○の研究資料を取ってきてと言われれば、書庫まで行って、目的の資料を探し出さなければいけませんでした。
なので、だいたいどの辺にどんな資料があるのか？特定の人だけが詳しいという状況に置かれていたわけです。
そこで、それらを効率的に整理し、情報に素早くアクセスするためのプログラミング言語としてティム博士はハイパーテキスト マークアップ ランゲージを開発したわけです。
HTMLとは？！
HTMLってよく聞くけどこれは一体なんなんでしょうか？
ポイント
これはHyperText Markup Language（ハイパーテキスト マークアップ ランゲージ）というプログラミング言語の一種なんです。
プログラミング言語といっても、現代ではノーコードなども流行っており、GUI（グラフィック上で操作）が一般化し、ワードのように取り扱うことができるようになっています。
ですので、これから覚えようとする方はプログラミングを完璧主義的に覚える方以外はリーディングができれば問題ないかもしれません。
リーディングができないとこれはなんのタグなのか？
など自分の中で整理できないので、ゼロから全部書く必要はありませんが、概要は把握しておく必要があります。
→HTMLのリーディングだけサクッと習得する方法
HTMLなどもそうですが、必ずしもインターネット上のシステムという訳ではありません。
当然ローカルサーバーでHTMLをブラウザ表示する場合はアドレスにwwwは必要ありません。
→Arduino IDEのスケッチ例【HelloServer】を使ってみる
さて、話を戻しますと、HTMLの肝はこの↑↑↑リンクにあるわけです。
昔はハイパーリンクなどと言ったりしていましたが、聞いたことがないでしょうか？
つまり上記のM5Stackでホームサーバー接続するという情報にアクセスするためのリンクが肝になってきます。
例えば資料室の例で見ると・・・
「○○年代の○○の研究」→「研究結果をリンク」
「○○プロジェクトの総収益情報」→「総収益情報結果にリンク」
といった具合に資料整理していけるわけです。
もちろん当時はローカルネット上でのハイパーリンクになり、これのワールドワイド版、つまりwwwとなったのが、今現在私たちが使っているwebリンクシステムになります。
URL=住所
これもよく耳にするのではないでしょうか？
URLというのは一般的にはよく住所と例えられることが多いです。
これは、資料室の話で例えるなら「A列の３段目の46番目の資料の467ページ目」といった具合です。
実際にWEB上のURLもこのような分け方をしているのがドメインを取得すると分かってくると思います。
ポイント
つまり、先ほどの「A列の３段目の46番目の資料の467ページ目」をKotaro Blog上で換算するなら「kotarohattori.comという場所の、プログラミングというカテゴリーの、Webサイト制作エリアの一個目の記事」が当記事のURLになります。
このように考えると簡単ですよね。
サイトの住所はわかりました。
しかし、今目にしているこのテキストデータはどこにあるのでしょうか？
このハイパーリンクは実はこのテキストデータを呼び出す注文ボタンなんです。
この呼び出しを実行するシステムをHTTPと言います。
サーバーから呼び出す
ですので、URLをブラウザに打つというのは実はC言語などの機械言語に似たようなところもあります。
ポイント
HTTP=今からデータを呼び出しますよ（宣言）
WWW=ローカルサーバーじゃなくてワールドワイドで（どうやって？）
kotarohattori.com=この住所で
で注文します。
すると、自動的に筆者のテキストデータが格納されているサーバーからデータが呼び出されてみなさんのブラウザに表示されるわけです。
すべてのURLは把握できない・・・
データを呼び出す仕組みは理解できた。。。
だけど、すべての情報のURLを昭和の電話番号みたいに覚えるわけにはいきません。
200件や300件なら可能かもしれませんが、現時点で情報やHTMLデータは世界中に膨大すぎて、すでに人間が管理できる範囲をとっくに超えてしまいました。
そこで、人間の代わりに管理し、検索してくれるのが、Googlechromeや、safariなどのプラウザというアプリケーションです。
Googleクローラーと呼ばれるシステムがwww上にあるテキストデータを収集し、世界資料室を整理してくれています。
私たちはこの世界資料室に欲しい情報をブラウザに命令するだけでこんな資料がありましたよ？といって提供してくれるわけです。
もちろんハイパーリンクの仕組みはさきほどと同じです。
まとめ
WEBやHTMLは資料室の整理が起源で、その概念は今現在も変わっていない。
ブラウザというのは私たち一人一人に専属でついてくれている世界資料室の管理人スーパー頭脳の司書さんのような存在。
WEBサイトを制作するということは、誰かが探したいと思う資料を作るということ。
以上超簡単ですが、WEBの概念をまとめてみました。
これが分かればWEBサイトは完成したも同然です！
それでは次回から具体的にWEBサイトの制作に入っていきましょう。
【超簡単】WEB とは何か？！
もくじ
※この記事は2020年4月19日に更新されました。
WEBサイトの制作を進める前にまずは、WEBという概念は一体なんなのか？
毎日触れているWEBですが、実は知らない！と言う方も多いのではないでしょうか？
しかし、この概念を理解しないとWEBサイトの制作はできませんし、情報を発信し、整理していくことはできません。
逆に言うと、WEBを理解してしまえば、HTMLは理解できたも同然です！
当記事でWEBとは何なのか？！簡単でもいいので概念を理解しておきましょう。
World Wide Web
（ワールド・ワイド・ウェブ、略名：WWW）は、ハイパーテキストシステムのことを指します。
このハイパーテキストシステムを創り出した人が、ティム・バーナーズリー博士。
[su_box title=”ティム・バーナーズリー博士とは・・・” box_color=”#84ff21″]・1955年ロンドンに生まれ。
・1976年オックスフォード大学（クイーンズカレッジ：物理学）卒業。
・様々な企業を経て1984年からＣＥＲＮ ＥＣＰ部門で働く。
・CERNの中でＷＷＷの構想、開発を行い、ＵＲＬ，ＨＴＴＰ、ＨＴＭＬなどの現在のＷＷＷの基本となるプロトコルを創りました。
・1994年から、現在まで、ＭＩＴ（マサチューセッツ工科大学)の計算機科学研究所の主任研究員であると共に、ＷＷＷコンソーシアム（W3C）ディレクタとして活躍。 [/su_box]
人類の代表みたいに頭の良い人じゃ！！
ティム博士がwwwを開発した経緯としては、CERN内の膨大な資料、テキストデータを整理整頓するという仕事を与えられ、なんとか効率よく資料へのアクセスやシェアができないかと構想したのがきっかけでした。
1980年代、資料へのアクセスと言えば膨大な紙の中から目的の資料や情報を探し出す必要がありました。
開発当初は「ローカルネット資料室」のような感覚だったと思います。
当時は○○年の○○の研究資料を取ってきてと言われれば、書庫まで行って、目的の資料を探し出さなければいけませんでした。
なので、だいたいどの辺にどんな資料があるのか？特定の人だけが詳しいという状況に置かれていたわけです。
そこで、それらを効率的に整理し、情報に素早くアクセスするためのプログラミング言語としてティム博士はハイパーテキスト マークアップ ランゲージを開発したわけです。
HTMLとは？！
HTMLってよく聞くけどこれは一体なんなんでしょうか？
これはHyperText Markup Language（ハイパーテキスト マークアップ ランゲージ）というプログラミング言語の一種なんです。
プログラミング言語といっても、現代ではノーコードなども流行っており、GUI（グラフィック上で操作）が一般化し、ワードのように取り扱うことができるようになっています。
ですので、これから覚えようとする方はプログラミングを完璧主義的に覚える方以外はリーディングができれば問題ないかもしれません。
リーディングができないとこれはなんのタグなのか？
など自分の中で整理できないので、ゼロから全部書く必要はありませんが、概要は把握しておく必要があります。
→HTMLのリーディングだけサクッと習得する方法
HTMLなどもそうですが、必ずしもインターネット上のシステムという訳ではありません。
当然ローカルサーバーでHTMLをブラウザ表示する場合はアドレスにwwwは必要ありません。
→Arduino IDEのスケッチ例【HelloServer】を使ってみる
さて、話を戻しますと、HTMLの肝はこの↑↑↑リンクにあるわけです。
昔はハイパーリンクなどと言ったりしていましたが、聞いたことがないでしょうか？
つまり上記のM5Stackでホームサーバー接続するという情報にアクセスするためのリンクが肝になってきます。
例えば資料室の例で見ると・・・
「○○年代の○○の研究」→「研究結果をリンク」
「○○プロジェクトの総収益情報」→「総収益情報結果にリンク」
といった具合に資料整理していけるわけです。
もちろん当時はローカルネット上でのハイパーリンクになり、これのワールドワイド版、つまりwwwとなったのが、今現在私たちが使っているwebリンクシステムになります。
URL=住所
これもよく耳にするのではないでしょうか？
URLというのは一般的にはよく住所と例えられることが多いです。
これは、資料室の話で例えるなら「A列の３段目の46番目の資料の467ページ目」といった具合です。
実際にWEB上のURLもこのような分け方をしているのがドメインを取得すると分かってくると思います。
つまり、先ほどの「A列の３段目の46番目の資料の467ページ目」をKotaro Blog上で換算するなら「kotarohattori.comという場所の、プログラミングというカテゴリーの、Webサイト制作エリアの一個目の記事」が当記事のURLになります。
このように考えると簡単ですよね。
サイトの住所はわかりました。
しかし、今目にしているこのテキストデータはどこにあるのでしょうか？
このハイパーリンクは実はこのテキストデータを呼び出す注文ボタンなんです。
この呼び出しを実行するシステムをHTTPと言います。
サーバーから呼び出す
ですので、URLをブラウザに打つというのは実はC言語などの機械言語に似たようなところもあります。
HTTP=今からデータを呼び出しますよ（宣言） WWW=ローカルサーバーじゃなくてワールドワイドで（どうやって？） kotarohattori.com=この住所で
で注文します。
すると、自動的に筆者のテキストデータが格納されているサーバーからデータが呼び出されてみなさんのブラウザに表示されるわけです。
すべてのURLは把握できない・・・
データを呼び出す仕組みは理解できた。。。
だけど、すべての情報のURLを昭和の電話番号みたいに覚えるわけにはいきません。
200件や300件なら可能かもしれませんが、現時点で情報やHTMLデータは世界中に膨大すぎて、すでに人間が管理できる範囲をとっくに超えてしまいました。
そこで、人間の代わりに管理し、検索してくれるのが、Googlechromeや、safariなどのプラウザというアプリケーションです。
検索エンジンというシステムだにゃ！？
Googleクローラーと呼ばれるシステムがwww上にあるテキストデータを収集し、世界資料室を整理してくれています。
私たちはこの世界資料室に欲しい情報をブラウザに命令するだけでこんな資料がありましたよ？といって提供してくれるわけです。
もちろんハイパーリンクの仕組みはさきほどと同じです。
まとめ
WEBやHTMLは資料室の整理が起源で、その概念は今現在も変わっていない。
ブラウザというのは私たち一人一人に専属でついてくれている世界資料室の管理人スーパー頭脳の司書さんのような存在。
WEBサイトを制作するということは、誰かが探したいと思う資料を作るということ。
以上超簡単ですが、WEBの概念をまとめてみました。
これが分かればWEBサイトは完成したも同然です！
それでは次回から具体的にWEBサイトの制作に入っていきましょう。
関連記事: