Summary  
The chapter explains how to use HTML `<button>` elements—including standard, submit, and reset types—to trigger different actions on a webpage.  

General domain of usage  
Interactive web forms

`<button>` タグは、ウェブページ上にクリック可能なボタンを作成。ユーザーがフォームの送信や JavaScript コードの実行などのアクションを実行するためのインタラクションを提供。JavaScript については本コースでは扱わないが、そのような機能が存在することを理解しておくことが重要。

### ボタンの種類
- **標準ボタン**（`<button type="button">`）：ウェブページ上でさまざまなアクション（JavaScript 関数の実行や他ページへの遷移など）に使用される汎用ボタン；
- **送信ボタン**（`<button type="submit">`）：フォーム内で使用され、フォームデータをサーバーに送信；
- **リセットボタン**（`<button type="reset">`）：フォーム内で使用され、フォームのフィールドを初期値にリセット。

**例**：

PCFET0NUWVBFIGh0bWw+CjxodG1sPgogIDxoZWFkPgogICAgPHRpdGxlPkJ1dHRvbnM8L3RpdGxlPgogICAgPG1ldGEgY2hhcnNldD0iVVRGLTgiIC8+CiAgPC9oZWFkPgogIDxib2R5PgogICAgPGJ1dHRvbiB0eXBlPSJidXR0b24iIG9uY2xpY2s9ImFsZXJ0KCdIZWxsbyEnKSI+Q2xpY2sgTWU8L2J1dHRvbj4KICAgIDxidXR0b24gdHlwZT0ic3VibWl0Ij5TdWJtaXQgRm9ybTwvYnV0dG9uPgogICAgPGJ1dHRvbiB0eXBlPSJyZXNldCI+UmVzZXQgRm9ybTwvYnV0dG9uPgogIDwvYm9keT4KPC9odG1sPg==

上記の例では：
- 最初のボタンは、クリック時にアラートを表示する `onclick` 属性を持つ標準的なボタン。
- 2番目のボタンは、フォームデータをサーバーに送信する送信ボタン。
- 3番目のボタンは、フォームのフィールドを初期値にリセットするリセットボタン。

`<button type="submit">` タグは何をしますか？

HTMLの基本を習得し、構造化され、アクセシブルなウェブコンテンツを作成します。タグ、要素、属性を使用してドキュメントを構造化する方法を学びます。テキスト、リスト、画像、音声、動画を自在に扱い、ウェブページを充実させます。整理されたデータのためのテーブルや、ユーザー入力・インタラクションのためのフォームを作成します。アクセシビリティを高めるセマンティックHTMLを理解し、基礎から完全で機能的なウェブサイト構造を構築します。

ウェブとHTMLの概要、タグ、要素、属性の重要性について紹介します。HTMLドキュメントの基本構造やウェブの簡単な歴史について学びます。

HTMLマークアップの基本を習得し、特別なテキストのフォーマットやリストに焦点を当て、HTMLドキュメント内でのコンテンツ構造化における重要性を理解します。HTMLドキュメント構造の詳細に踏み込み、テキストマークアップ技術を洗練させます。

ウェブ開発における視覚および聴覚コンテンツの力を引き出し、画像、動画、音声要素をHTMLドキュメントにシームレスに統合する方法を学びます。さまざまなメディア形式を取り入れる際の細かな違いについて探求します。

HTMLにおけるテーブルとフォームの包括的な解説を通じて、データの提示方法やユーザーインタラクションの複雑さを理解します。テーブル構造、フォーム作成、入力要素を網羅しています。フォーム入力要素の実装や、機能性を高める属性の活用に習熟します。

セマンティックHTML要素を深く学ぶことで、HTMLスキルを次のレベルへ引き上げ、構造化されアクセシブルなウェブコンテンツの作成が可能になります。新たに得た知識を活用し、初めてのウェブサイト構築に挑戦し、アイデアを形にしましょう。

ボタンの使用

ボタンの種類