HTML5とHTML Living Standardとは共にHTMLの規格で、それぞれW3C、WHATWGという組織が策定したHTMLの仕様となります。
この2つは6年ぐらい同時に存在していましたが、主要ブラウザがHTML Living Standardを標準仕様として採用したためHTML5は2021年に廃止となり、HTML Living Standardが現在の規格となりました。
今更ではありますが、今回はそのHTML Living Standardについて解説していきます。
HTML5とHTML Living Standardの違い
HTML5とHTML Living Standardは規格としての違いはほぼありません。
記述の仕方も一緒になりますので今までと特に変わりは無いものと思ってもらって大丈夫です。
一部、要素や属性の追加や廃止、変更がありますので解説していきます。
追加された要素
HTML Living Standardで追加された要素です。
| 要素名 | 用途 |
|---|---|
| <hgroup> | 見出しをグループ化する |
| <slot> | Shadow DOM内におけるスロット(データの挿入口)を表す |
変更された要素
HTML Living Standardで変更された要素です。
| 要素名 | 用途 |
|---|---|
| <cite> | タイトル以外を含むことはできず、作者名を含むことができなくなりました |
| <link> | rel属性の値がbody-okな値のみ、またはitemprop属性が指定されている時のみ、bodyの要素内に配置可能 |
| <meta> | itemprop属性を指定した場合はbody要素内に配置可能 |
| <style> | body要素内には配置不可 |
廃止された要素
HTML Living Standardで廃止された要素です。
| 要素名 | 用途 |
|---|---|
| <rb> | 操作メニューの項目を表す |
| <rtc> | 操作メニューの項目を表す |
追加された属性
HTML Living Standardで追加された属性です。
| 要素名 | 属性名 | 用途 |
|---|---|---|
| <a> | ping=”” | pingの送信先を指定 |
| <area> | ping=”” | pingの送信先を指定 |
| <body> | onmessageerror=”” | 文書がAPIから解読できないメッセージ受信した際に実行するスクリプト |
| <form> | rel=”” | 現在の文書から見たリンク先との関係を示す |
| <iframe> | allow=”” | 利用できるブラウザの機能を指定 |
| <img> | decoding=”” | 画像のデコード方式を指定 |
| <img> | loading=”” | 画像の読み込みのタイミングを指定 |
| <link> | as=”” | 先行して読み込む外部リソースの利用先を指定 |
| <link> | color=”” | Safariのページピンアイコンの色を指定 |
| <link> | disabled=”” | 外部スタイルシートへのリンクを無効化 |
| <link> | imagesizes=”” | 画像を表示するサイズ |
| <link> | imagesrcset=”” | 使用可能な画像ファイルのセット |
| <link> | integrity=”” | 外部リソースとの整合性を確認 |
| <script> | integrity=”” | 外部スクリプトとの整合性を確認 |
| <script> | nomodule=”” | モジュールスクリプトの対応環境でスクリプトを無効化 |
| <script> | referrerpolicy=”” | リファラーポリシーを指定 |
| <video> | playsinline=”” | インラインで再生 |
全てのHTML要素に追加されたグローバル属性
| 属性名 | 用途 |
|---|---|
| autocapitalize=”” | 先頭文字を大文字化するかを指定 |
| enterkeyhint=”” | ソフトウェアキーボードのEnterキーアイコンを指定 |
| is=”” | カスタム要素との関連付け |
| itemid=”” | 要素内のマイクロデータのグローバルな識別子を示す |
| itemprop=”” | 要素内のマイクロデータのプロパティ名を指定 |
| itemref=”” | 要素外にあるマイクロデータと関連付け |
| itemscope=”” | 要素内にマイクロデータが含まれることを示す |
| itemtype=”” | 要素内のマイクロデータのプロパティ名の定義を示す |
| slot=”” | スロットとの関連付け |
全てのHTML要素に追加されたイベントハンドラ属性
| 属性名 | 用途 |
|---|---|
| onformdata=”” | フォームのエントリリストを生成した時に実行されるスクリプト |
| onmessageerror=”” | 文書がAPIから解読不能のメッセージを受信したときに実行するスクリプト |
| onsecuritypolicyviolation=”” | コンテンツセキュリティポリシーに違反した時に実行されるスクリプト |
| onslotchange=”” | スロットが含まれるノードが変更された時に実行されるスクリプト |
| onwebkitanimationend=”” | CSSアニメーションが終了した時に実行されるスクリプト |
| onwebkitanimationinteration=”” | CSSアニメーションが繰り返された時に実行されるスクリプト |
| onwebkitanimationstart=”” | CSSアニメーションが開始した時に実行されるスクリプト |
| onwebkittransitionend=”” | CSSトランジションが終了した時に実行されるスクリプト |
変更された属性
HTML Living Standardで変更された属性です。
| 要素名 | 属性名 | 用途 |
|---|---|---|
| <a> | rel=”” | 属性値としてopenerを指定可能 |
| <area> | rel=”” | 属性値としてopenerを指定可能 |
| <iframe> | sandbox=”” | 属性値としてallow-modals、allow-orientation-lock、allow-popups-to-escape-sandbox、allow-top-navigation-by-user-activation、allow-downloadsを指定可能 |
| <link> | rel=”” | 属性値としてcanonical、dns-prefetch、modulepreload、pingback、preconnect、preload、prerenderを指定可能 |
| <meta> | charset=”” | 属性値はutf-8を指定するべきとされている |
| http-equiv=”” | 属性値としてx-ua-compatible、content-security-policyを指定可能 | |
| name=”” | 属性値としてtheme-color、color-schemeを指定可能 |
全てのHTML要素で変更されたグローバル属性
| 属性名 | 用途 |
|---|---|
| accesskey=”” | 属性値として複数の値を指定可能 |
| inputmode=”” | 入力する時のソフトウェアキーボードの種類を指定可能 |
| nonce=”” | Content Security Policyのワンタイムトークンを指定可能 |
廃止された属性
HTML Living Standardで廃止された属性です。
| 要素名 | 属性名 | 用途 |
|---|---|---|
| <a> | rev=”” | リンク先から見た現在の文書との関係を示す |
| <area> | hreflang=”” | リンク先の記述言語 |
| type=”” | リンク先のMIMEタイプ | |
| <html> | manifest=”” | キャッシュマニフェストを指定 |
| <iframe> | allowpaymentrequest=”” | 文書がPayment Request APIを実行することを許可 |
| <img> | longdesc=”” | 画像を説明している文書のURL |
| <link> | rev=”” | リンク先から見た現在の文書との関係 |
| <object> | typemustmatch=”” | 埋め込まれる外部リソースがtype属性で指定したMIMEタイプと一致する場合にのみ埋め込みを許可 |
| <script> | charset=”” | 外部スクリプトの文字エンコーディング |
| <style> | type=”” | スタイルシートの記述言語 |
| <table> | border=”” | 表の外枠の太さ |
イベントハンドラ属性
| 属性名 | 用途 |
|---|---|
| ondragexit=”” | ドラッグしたアイテムが要素から出た時に実行されるスクリプト |
| onloadend=”” | メディアのデータの読み込みが終わる時に実行されるスクリプト |
| onshow=”” | 操作メニューを表示した時に実行されるスクリプト |
さいごに
いかがでしたでしょうか。
今回はHTML Living Standardについて解説していきました。きちんと理解し正しく使用していきましょう。
常に新しい事を取り入れていくようにアンテナをはっていくようにしていきたいですね。
