Other

【HTML5.2】変更点まとめ

更新日:

HTML5.2

Web技術の標準化団体であるW3CがHTML5のマイナーバージョンアップである「HTML 5.2」の策定を完了し、勧告とすることを発表しました。

HTML 5.2機能追加、削除、バグフィクスなどが行わているそうです。

具体的にどのような変更があったのか調べてみました。




HTML5.2の変更点

New features

<dialog>要素の追加

dialog 要素は閲覧者が操作することが可能なダイアログを表します。
open属性が指定されたdialog要素は初期状態で表示され、閲覧者が操作可能。
open属性が指定されていない dialog要素はレンダリングされないようです。
因みに、open属性は論理属性です。

以下、codepenで試してみました。

JavaScriptモジュールの統合

<scripts>要素のtype属性にmoduleを指定すると、JavaScriptのモジュールとして扱えるようになったようです。

Referrerポリシーの追加

リファラーを送るかどうかのポリシー指定が可能になりました。
対応するのはa要素,area要素,iframe要素,img要素,link要素。

指定できるポリシーは以下になります。

オリジンが同じ場合と異なる場合でそれぞれ指定が異なるようです。

WAI-ARIA1.1

WAI-ARIAはアクセシビリティのための属性仕様です。
今までの仕様よりもアップデートされたものが適用できるようになったようです。
世の中のアクセシビリティに対する意識向上にもつながりそうです。

link要素にnonce属性が追加

link要素にnonce属性が追加されました。

以下、nonce属性の説明です。

nonce属性とは、CPS(Content Security Policy)によって文書内に読み込まれたscript要素やStyle要素の内容を実行するかどうかを決定するために利用されるnonce(number used once / ワンタイムトークン) を指定します。

CSP とは、あらかじめその文書で読み込まれることが想定されている JavaScript などのコンテンツを、ホワイトリストとして指定することによって、攻撃者によって挿入される悪意のあるスクリプトの読み込みを遮断し、クロスサイトスクリプティング (XSS) など、インジェクション攻撃から Web サイト や Web アプリケーションを保護するための仕組みです。

Content-Security-Policy HTTP レスポンスヘッダによって送信した値と同じものを、script 要素や style 要素に付与した nonce 属性に指定することで、その値が一致した場合のみ script 要素や style 要素の内容が実行されます。

nonce の値は、リクエストごとにランダムな文字列が生成される必要があります。それによって外部からは値が推測できず、インジェクション攻撃を防止することができます。

link要素の変更点

・rel属性にcanonical属性値が追加

canonical属性は、正式なURLを検索エンジン側に伝えるURLの正規化を目的とした属性です。
canonicalを設定することで、複数の重複ページが存在している場合に検索エンジンに優先させるべきページを伝えることでができ、
それ以外のページは重複ページであることを伝える事ができます。

・rel属性にnoreferrer属性値が追加
noreferrer属性は、リンク先にリファラを送信しないという設定になります。
link属性でも指定が可能になりました。

・rel属性にapple-touch-icon属性値が追加
Web Clipアイコンを指定します。スマホのホーム画面にWebサイトのショートカットを保存する際のアイコンですね。

iframe要素の変更点

・allowpaymentrequest属性が追加
クロスオリジンのとき、Payment Request API の実行を許可する場合はtrueを指定します。

Payment Request APIとは、ショッピングサイト上で簡単・高速で一貫性のある決済フローを実現するオープンWeb向けの新しいAPIです。

・sandbox属性にallow-presentation属性値が追加

sandbox属性は、セキュリティのための属性です。
iframe要素によって埋め込まれたHTML文書に制限をかけます。

allow-presentation属性は、iframeがpresentationセッションを開始できるようにするかを、iframe埋め込み者が制御できるようにするものだそうです。

navigatorオブジェクトにメソッドを追加

window.navigatorオブジェクトに、以下のメソッドが追加されました。

・registerContentHandler(protocol, uri, title)
・isContentHandlerRegistered()
・isProtocolHandlerRegistered()

HTMLElementにinnerTextを追加

HTMLElement.innerTextを使用することで、DOM要素の中身がテキストで取得できるようになりました。

about URLスキーマに html-kind を追加

コンテンツセキュリティポリシーの適用

Features removed

今回の勧告では、keygen要素、menu要素、menuitem要素が削除されました。

<keygen>要素

<menu>要素と<menuitem>要素

input要素のinputmode, dropzone属性の廃止

inputmode属性は、入力モードを指定するための属性。
例えば、「numeric」= 数字入力、「email」= 電子メールアドレスなどなど。。

dropzone属性は、その場所がドロップ可能な領域であることを表し、さらにドロップしたアイテムの受け入れ方法を指定する属性。

windowオブジェクトshowModalDialogの廃止

モーダルオブジェクトを生成するオブジェクトです。

Plugin APIの廃止

まとめ

今回のHTML5.2勧告と同時に、HTML5.3草案も公開されています。
常にルールは変更されていきますので、要チェックです。

HTML5.2変更点の詳細は「HTML 5.2 Changes」をご参照ください。




-Other

Copyright© IT未経験のバンドマンがプログラマーを目指して。 , 2018 All Rights Reserved.