コメント
No title
私はここで少しずつ知識を得ています。なるほど～って感じで・・・
HTMLについて
- 2019/11/30
- 22:28
HTMLは"HyperText Markup Language"の略称でWebページを作るために制定された言語です。現在インターネット上で公開されているWebページの殆どはHTMLで作成されています。
"HyperText Markup Language"の"HyperText"は複数のテキストを関連付けることであり、具体的にいえばWebページ間のリンクやWebページに表示される画像や動画が相当します。
"Markup"は文章をコンピューターが理解できるように構造化してそれぞれに役割を与えてそれに応じて文章を表示させることでフォントの種類や大きさ、見出しや段落といった文書構造などが相当します。コンピューターが理解できる構造というものは重要で、HTMLの構造に沿って作成されたWebページは検索エンジンのクローラーなどに注目されやすくなります。
現在の最新のHTMLはHTML5です。（更にいえばHTML5.2が策定されています。）現在の主要なブラウザもHTML5に対応しています。今からWeb技術について学ぶのならHTML5を学ぶといいでしょう。
HTML5は具体的に以下のような文章になります。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>料理</title>
</head>
<body>
<h1>今日の料理</h1>
<p>今日の料理は<i>カレー</i>です</p>
</body>
</html>
適当なテキストエディタなどにコピーして貼り付けてHTML形式で保存（もしくテキストエディタで作成したファイルの拡張子を.htmlに変更）すればHTML5の文章ができます。
HTML文章はどのような構造なのかを以上の文章を具体例として見ていきます。
まずはHTMLの宣言が必要になります。
<!DOCTYPE html> の部分です。
この部分でこのファイルをHTMLの文章だと認識されます。
今回の宣言ではこの文章はHTML5で書かれているとしています。
<html lang="ja">と</html>で囲われた部分はhtml要素というもので、この部分で囲われた範囲がHTMLのコードであることを示します。
lang="ja"はこの文章が日本語であることを示しています。
<head>と</head>で囲われた部分はhead要素というもので、このHTMLのWebページとしての情報や設定を書きます。
今回は
<meta charset="utf-8">：文字コード
<title>料理</title>：タイトル（ブラウザのタブなどに表記されるタイトル）
となっています。
基本的にこの部分の内容はブラウザの画面内に表示されません。
<body>と</body>に囲われた部分はbody要素というもので、実際にブラウザの画面に表示される部分が書かれます。
今回は
<h1>今日の料理</h1>：見出し
<p>今日の料理は<i>カレー</i>です</p>：文章の段落
<i>カレー</i>：イタリック表記
となっています。
HTMLは<>（開始タグ）から</ >（終了タグ）で囲んでその中にさらに別の<>～</ >で囲んだ要素を入れるといった特徴がありますがこれを階層構造（ツリー構造とも）といいます。
たとえば上記の<p>今日の料理は<i>カレー</i>です</p>は<p>と</p>の間に<i>と</i>が入る構造がそれに相当します。
また空要素と呼ばれる終了タグがないタグもあります。
"HyperText Markup Language"の"HyperText"は複数のテキストを関連付けることであり、具体的にいえばWebページ間のリンクやWebページに表示される画像や動画が相当します。
"Markup"は文章をコンピューターが理解できるように構造化してそれぞれに役割を与えてそれに応じて文章を表示させることでフォントの種類や大きさ、見出しや段落といった文書構造などが相当します。コンピューターが理解できる構造というものは重要で、HTMLの構造に沿って作成されたWebページは検索エンジンのクローラーなどに注目されやすくなります。
現在の最新のHTMLはHTML5です。（更にいえばHTML5.2が策定されています。）現在の主要なブラウザもHTML5に対応しています。今からWeb技術について学ぶのならHTML5を学ぶといいでしょう。
HTML5は具体的に以下のような文章になります。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>料理</title>
</head>
<body>
<h1>今日の料理</h1>
<p>今日の料理は<i>カレー</i>です</p>
</body>
</html>
適当なテキストエディタなどにコピーして貼り付けてHTML形式で保存（もしくテキストエディタで作成したファイルの拡張子を.htmlに変更）すればHTML5の文章ができます。
HTML文章はどのような構造なのかを以上の文章を具体例として見ていきます。
まずはHTMLの宣言が必要になります。
<!DOCTYPE html> の部分です。
この部分でこのファイルをHTMLの文章だと認識されます。
今回の宣言ではこの文章はHTML5で書かれているとしています。
<html lang="ja">と</html>で囲われた部分はhtml要素というもので、この部分で囲われた範囲がHTMLのコードであることを示します。
lang="ja"はこの文章が日本語であることを示しています。
<head>と</head>で囲われた部分はhead要素というもので、このHTMLのWebページとしての情報や設定を書きます。
今回は
<meta charset="utf-8">：文字コード
<title>料理</title>：タイトル（ブラウザのタブなどに表記されるタイトル）
となっています。
基本的にこの部分の内容はブラウザの画面内に表示されません。
<body>と</body>に囲われた部分はbody要素というもので、実際にブラウザの画面に表示される部分が書かれます。
今回は
<h1>今日の料理</h1>：見出し
<p>今日の料理は<i>カレー</i>です</p>：文章の段落
<i>カレー</i>：イタリック表記
となっています。
HTMLは<>（開始タグ）から</ >（終了タグ）で囲んでその中にさらに別の<>～</ >で囲んだ要素を入れるといった特徴がありますがこれを階層構造（ツリー構造とも）といいます。
たとえば上記の<p>今日の料理は<i>カレー</i>です</p>は<p>と</p>の間に<i>と</i>が入る構造がそれに相当します。
また空要素と呼ばれる終了タグがないタグもあります。
スポンサーサイト
