HTML

HTML について

 HTML について学ぶサイトです。手っ取り早く学びたい場合は「HTML の基本構造」から進んでください。

HTML って何?

Web ブラウザについて

HTML の歴史

文字コードについて

HTML の基本構造

HTML Learner


HTML って何?

 HTMLは HyperText Markup Language の略です。
 「HyperText(ハイパーテキスト)」とは、ウェブページから別なページに、ウェブサイト内でもウェブサイト間でも、移動できる機能であるリンクを持った文章のことです。リンクはウェブの基礎的な特徴です。このリンクのことをハイパーリンクと呼びます。
 「Markup(マークアップ)」とは、文書やデータなどの中に、文書の構造や意味を示すために挿入される印や符号のことです。HTMLなどのマークアップ言語では、タグと呼ばれるマークアップが使われます。
 文書の構造とは、タイトルや見出し、画像、リンクなどのことです。
 HTML 要素は文書中で、 "<" および ">" で囲まれた要素名で構成される「タグ」によって区別されます。タグ内の要素名は、大文字と小文字の区別がありません。つまり、大文字でも、小文字でも、混在して書いても構いません。例えば、 <title> タグは <Title> や <TITLE> やその他の方法で書くことができます。ただし、タグは小文字で書くのが一般的です。
 また、<meta charset="utf-8"> のように属性(タグに属性を付加したもの)を必要とするものもあります。<タグ 属性="属性値"> のように書きます。

Web ブラウザについて

 Webブラウザとは、Webページを閲覧するためのアプリケーションソフトです。利用者の指定したWebページを管理するWebサーバーへデータの送信を要求し、送られてきたHTMLファイルや画像ファイルなどを読み込んで指定されたレイアウトで表示します。
 Web ブラウザには、Google ChromeApple SafariMicrosoft EdgeMozilla Firefox などがあります。

HTML の歴史

 HTML は 1989 年にCERN(欧州原子核研究機構)のティム・バーナーズ=リーが Web と基盤となる WWW (World Wide Web) を作成しているときに記述言語として生まれました。1990 年に WWW プロジェクトとして公開され、 1993 年に HTML 1.0 が勧告されています。現在は、HTML Living Standard が最新バージョンとなっています。以下は、バージョンの変移のみを示します。詳細は、「HTML Living StandardとHTMLの歴史」に詳しく書かれています。
  • 1989年:HTML誕生
  • 1993年:HTML 1.0 が IETF により勧告される。
  • 1995年:HTML 2.0 が IETF により勧告される。
  • 1997年:HTML 3.0 が IETF により仕様策定がされていたが頓挫し、W3C が策定した HTML3.2 が勧告される。
  • 1997年:HTML 4.0 が W3C により勧告される。
  • 1999年:HTML 4.01 が W3C により勧告される。
  • 2000年以降、 W3C が HTML の後継となる XHTML などの策定を進めるが、理想を追い求め過ぎたため、2004 年に WHATWG(Web Hypertext Application Technology Working Group) が設立される。
  • 2008年:HTML 5 の草案が W3C から公開される。
  • 2011年:HTML Living Standard が WHATWG から開始される。
  • 2014年:HTML 5.0 が W3C から勧告される。
  • 2016年:HTML 5.1 が W3C から勧告される。
  • 2017年:HTML 5.2 が W3C から勧告される。
  • 2019年:主要ブラウザが HTML 5.X ではなく HTML Living Standard に準拠し始めたため、 W3C は2019年5月28日に標準化を断念。
  • 2021年1月28日:W3C の HTML 関連の仕様はすべて廃止され、WHATWG のHTML Living Standard に完全統一される。

文字コードについて

 文字コードとは、コンピュータで文字を扱うために文字に番号付けを行ったものです。HTML はともかくコンピュータの規格もアメリカを中心に英語圏で作られてきたため、日本語等の言語を使うように想定されていませんでした。そこで、ISO/IEC 2022 と呼ばれる規格が1973年に定められましたが、各言語間の差(例えば、日本語と中国語の漢字)を埋めることを想定していなかっため、文字の重複や言語間の切替の必要などの問題がありました。そこで生まれたのが Unicode(ISO/IEC 10646、第1版は1991年)が定められました。現在は、10万を超える世界中の様々な言語の文字が1つのコード体系にまとまっています。
 Unicode には文字符号化方式が大きく分けて UTF-8,、UTF-16、UTF-32 の3種類あり、最近のコンピュータは、その中で一番扱いやすい UTF-8 で処理を行っているものが殆どです。
 そのため、HTML Living Standard では、「Authors must use the UTF-8 encoding 」として、UTF-8 を使うことを求めています。ただし、互換性のため、他の文字コードを使ってもよいとしています。
 UTF-8 以外では、ISO-2022-JP(JISコード)、Shift_JIS(シフトJIS)、EUC-JP などがあります。これらの文字コードは、現代のコンピュータでは殆ど使われることはありませんが、電子メールは ISO-2022-JP を使って送受信することが多く、多くのコンピュータがシステム上では UTF-8 を使っている関係で、メールが文字化けする原因にもなっています。そういった事情もあるため、余程の理由がない限り Web ページを作成する場合は UTF-8 を使うべきでしょう。

HTML の基本構造

HTML の基本的な構造は以下のようになっています。それぞれの説明は後述します。

<!DOCTYPE html>
<html lang="ja">
 <head>
  <meta charset="utf-8">
  <title>ページタイトル</title>
 </head>
 <body>
  Webページ本体部分
 </body>
</html>
		  			
 
  • <!DOCTYPE html> は一番上に書く決まりになっています。これは長い HTML の歴史の中で、色々な HTML のバージョンの差異を埋めるために考案されたものです。今では、バージョンが関係なくなりましたが、このように書かないとブラウザが古い HTML バージョンと認識することもあるので、書く決まりになっています。
  • html タグ内の lang="ja" は日本語のページであることを示しています。
  • head タグで挟まれた部分は、Web ページについて内容以外の部分を入れます。
  • meta タグ内の charset="utf-8" は Web ページ内の文字コードが UTF-8 であることを示しています。
  • title タグで挟まれた部分にページタイトルを入れます。ページタイトルは、ブラウザのタブに表示されたり、ブックマークに登録した際のタイトルに利用されます。
  • body タグで挟まれた部分に Webページの内容を記載します。HTML Learner はこの body タグで挟まれた部分のみを学ぶためのツールです。