はじめに
今回は前回の記事Webの概要について丁寧にの続きでWeb技術の基本について更に知識を深めたいと思います。
今回の内容は
- HTMLとWebブラウザ
以上のキーワードについて説明したいと思います。
この記事のゴール
- HTML、ブラウザの言葉の意味を理解する
目次
1.世界共通言語のHTMLと人に優しいWebブラウザ
2.まとめ
1. 世界共通言語のHTMLと人に優しいWebブラウザ
前回の記事でWebページはハイパーテキストという言語で作られているというお話をしました。
このハイパーテキストの正体が実は**HTML(Hyper Text Markup Language)**なのです。
HTMLではタグというマークを使って文章に意味づけをしていきます。
具体的には下記の通りに記述します。
↓
ルール：「〈開始タグ〉文章〈/終了タグ〉」
具体例：「〈title〉Web技術の基本〈/title〉」
上のルールのように開始タグと終了タグで文章をはさむと意味づけをすることができます具体例では、このページのタイトルは「Web技術の基本」であることを意味します。
もちろんこれだけではイメージがつかないと思いますので、ここでは他に見出しタグの紹介をしてきたいと思います！
1-1. 見出しタグの紹介
文章には必ずある大見出しはh1というタグで表します。
下の例でも、開始タグと終了タグで文章をはさんでいますね！
<h1>これは大見出しです</h1>
また、見出しの大きさを段階的に変えることもできます。
現在のHTMLの仕様では6段階まで設定可能です！
<h1>これは大見出しです</h1>
<h2>これは見出しです</h2>
<h3>これは見出しです</h3>
<h4>これは見出しです</h4>
<h5>これは見出しです</h5>
<h6>これは見出しです</h6>
実際には下のように画面に表示されます
これは大見出しです
これは見出しです
これは見出しです
これは見出しです
これは見出しです
これは見出しです
他にも画像を表示させるimgタグやリンクを貼るためのaタグなど種類がたくさんあります。
このようにタグによって文章に意味づけをしながら記述をしていくのがHTMLです。
1-2. 人に優しいWebブラウザ
HTMLつまり、ハイパーテキストで書かれた文章は先程説明した通り、タグによって意味づけされている独自のものなので人間が読むにはあまりにも読みづらいです。
フランス語を知らない日本人がフランス人に話しかられても意味が理解できない状況と同じです
そこで登場するのがWebブラウザという翻訳家です。
Webブラウザは人間が理解しやすいようにハイパーテキストを翻訳してくれるプログラムのことなんです！
Webブラウザには種類がいくつかあって、一般に使われているものだと
Google ChromeやSafari、Internet Explorer、Firefoxなどが挙げられます。
Webブラウザの種類によって情報の表示の方法に多少の違いがあるのですが
HTMLは世界共通言語なので、基本的にはどのブラウザでも同じように情報を表示させる事ができるというわけです。
2. まとめ
Webページを構成するHTMLとそれを人間が理解できるように解釈してくれるWebブラウザについて理解が深められたでしょうか。
次回はWebページがどのようにして表示されるかその一連の流れについてまとめたいと思います！
- WebページはHTMLで記述される
- HTMLはタグによって文章に意味づけをしていく
- HTMLを人間にわかりやすいよに翻訳してくれるプログラムがWebブラウザである
以上です！最後まで読んでいただきありがとうございます。
お疲れ様でした。。