HTML5

HTMLとは？

1. HTMLとは？

HTML（HyperText Markup Language）は、Webページのコンテンツ（内容）と構造を記述するためのマークアップ言語です 1。プログラミング言語とは異なり、変数や関数といった処理を行う機能はありません。タグと呼ばれる目印を使って、文書の要素に意味を与えます 2。

Webページは、主に以下の3つの要素で構成されています。

•HTML：ページの構造とコンテンツを定義する（骨組み）。

•CSS：ページの見た目（デザイン、レイアウト）を定義する（装飾）。

•JavaScript：ページに動き（インタラクティブな機能）を定義する（動作）。

HTMLは、Webページの土台となる骨組みを作る役割を担っています。

HTML5について

HTML5は、HTMLの最新バージョンです 3。従来のHTMLに比べて、以下のような点が強化されています。

•マルチメディア対応の強化：<video>や<audio>タグが追加され、プラグインなしで動画や音声を扱えるようになりました。

•セマンティック要素の追加：<header>、<nav>、<section>、<article>、<footer>などのタグが追加され、文書の構造をより意味的に（セマンティックに）記述できるようになりました 4。これにより、検索エンジンや支援技術（スクリーンリーダーなど）がコンテンツの内容を理解しやすくなります。

•新しいAPIの追加：オフラインでのデータ保存（Web Storage）や、位置情報（Geolocation API）など、Webアプリケーション開発に役立つ機能が追加されました。

2. HTMLの基本構造

すべてのHTML文書は、以下の基本的な構造を持っています。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ページのタイトル</title>
</head>
<body>
<!-- ここにWebページに表示されるコンテンツを記述します -->
</body>
</html>

要素	役割
<!DOCTYPE html>	文書がHTML5で書かれていることをブラウザに伝えます。必ず文書の先頭に記述します。
<html>	HTML文書のルート（根幹）要素です。すべてのHTML要素は、このタグの中に記述されます。
<head>	Webページ自体に関する情報（メタデータ）を記述する部分です。ブラウザには直接表示されません。
<meta charset=”UTF-8″>	文字コードを指定します。日本語を正しく表示するために必須です。
<title>	ブラウザのタブやウィンドウのタイトルバーに表示されるテキストを指定します。
<body>	Webページに実際に表示されるすべてのコンテンツ（テキスト、画像、リンクなど）を記述する部分です。

3. HTMLの基本文法：タグと要素

HTMLは、タグを使ってコンテンツを要素としてマークアップします。

タグと要素の基本

•タグ：<p>や</p>のように、<と>で囲まれたキーワードです。

•要素：開始タグ、内容、終了タグの全体を指します。

•属性：タグに追加情報を与えるもので、開始タグの中に記述します。

•例: <img src=”image.jpg” alt=”画像の説明”>

主要なHTMLタグ

タグ	役割	使用例
<h1>〜<h6>	見出し（数字が小さいほど重要度が高い）	<h1>大見出し</h1>
<p>	段落	<p>これは一つの段落です。</p>
<a>	ハイパーリンク（他のページへの移動）	<a href=”https://example.com”>リンク先</a>
<img>	画像の表示（終了タグ不要）	<img src=”image.jpg” alt=”風景写真”>
<ul>	順序なしリスト（箇条書き）	<ul><li>項目1</li></ul>
<ol>	順序付きリスト（番号付き）	<ol><li>項目1</li></ol>
<li>	リストの項目	<li>リストの項目</li>
<div>	ブロックレベルの汎用的なコンテナ	<div>グループ化されたコンテンツ</div>
<span>	インラインの汎用的なコンテナ	<span>一部のテキスト</span>