HTML5

出典: フリー百科事典『ウィキペディア(Wikipedia)』
ナビゲーションに移動 検索に移動
Hyper Text Markup Language version5
HTML5-logo.svg
Html5-source-code.svg
Hyper Text Markup Language version5でのコード記述の例
(この場合、文字コードは、UTF-8が指定され、ブラウザーのページタイトル表示欄には、「HTML5 example」と表示され、本文には、「Text」と書かれる)
拡張子(HTML)
.html
.htm
(XML構文)
.xhtml
.xht
.xml
MIMEタイプ(HTML)
text/html
(XML構文)
application/xhtml+xml
application/xml
タイプコードTEXT
Hyper Text Markup Language
UTIpublic.html
開発者World Wide Web Consortium, WHATWG
種別マークアップ言語

HTML5(エイチティーエムエル・ファイブ)は、World Wide Web Consortium(W3C)が策定していたHyperText Markup Languageの5回目に当たる大幅な改定版である。現在はHTML Living Standardによって置き換えられている[1]

Web Hypertext Application Technology Working Group(WHATWG)によって2004年に定められたWeb Applications 1.0Web Forms 2.0を取り入れたものをベースとしている。W3Cの専門委員会により2008年1月22日にドラフト(草案)が発表され、2014年10月28日に HTML5 が勧告され[2]、2016年11月1日に HTML 5.1 が勧告され[3]、2017年12月14日に HTML 5.2 が勧告され[4]、2021年1月28日に廃止された。WHATWGによって策定されているHTML Living Standardが有効な後継規格として案内されている。[5]

改訂の主要目的のひとつとして、人間にも読解可能で、尚且つ、コンピュータやデバイス(ウェブブラウザ、構文解析器など)にも矛盾せず読解されるとともに最新のマルチメディアをサポートする言語に向上することである。HTML5ではHTMLだけでなくXHTMLDOMのHTML関係の部分、ECMAScriptAPIも追加になっている。

表記は、「HTML 5.1」のようにバージョン表記で小数点以下を含める場合はHTMLと5.1の間にスペースを入れ、「HTML5」のように小数点以下を含めない場合はHTMLと5の間にスペースを含めない表記法が採用されている[6]。過去のバージョンについても、「HTML4」や「HTML 4.0」という表記法が使われている。

概要[編集]

HTML5は、プロプライエタリプラグインとして提供されているリッチインターネットアプリケーションプラットフォームを置き換えることを標榜しており、ウェブアプリケーションのプラットフォームとしての機能やマルチメディア要素が実装されている[7][8]。このため、Adobe Flashなどはサービスを終了することとなった(後述)。

2008年以降に発表されたウェブブラウザの多くはHTML5に対応している。Google Chrome 3.0以降、Safari 3.1以降、Firefox 3.5以降、Opera 10.5、Internet Explorer 9などであり主にaudio要素video要素canvas要素への対応が優先して行われた。またWebSocketなど、当初HTML5の一部とされていたものの切り離され別の規格として策定作業が進められているものがある。

広義のHTML5[編集]

厳密には別仕様書として分離されているものの、一般的には、ウェブストレージWebSocket・Geolocation API・XMLHttpRequest Level 2などもHTML5に含める場合が多い。

W3CのHTML5 Logoでは以下のカテゴリをHTML5に含めている[9]

  • セマンティックス - HTML5の新タグ、RDFa、マイクロデータ、マイクロフォーマット
  • オフラインとストレージ - App Cache、Web Storage、Indexed Database API、File API
  • デバイスアクセス - Geolocation API、マイク・カメラ、アドレス帳・カレンダー、端末の向き
  • 接続性 - WebSocket、Server-Sent Events
  • マルチメディア - audio要素、video要素
  • 3D、グラフィックス、エフェクト - SVGcanvas要素WebGL、CSS3 3D
  • パフォーマンスと統合 - Web Workers、XMLHttpRequest Level 2
  • CSS3 - Webフォントも含む

W3C[編集]

規格 初版草案[10] 最終草案[11] 勧告候補[12] 勧告案[13] 勧告[14]
HTML 5.0 2008年1月22日 2011年5月25日 2014年6月17日[15] 2014年9月16日 2014年10月28日
HTML 5.1 2012年12月17日 2016年6月2日[16] 2016年6月21日 2016年9月15日 2016年11月1日
HTML 5.1 2nd Edition 2016年11月1日[17] 2017年6月20日 2017年8月3日 2017年10月3日
HTML 5.2 2016年8月18日 2017年7月18日[18] 2017年8月8日 2017年11月02日 2017年12月14日[19]
HTML 5.3 2017年12月14日[20][21][22]

HTML Living Standard[編集]

HTML Living Standardは、WHATWGが策定しているHTMLの規格である。W3Cの勧告するHTML5およびそれ以降(HTML 5.1など)は、HTML Living Standardを基にしている。

ただし、2019年5月28日に発表されたW3CとWHATWGの合意[23]以前においては、「W3C側で変更がなされており、両者の仕様には差異が生じている[24][25]」という状況が続いていた。WHATWGはウェブブラウザの開発元により結成されており、この頃においてはHTML Living Standardの方がよく参照されていた[26][27]

2019年5月28日、W3CとWHATWGは、「HTML Living StandardをHTMLとDOMの唯一の標準とし、W3Cは今後HTMLとDOMに関する標準の策定を行わない」旨合意したことを発表した[23]。以降はHTML Living Standardが唯一の標準規格となり、ある時点におけるHTML Living StandardのレビュードラフトがそのままW3Cの勧告候補や勧告となる。2021年1月29日、WHATWGにあるHTML Review DraftがW3Cによって勧告されたことによって2021年5月現在、有効なHTMLの標準規格はHTML Living Standardのみとなっている[28]

技術仕様[編集]

エンコーディング[編集]

文書の文字コードにはUTF-8を推奨している。文書の文字コードの指定は、meta要素におけるcharset属性で指定する。これとHTTPレスポンスヘッダーのcontent-typeでエンコード宣言が省略された場合はUTF-8が既定となる。またcharset属性を含めたmeta要素は文章先頭から1024バイト以内に記載する必要がある[29]

文書の構造[編集]

従来のHTMLやXHTML規格は、仕様に書かれた文書構造のルールだけではなく、妥当性検証のためのDTD(およびそのほかのスキーマ)を提供していた。一方、HTML5仕様ではスキーマは提供されない。文書構造のために提供されるのはHTML5仕様に列挙されている各種ルールのみである。

従来のHTMLとの文法の差異[編集]

HTML5仕様は以下のふたつの構文を採用している。

  • HTML5仕様書の中で定義されるHTML構文 → 狭義のHTML5
  • HTML5仕様書からXMLおよびその関連仕様を参照して定めているXML構文

一方、従来のHTML仕様はSGMLをその構文に採用している。SGMLおよびその関連仕様を参照しており、規格ごとに以下のような差異もある。

  • SGML規格本体のみを参照しているもの → HTML 4.0以前
  • SGML規格本体および付属書J、付属書Kを参照しているもの → HTML 4.01や、ISO/IEC 15445など

主にこのような違いのために、HTML5と従来のHTMLとの間には基本的な文法の差異が多い。以下にその代表的な例を挙げる。

SGML宣言[編集]

SGMLを採用していた従来のHTML規格においては、HTML文書は本質的にSGML文書であったため、HTML規格がそれぞれ提供するSGML宣言を文書の先頭に記述することが仕様上許されていた。一方HTML5の仕様では、HTML構文、XML構文のいずれを用いた場合でも、文書中にSGML宣言を記述することは許されていない。

文書型宣言およびDTDの扱い[編集]

HTML5仕様においては、文書型宣言はもはやモード指定以外の意味をなさず、その書式は “<!DOCTYPE html>” である。

HTML構文では文書型宣言は必須である。XML構文では、HTML5で導入される新しい機能を利用する場合は必須、それ以外の場合は文書型宣言は必須ではない。

従来のHTML規格で提供されていたDTDがなくなり、また文書型宣言の書式が決まっているため、HTML5ではDTDが利用できず、DTDに依存する多くの機能のほとんどが扱えなくなる。例としては、HTML4以前に扱えていた文字実体参照のほとんどがHTML5では扱えなくなる(XMLは文書内部にDTDを書くこともできるが、上記の文書型宣言の決まりを無視する結果となるため、HTML5の仕様の範疇ではない)。

処理命令[編集]

SGMLを採用していた従来のHTML規格では、文書内に処理命令を記述することができた。実際に用いられている例として、DTDを他の処理系で利用するための「architectural support declaration」が存在する (ISO/IEC 15445)。

一方、HTML5仕様におけるHTML構文ではSGMLの処理命令は記述できず、同様の機能も利用できない。XML構文であればXMLの処理命令は書ける。

マーク区間[編集]

SGMLを採用していた従来のHTML規格では、マーク区間 (marked section) と呼ばれる仕組みが利用できた。以下に例を挙げる。

<!DOCTYPE HTML PUBLIC "ISO/IEC 15445:2000//DTD HTML//EN">
<html><head><title>...</title></head>
  <body>
    <p><![INCLUDE[ INCLUDE...マーク区間宣言がない場合と同じように解釈される ]]></p>
    <p><![IGNORE[  IGNORE ...マーク区間の中身を無視される ]]></p>
    <p><![RCDATA[  RCDATA ...マーク区間の中身がRCDATAとして処理される ]]></p>
    <p><![CDATA[   CDATA  ...マーク区間の中身がCDATAとして処理される ]]></p>
    <p><![TEMP[    TEMP   ...マーク区間の中身が一時的なものとして扱われる ]]></p>
  </body>
</html>

上に挙げた例のうち、HTML5仕様で利用できるのはCDATAセクションのみである。

コメントと注釈宣言[編集]

SGMLのコメントは「-- コメント文 --」という形を取り、マーク宣言中の空白文字の出現が許されている場所に任意の回数書くことができる。したがって従来のHTMLでは文書型宣言の中などでもコメントを挿入することが可能で、例えばISO/IEC 15445の文書型宣言は

<!DOCTYPE HTML PUBLIC "ISO/IEC 15445:2000//DTD HTML//EN" --コメント-->

のようにも書ける。一方、HTML5の文書型宣言にはコメントを挿入することはできない。

また、注釈宣言の扱いも従来のHTMLとHTML5では異なる。SGMLを採用していた従来のHTMLでは注釈宣言の中に任意の回数コメントを書くことができるが、HTML5ではHTML構文でもXML構文でもこのような書き方は認められていない。また、従来のHTMLでは注釈宣言内の最後のコメントと終了区切り子の間に空白文字を挿入することもできたが、HTML5ではこのような書き方も認められていない。

<!--コメント1-- --コメント2-- --HTML5ではこのような注釈宣言は書けない-->
<!-- この注釈宣言の書き方もHTML5では不可能--  >

終了区切り子の省略[編集]

SGMLをもとにした従来のHTMLでは、タグやマーク宣言の終了区切り子「>」が、文字列「<」「</」の直前に存在する場合、その終了区切り子「>」を省略することが仕様の上では許されていた[30]。HTML5では終了区切り子の省略はできない。

<!DOCTYPE HTML PUBLIC "ISO/IEC 15445:2000//DTD HTML//EN">
<html<head<title>Sample</title</head>
<body<p>「閉じないタグ」の例。終了区切り子が省略されている</p</body</html>

空タグ[編集]

SGMLにおける空タグとは要素型名などが書かれていない空っぽのタグのことである。従来のHTMLでは空タグの存在を許しており、利用できる場所は限られるが、空開始タグ「<>」と空終了タグ「</>」が仕様の上では記述できる。一方、HTML5では空タグを利用することはできない。

簡略終了タグ[編集]

SGML規格には、NET(簡略終了タグ)と呼ばれる仕組みが存在する。従来のHTMLでのNETは「/」であり、仕様上では、 「<p>文章</p>」という記述を「<p/文章/」と書くような記法が許されていた。

一方のHTML5に簡略終了タグという仕組みはない。ただし、後述する空要素の開始タグを "<br />" などと記述する方法は、(従来のSGMLの立場では)NETを利用したものと解釈することはできる。XMLの空要素タグも、SGMLの立場からはNETおよび付属書KのNESTCを利用した記法であると解釈できる。

空要素のタグ[編集]

従来のSGMLおよびHTMLにおける空要素は、DTDで内容モデルを空 (EMPTY) と決められた要素のことである(例:br要素)[31]従来のHTMLでは、空要素の終了タグを書くことは許されていない[32]。よって例えば、br要素のタグを「<br />」や「<br></br>」のように記述することもできない。

HTML5のHTML構文における空要素は、内容を含むことができない要素のことである[33]。空要素はその開始タグを「>」「/>」のいずれかで閉じることができる。例を挙げると、br要素のタグは「<br>」と記述するほかに、XML構文のように「<br />」と記述することもできる。ただし空要素の終了タグを書くことはできない[34]。また、このような記法が許されるのは空要素または外部要素 (foreign element) のタグのみで、その他の要素の開始タグは「>」で閉じねばならない。例えば、HTML5のHTML構文では内容を含まないp要素を「<p />」のように書くことはできない。

XML仕様においては、空要素 は内容を含まない要素のことである[35]。HTML5のXML構文では、空要素は直後に終了タグを伴う開始タグ(例:「<br></br>」)、あるいは空要素タグ(例:「<br />」)のどちらでも表現できる。

HTML5 の要素と属性[編集]

nav要素(ナビゲーションのブロック用)やfooter要素(作者や著作権の状態を表すまとまり用)やsection要素(節)やprogress要素(進捗状況)など、特別な意味を持つ要素が追加される。これらは検索エンジンのインデックス作業を容易にする。また、マルチメディアのためのaudio要素やvideo要素や2次元ビットマップ画像を描画するためのcanvas要素も追加される。

HTML 4.01で非推奨だったfont要素やcenter要素などのCSSによって実現されるべきマークアップはすべて廃止されることとしている。acronym要素も廃止され、abbr要素に一本化される。

lang属性は、XML構文におけるxml:lang属性のように空の文字列をとり得る。

新しいAPI[編集]

HTML5ではマークアップだけでなく、API も新しく追加された。たとえば、以下のようなものである。

  • ビデオやオーディオの再生
  • 保存
  • オフライン
  • 編集
  • ドラッグ&ドロップ
  • 戻るボタン
  • Webページ上のメニュー

エラーの取り扱い[編集]

HTML5 (text/html) 対応ブラウザは間違った構文を柔軟に処理できる。HTML5は、古いブラウザが新しいHTML5の構造を安全に無視することが出来るように設計されている。HTML 4.01とは対照的に、HTML5は対応したブラウザであれば間違った構文に対して同じ結果となるように、字句解析構文解析のための詳細な規則を規定している[36]

XML構文とXHTML5[編集]

今のXML構文に対して、当初「XHTML5」という表現も使用されていた[37][38]

その後、2016年、WHATWG HTML標準ではXHTMLという用語を廃止し[39][40]、それ以降は単にXML構文 (XML syntax)と表記している。これにより、W3C HTMLでもHTML 5.2から同様にXML構文の語を採用している。

既存技術との競合[編集]

Adobe Flash[編集]

2010年頃までに急速に普及したAppleiPhoneiPadがFlash非対応を貫き、スティーブ・ジョブズCEO(当時)がHTML5を支持しFlashを厳しく批判したことが大きな影響を与えた[41]。iPhoneやiPadにFlash対応を求める声は多かったが[42][43]、特にスマートフォン向けでは徐々にFlashからHTML5への転換が進んだ。

Flashの開発元であるアドビシステムズは、かつて社をあげてFlashを擁護したが[44][45][46]、2011年11月には、モバイルブラウザー用のFlash Playerの開発中止を発表した[47]。(2013年には担当者でCTOだったケビン・リンチがAppleへ転職[48])2017年現在、アドビはHTML5の推進に積極的であり、FlashからHTML5への変換ツールなどをリリースしている。

モバイルアプリケーション[編集]

スマートフォン向けのアプリの多くは、HTML5で開発されたウェブアプリケーションに置き換わるという見方がある。2011年にイギリスのフィナンシャル・タイムズ紙がHTML5による購読アプリを発表し注目を集めた[49][50]。アップルのApp Storeには審査や課金に関する制約が大きく、Androidでは1つのアプリで様々なハードウェア仕様に対応する必要があるが、Webアプリケーションではそれらの制約を受けない。一方で各端末向けの公式アプリストアで配布されるネイティブアプリにもメリットはあるため、2012年時点では置き換えが大きく進んでいるわけではない。加えて、Android端末とiOS端末ではネイティブアプリの開発に際し全く別個の開発環境を要求されるのに対し、HTML5はほぼ完全に共通の技術を使え、しかもHTML5で開発したアプリをネイティブアプリにすることも可能になっているためネイティブアプリ開発でHTML5が利用されることも少なくない。

video要素[編集]

脚注[編集]

[脚注の使い方]
  1. ^ W3C HTML”. www.w3.org. 2021年10月15日閲覧。
  2. ^ HTML5勧告–オープン・ウェブ・プラットフォームの重要なマイルストーンを達成
  3. ^ HTML 5.1 is a W3C Recommendation | W3C News
  4. ^ HTML 5.2 is done, HTML 5.3 is coming | W3C Blog
  5. ^ HTML Review Draft — Published 29 January 2020 is a W3C Recommendation | W3C News” (英語). 2021年6月21日閲覧。
  6. ^ The WHATWG Blog » Blog Archive » Spelling HTML5
  7. ^ “OperaのCEO:「HTML 5でFlashは不要になりつつある」”. CNET Japan. (2009年5月25日). http://japan.cnet.com/marketing/story/0,3800080523,20393688,00.htm 2012年5月30日閲覧。 
  8. ^ “Microsoft がAppleやGoogleと同調”Webの未来はHTML5だ”–IE固有仕様がやっと一掃へ”. TechCrunch Japan. (2010年5月1日). http://jp.techcrunch.com/archives/20100430microsoft-html5/ 2012年5月30日閲覧。 
  9. ^ W3C HTML5 Logo
  10. ^ : First Public Working Draft
  11. ^ : Last call working draft
  12. ^ : Candidate Recommendation
  13. ^ : Proposed Recommendation
  14. ^ : W3C Recommendation
  15. ^ 2014年4月29日版を勧告候補とした後、2014年6月17日に差し戻しを宣言して2014年7月31日版となる。Philippe le Hegaret (2014年6月17日). “HTML5: ON OUR WAY TO RECOMMENDATION”. W3C. 2020年8月8日閲覧。
  16. ^ 最終草案との記載はないが事実上の最終草案。
  17. ^ 内容はHTML 5.1勧告そのもの
  18. ^ 最終草案との記載はないが事実上の最終草案。
  19. ^ HTML 5.2 IS NOW A W3C RECOMMENDATION”. W3C (2017年12月14日). 2020年8月8日閲覧。
  20. ^ HTML 5.2 IS NOW A W3C RECOMMENDATION”. W3C (2017年12月14日). 2020年8月8日閲覧。
  21. ^ 草案(Working Draft; WD ワーキング・ドラフト)……2018年10月18日 - 2020年8月時点での最新版
  22. ^ HTML 5.3 W3C Working Draft, 18 October 2018”. W3C (2018年10月18日). 2020年8月8日閲覧。
  23. ^ a b 新野淳一 (2019年6月10日). “HTML標準仕様の策定についてW3CとWHATWGが合意 今後はWHATWGのリビングスタンダードが唯一のHTML標準仕様に”. ITmedia NEWS. 2020年3月20日閲覧。
  24. ^ 渡邉卓 (2017年1月1日). “2017年のWeb標準”. gihyo.jp » WEB+DESIGN STAGE » 一般記事 » 新春特別企画. 技術評論社. 2017年3月25日閲覧。
  25. ^ もんど (2016年10月21日). “W3Cのは『欠陥フォーク』!? HTMLスナップショット2016 ── HTML5 Conference 2016セッションレポート”. HTML5Experts.jp. 2017年3月25日閲覧。
  26. ^ Ito, Hayato. “六本木ではたらくソフトウェアエンジニアへのよくある質問とその答え (FAQ) (2015 - 2017) — hayato.io”. 2017年3月25日閲覧。 “私も含めて Chrome の開発者が参考にするのは W3C HTML5仕様ではなく WHATWG の HTML Living Standard です。”
  27. ^ 矢倉眞隆 (2015年11月25日). “まだぼやけているHTML5の将来、WHATWGとの二重管理のジレンマ。W3C TPAC 2015 - Publickey”. Publickey. 2017年3月25日閲覧。 “ブラウザベンダーの開発者の多くはフィードバックが仕様にすぐ反映されることからWHATWG HTMLや「Living Standard」と呼ばれるモデルを好んでいます。(中略)そのためマイクロソフトなどはWHATWGの仕様には直接的に関与していません。もっとも、マイクロソフトから「EdgeチームもWHATWG HTML仕様を参照しているので、(WHATWG HTMLに)特許ポリシーがあれば…」という発言があったのも事実です。”
  28. ^ HTML REVIEW DRAFT — PUBLISHED 29 JANUARY 2020 IS A W3C RECOMMENDATION”. W3C. 2021年5月21日閲覧。
  29. ^ 4.2.5.5. Specifying the document’s character encoding
  30. ^ 終了区切り子を省略したタグは「閉じないタグ」と呼ばれた。JIS X 4151 "閉じない開始タグ" "閉じない終了タグ"
  31. ^ ただし、単に内容がないだけの要素を空要素と呼ぶこともある。このため、単に内容がない要素との区別のために、SGMLの付属書Kなどでは強制空要素 (mandatorily empty element) という用語も使われる。
  32. ^ SGML規格に付属書Kが加わる以前には、空要素の終了タグを記述すること自体が禁止されており。また、付属書Kを参照したHTML 4.01やISO/IEC 15445 でも、HTML4以前と同様に空要素の終了タグを記述してはならないこととなった。またいずれのHTML規格でもNETは "/" だった。
  33. ^ 原文HTML5仕様 "Void elements can't have any contents (since there's no end tag, no content can be put between the start tag and the end tag)."
  34. ^ 原文HTML5仕様 "Void elements only have a start tag; end tags must not be specified for void elements"
  35. ^ 原文XML仕様 "An element with no content is said to be empty."
  36. ^ FAQ – WHATWG Wiki”. WHATWG. 2008年2月25日閲覧。
  37. ^ The WHATWG Blog » Blog Archive » XHTML5 in a nutshell
  38. ^ HTML 5 + XML = XHTML 5 | HTML5 Doctor
  39. ^ Refer to XML rather than XHTML syntax · whatwg/html@643d1bc” (英語). GitHub (2016年11月25日). 2021年4月17日閲覧。
  40. ^ Rename "XHTML parsing" etc to more-accurate "XML parsing" by sideshowbarker · Pull Request #2062 · whatwg/html” (英語). GitHub. 2021年4月17日閲覧。
  41. ^ “S・ジョブズ氏、「Flash」に対する考えを公開書簡で明らかに”. CNET Japan. (2010年4月30日). http://japan.cnet.com/news/ent/20412895/ 2012年5月30日閲覧。 
  42. ^ “iPadユーザーの9割が満足、一番の不満点は「Flash非対応」――米調査”. ITmedia. (2010年5月24日). http://www.itmedia.co.jp/news/articles/1005/24/news018.html 2012年5月30日閲覧。 
  43. ^ “スマートフォンの“Flash対応”ニーズ高く――MMD研究所調べ”. ITmedia. (2010年10月22日). http://www.itmedia.co.jp/promobile/articles/1010/22/news099.html 2012年5月30日閲覧。 
  44. ^ AdobeのCTOがFlash擁護 「HTML5があればFlashは不要」論に反論、ITmedia、2010年2月2日
  45. ^ アドビがFlash Catalystで考えていること HTML5はFlashの脅威か?エバンジェリストに聞いた
  46. ^ Flashは比べようもないほどHTML5より優れている
  47. ^ “アドビ、モバイル版「Flash Player」の開発を中止”. CNET Japan. (2011年11月10日). http://japan.cnet.com/news/service/35010339/ 2012年5月30日閲覧。 
  48. ^ Adobe CTO Kevin Lynch Headed to Apple
  49. ^ “英Financial TimesがHTML5アプリを公開、Appleのアプリ内課金を回避”. INTERNET Watch. (2011年6月8日). http://internet.watch.impress.co.jp/docs/news/20110608_451358.html 2012年5月30日閲覧。 
  50. ^ “Open Mobile Summit 2011 San Francisco:HTML5か、ネイティブアプリか、それが問題だ”. ITmedia. (2011年11月10日). http://www.itmedia.co.jp/promobile/articles/1111/10/news018.html 2012年5月30日閲覧。 

外部リンク[編集]

W3Cによる過去の版[編集]