HTMLとは
HTML（Hyper Text Markup Language）とはWebページを作る際の基本的なページまたはそのマークアップ言語のこと。世に無数に存在するWebページの多くがこのHTMLファイルに記述されている言語に基づいて表示されている。なお、現在ではウェブサイトで活用されるページの形態としてCMSをはじめPHPファイルが使われることも多く、PHPがリクエストに応じて内容を返すことが出来ることから動的なファイルと呼ばれる一方で、HTMLはユーザーのリクエストに応じて内容を変更して表示させることが出来ないため、静的なファイルと呼ばれている。
概説
HTMLは言語の一種になり、主にホームページを作成するため各ページに記述されている言語になる。表示される仕組みとしてはファイル内に記述したタグなどの内容に沿ってブラウザが情報を表示する。
各タグはそれぞれの用途によって使い分けられるが、必ずしも所定のタグを使わなければ表示されないという訳ではなく、推奨されている使い方をせずとも綺麗に表示されることも多い。そのためHTMLは自由度の高い言語と言えるが、一方でその自由度が高さが逆にソースなどの管理を煩雑にしているという事もある。
HTMLは基本的に文章などをどのように表示させるかを伝えるための指示書のような位置づけになり、ファイルそれ自体が何らかの処理を行うものでは無い。また近年ではスマホの台頭によりWebページの高速化や軽量化が重視されており、HTMLはそれ単体では軽いため外部ファイルなど参照しない場合やスクリプトを多用しない構成であれば非常に高速に表示させることが可能となる。他では分析や外部サービスとの連携が求められることも多くなっており、現在HTMLに求められる領域は当初よりも拡大している。
これは例えば、フォントは以前まで各自の端末に設定してあるシステムフォントが主流だったため、見栄えを重視したホームページを作成するためにはサーバ側に別途用意する必要があったが、現在ではWebフォントなどが多く開発され、さらに容易に連携できるようになった事から、HTMLのみで表現をするウェブサイトも増加している。またアプリケーションが増加している事もあり、ウェブページにも似た要素が求められており、外部のプログラムファイル等を使わずに表現出来るように新しいバージョンであるHTML5では動的な表現を行えるAPIが新しく追加されている。
なお、HTMLを表示するためのファイルはメモ帳などでも作る事が可能で、作成したファイルの拡張子を「.html」に指定すればhtmlファイルとしてシステムは認識する。
HTMLで使われる主なタグ
HTMLは主にタグ（<>内に指定する）で指定された内容と文字や数字によって表現される。タグは開始と終了にそれぞれ必要となり、間違ってしまうとエラーになってしまうので注意が必要。使いかたとしては開始タグと終了タグを記述してその間に文章など文章やデータなどを記載する。例えば以下の場合先頭のpタグが開始タグになり、後ろのスラッシュ付きのpタグが終了タグになる。<p>おはようございます。</p>
文書構造
<!DOCTYPEタグ>ドキュメントのタイプを宣言する
<HTMLタグ>HTML文書ということを宣言する
<HEADタグ>文書のヘッダー情報
<METAタグ>文書に関する情報
<TITLEタグ>文章のタイトル
<BODYタグ>文書の本体部分
<H1タグ>大見出し（heading1）
<H2タグ>中見出し（heading2）
<H3タグ>小見出し1（heading3）
<H4タグ>小見出し2（heading4）
<H5タグ>小見出し3（heading5）
<H6タグ>小見出し4（heading6）
<Pタグ>段落を示す
<DIVタグ>範囲を指定する：ブロック要素
<SPANタグ>範囲を指定する：インライン要素
スタイルシート
<STYLEタグ>スタイルシートを記述する
スクリプト
<SCRIPTタグ>文書にスクリプトを埋め込む
<NOSCRIPTタグ>スクリプトが動作しない環境用の表示内容を設定する
リスト
<OLタグ>順序のあるリストを表示する
<ULタグ>順序のないリストを表示する
<LIタグ>リストの項目を記述する
<DLタグ>定義リストであることを表す
<DTタグ>定義する用語を示す
<DDタグ>定義した用語を説明する
<DIRタグ>リストを表示する
<MENUタグ>メニューリストを示す
文字
<FONTタグ>フォントの種類を設定する
<Bタグ>文字太字にする
<Iタグ>文字を斜体にする
<Uタグ>文字に下線を引く
<Sタグ>打ち消し線を引く
<BRタグ>改行する
<STRONGタグ>強調する
<ADDRESSタグ>連絡先を示す
<BLOCKQUOTEタグ>引用または転載を示す
<CITEタグ>出典・参照先を示す
リンク
<Aタグ>リンクを設定する
画像や動画などの埋め込み
<IMGタグ>画像表示する
<EMBEDタグ>プラグインのデータの埋め込み
<OBJECTタグ>文書にデータを埋め込む
表
<TABLEタグ>テーブル表を作る
<TRタグ>テーブル表の一行を示す
<THタグ>テーブル表の見出しを設定する
<TDタグ>テーブル表のデータを設定する
<THEADタグ>テーブル表のヘッダ行を設定する
<TFOOTタグ>テーブル表のフッタ行を設定する
<TBODYタグ>テーブル表のボディ部分を設定する
<CAPTIONタグ>テーブル表に補足説明を設定する
<COLタグ>テーブル表の縦列をまとめる
<COLGROUPタグ>テーブル表の縦列をグループ化する
<CENTERタグ>文字などを中央寄せにする
<HRタグ>横線を引く
フレーム
<IFRAMEタグ>インラインフレームを設定する
入力フォーム
<FORMタグ>入力・送信フォームを作る
<BUTTONタグ>ボタンを作る
<INPUTタグ>フォームの構成部品（入力欄・ボタン等）を作る
<INPUT type="submit">フォームの送信ボタン・リセットボタンを作る
<INPUT type="image">フォームの画像ボタンを作る
<INPUT type="button">フォームの汎用ボタンを作る
<INPUT type="text">一行文字ボックスを作る
<INPUT type="password">パスワード入力欄を作る
<INPUT type="radio">ラジオボタンを作る
<INPUT type="checkbox">チェックボックスを作る
<INPUT type="hidden">非表示データを送信する
<INPUT type="file">サーバにファイルを送信する
<SELECTタグ>セレクトボックスを作る
<OPTGROUPタグ>セレクトボックスの選択肢をグループ化する
<OPTIONタグ>セレクトボックスの選択肢を設定する
<TEXTAREAタグ>複数行の入力フィールドを作る
<LEGENDタグ>フォームの入力項目グループにタイトルを付ける
<FIELDSETタグ>フォームの入力項目をグループ化する
<LABELタグ>フォーム部品と項目名（ラベル）を関連付ける
<ISINDEXタグ>検索キーワードの入力欄を作る
コメントアウト
<!- -->ソースを残しつつ無効する際に使用する
