MENU

出張デモ

資料請求
見積依頼

お問い合わせ

CONTACT

お問い合わせ

サイト職人CMSに関する
お問い合わせ・ご相談はこちらまで

東京本社

03-5366-3277

受付時間 平日9:30~18:00

関西オフィス

06-6123-7260

受付時間 平日9:30~18:00

  1. HOME
  2.  > 
  3. サイト職人スタッフブログ
  4.  > 
  5. W3CがHTML5.2を勧告。変更点は?

サイト職人スタッフブログ

W3CがHTML5.2を勧告。変更点は?

HTMLWeb技術の標準化を目的に運営されているW3C(World Wide Web Consortium)がHTML5.2を勧告しました。Web製作者にとって、新しい技術の表れであり、ぜひ知っておかなければいけないことです。HTML5.2が登場したことでHTML市場は、今後どのように変化していくのでしょうか?今回は、HTML5.2の変更点について分かりやすくご紹介します。

2017年12月14日にhtml5.2が勧告

HTML 1.0が登場したのは、1993年。それから25年が経過し、新しいHTMLとしてHTML5.2が登場するに至りました。特にHTML5は、解釈可能な意味を重視しているHTML言語で、最新のマルチメディアであったとしても、HTMLタグだけで対応可能な言語として有名です。

html5.2で搭載された新機能について

新しく新機能として追加されたものは下記の通りです。

<dialog>ダイアログボックスが追加

HTMLコーディングをする際、ダイアログを表示させたくても、実装できない技術者も多いのではないでしょうか?html5.2では、手軽にダイアログを表示できるようになっています。記述方法も非常に簡単で、表示したいタイトルとコンテンツの内容を<dialog>で囲むだけです。たったこれだけの記述で、ダイアログボックスが表示できてしまいます。この技術は、今後もかなり役立つ技術なので必ず覚えておきましょう。

<dialog>
<h2>タイトル</h2>
<p>ダイアログボックスの内容</p>
</dialog>

Content Security Policyへの対応

html5.2では、コンテンツ セキュリティ ポリシーに対応できるようになりました。これによって、最新のブラウザに対するクロスサイトスクリプティング攻撃のリスクを最小限に抑えられるようになっています。また、セキュリティに関するさまざまな機能もカバーしており、開発するアプリケーションの防御を固めることで、コンテンツ埋め込み型の脆弱性のリスクを低減することに成功しました。

<main>要素の複数設置への対応

HTMLコーダーなら、メインコンテンツ部分に<main>要素を設置し、コーディングを進めるかと思います。もちろん、標準的なメインコンテンツの表記は、1回限りで複数表記した経験は1度もないでしょう。なぜなら、HTML5.2以前は、メインコンテンツに関する表記は1度しかできなかったからです。
しかし、これまでのように<main>の利用回数を制限したことで、コンテンツ表記に開発者の意に反する挙動が見られたため、<main>要素を複数設置できるようになりました。しかしながら、理由もなくたくさん使って良いわけではなく、最初に表記できるメインコンテンツは1つだけです。あとの表記については、hidden属性を利用して隠さなければいけません。

<main>メインコンテンツ</main>
<main hidden>メインコンテンツ1</main>
<main hidden>メインコンテンツ2</main>

ここで注意しなければいけないのが、いつものようにCSSのdisplayプロパティを利用して隠してしまってはいけません。確かに、そのような方法でも隠すことはできるのですが、HTMLの構造に影響を与える要素ですので、hidden属性を利用して隠すようにしてください。

<style>要素の自由配置への対応

一般的なHTMLコーディングでは、<style>要素を<header>内に記述することが当然とされてきました。html5.2では、<body>内であれば、どこでも自由に設置できるようになりました。しかし、自由に記述できるようになったからといって、パフォーマンスに影響を与えないというわけではありません。状況によっては、パフォーマンスに影響を与えることもあるため、何か問題を引き起こしたくないのであれば、<header>要素に記述することが無難です。

html5.2で削除された機能について

一方で、html5.2が登場したことで、削除されたものも存在します。削除された機能は、下記の通りです。

・keygen

公開鍵を設定する際に利用するkeygenですが、こちらの機能が利用できなくなりました。

・menuitem とmenu

コンテキストメニューやナビゲーションを作成する際に利用するmenuが利用できなくなりました。

・dropzone属性

要素上にドロップできるコンテンツを指定する際に利用するdropzoneが利用できなくなりました。

HTML5.2の変更点

HTML5.2では、新しくinvalidされてしまった記述ルールが存在します。

<p>の子要素はフロートもインラインも無効

HTML5.2の環境下では、<p>要素の子要素は、必ずフレーズコンテンツでなければいけません。つまり、下記のようなタイプの要素は、<p>要素の中に利用できないということです。

・インラインテーブル
・インラインブロック
・positionやfloatなどを利用したブロック

strict doctypeは、無効

HTML5.2では、下記のような構造のHTMLは、有効なものとしてみなされません。

XHTML 1で、strict doctypeを所有するコンテンツ、またはHTML 4が入ったコンテンツ。

【HTML】
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

【HTML】
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>

最後に

今回のHTML5.2への改定では、HTMLコーダーにとって便利な機能が数多く追加されたように感じます。特に、<dialog>要素の追加については、多くの技術者が関心を寄せているでしょう。ダイアログを表示する際、技術者が変われば、JavaScriptを用いるものもいれば、他の言語を用いて実装するコーダーもいます。今後は、<dialog>要素を利用すれば、手軽に実装できるようになったため、社内で技術の統制がはかれるのではないでしょうか。ひとつずつ、新しい機能を自分の技術として習得していきましょう。

PAGETOP