こんにちは、アウラスタッフの仁木です！
2018年もアウラでたくさんのサイトを出来るように楽しく頑張っていきたいと思います。よろしくお願いします！
昨年１２月にHTMLの５.２がリリースされました。
２０１６年１１月にHTML５.１がリリースされ、その１年後にリリースでありHTML5になってからは２回目の改訂です。
具体的にどの部分が追加され削除されたのか、確認したいと思います。これが全てではないのと、私個人の解釈なので間違った部分があるかもしれませんがご容赦ください。
５.１からの変更点は５.２の勧告に記載されています。
HTML 5.2｜W3C Recommendation, 14 December 2017
今まで<head>内のみで記述できていた<style>タグが<body>タグ内で記述できるようになりました。
今まで<dl>タグ直下は<dt>もしくは<dd>タグのみ書くことができましたが、<div>タグも新たに記述することができるようになりました。
割と<dl>タグ内に空要素を入れたいと思うことは多いので、これはちょっと嬉しいです。<ul>や<ol>も今後可能になるのか気になります。
<dialog>タグはダイアログ機能を持った要素です。以前から導入が検討されていた要素ですが、５.２から正式に追加されたみたいです。
JavaScriptでshow(),close(),showModal()のメソッドを利用して簡単にダイアログの表示・非表示の制御ができます。
ただし実装可能なブラウザは現在はChromeとOperaくらい。今後の各ブラウザの対応が気になります。
[codepen_embed height=”265″ theme_id=”0″ slug_hash=”LedXLo” default_tab=”result” user=”toshitaka”]See the Pen <a href=’https://codepen.io/toshitaka/pen/LedXLo/’>LedXLo</a> by Toshitaka Niki (<a href=’https://codepen.io/toshitaka’>@toshitaka</a>) on <a href=’https://codepen.io’>CodePen</a>.[/codepen_embed]
canonicalは同一内容のページであることを示す値です。今まで普通に使っていましたが、5.2から正式に追加されるんですね。
こちらもファビコンまわりの設定で今まで使っていましたが、5.2から正式に追加。
<a>、<area>、<iframe>、<img>、<link>タグに対してリファラー情報を送るかどうかを指定できるようになりました。
指定できる内容は以下です。
空値。リファラーポリシーがない。その他でポリシーが定義されている場合はそれに準じるものになります。
リファラー情報は送信されません。
以下に該当する場合はリファラー情報を送信し、該当しない場合はリファラーは送信されません。
具体的には”https”から”http”へ遷移する場合はリファラー情報は含まれずに送信されます。”http”からはいずれも送信されます。
同一ドメイン間ではリファラー情報は送信されますが、それ以外へはリファラー情報は送信されません。
すべての場合で、リファラー情報は”origin”（URL scheme とホストの部分のみで、 path や query を除いたもの）が送信されます。
以下に該当する場合はリファラー情報は”origin”を送信し、該当しない場合はリファラーは送信されません。
これは”no-referrer-when-downgrade”と”origin”を合わせたようなものですね。
同一ドメイン間以外ではリファラー情報は”origin”を送信します。
同一ドメイン間ではすべてのリファラー情報が送信され、”https”から”https”、または”http”からの遷移の場合は”origin”を送信します。
“https”から”http”への遷移の場合はリファラー情報は送信されません。
いずれの場合でもすべてのリファラー情報が送信されます。
WAI-ARIAとは、「Web Accessibility Initiative – Accessible Rich Internet Applications」の頭文字であり、HTMLやSVGで利用できるアクセシビリティをよくするための仕様です。
Webのコンテンツを正常に閲覧できない人のための配慮として様々なaria-*属性があり、５.２ではwai-aria-1.0から1.1へのアップデートに対応しました。
<link>タグに対して新しく[nonce]属性が設定できるようになりました。
nonce属性はページ読み込み時にレスポンスヘッダーから”nonce-***”の値を受け取り、”nonce-“以下の値がnonce属性の値と一致した時のみリソースを読み込みます。クロスサイトスクリプティング などの攻撃からサイトを保護するための機能です。
<script>タグについてはHTML５.１から対応していましたが、５.２から<link>要素にも対応しました。
こんなタグがあったんですね、一度も使ったことのないままサヨナラです。
“inputmode”は主にスマートフォンなどでキーボードの入力モードを指定出来る属性です。
“dropzone”属性は今まで知らなかったで、機能も知りません。廃止になるので知らないままでいます。
<script>タグのTYPE属性に新たに”module”が追加されました。これはJavaScriptをモジュールとして読み込むかスクリプトとして読み込むかを判別をすることができるようです。
<iframe>タグに[allowpaymentrequest]属性が追加されました。これはPayment Request APIと呼ばれる、iframe内で決済フローを行うことができるAPIを呼び出して良いかを指定するものです。
<iframe>、<sandbox>タグに[allow-presentation]属性が追加されました。これPresentationAPIを呼び出して良いかを指定するものです。PresentationAPIとは表示されたページを別のスクリーンに表示し、操作することができるAPIです。
などなど、この他にもさらにまだいくつかありますが気になった内容に絞ってピックアップしました。
W3Cの方針では１年に一度改訂を行っていくことを目標にしているということなので、また１年後くらいに改めて確認ですね。
それでは！
