こんにちは。ムキムキマッチョマンになりたい人です。心も体もムキムキマッチョマン。フロントエンド領域でのムキムキマッチョマン目指して頑張っています。この記事は技術記事の皮を被った、IT知識トレーニングの記録です。

導入

我々フロントエンドエンジニアなら誰しも一度は記述するHyper Text Markup LanuageことHTMLですが、書き方やタグのルールはどのようにして決められているのでしょうか？ HTMLの標準仕様における現行版「HTML Living Standard」を読み、Web標準について理解を深めるブログです。

Webを支える「標準」

HTMLのルールはブラウザ開発会社のエンジニア等が集まる団体がHTMLはこういうルールでいきましょう、と取り決めています。その取り決められたルールを標準と呼びます。実はこの標準、Webを支えるありとあらゆる技術に存在しています。ちなみに標準を決める団体を標準化団体と呼びます。例えばECMA、IEEE、W3Cなど様々な標準化団体が存在しています。

Web技術に使われている標準は、Web標準と呼ばれており、以下のような標準が存在しています。

HTTP
DOM API
JavaScript（正式名称はECMAScript, 標準そのものはECMA262）
CSS

ちなみにWeb標準におけるHTMLは画像において「This Specification」で示される領域に位置付けられます。

参照：HTML Living Standard(https://html.spec.whatwg.org/multipage/introduction.html#abstract)

私たちはなぜ標準を（あんまり）気にせずにWebで開発をしたり、ブラウジングしたりできているのか

この標準、Webにおいては至る所に存在していますが開発をしている時にHTMLのタグのルールについて細かく気にすることなく開発ができますし、ブラウザでWebサイトを開いているときHTMLの細かいルールについても気にしなくて良くなっています。例えばあるWebサイトを開くときにあるブラウザAだとサイトがみれるけど、ブラウザBではそもそも表示がめちゃくちゃ崩れていて見れないなんてことはありません。*1

それは各ブラウザやエディタ開発者（団体）が、HTMLや他のWeb標準に従ってブラウザやエディタを作っているからです。標準化団体が草案を作り、標準の検証を開発者各自がブラウザに実装する形で行い、標準を公開しブラウザが実装に取り入れる。なんて流れで私たちの手元に標準が届き、大体のWebサイトをどんなブラウザでもみることができるわけです。

仮にWeb標準を採用していないブラウザがあったとすると、それはHTMLを勝手に解釈して勝手に表示しているオレオレ仕様というわけです。

標準を公開しブラウザが実装に取り入れるということは、どこかに標準が公開されているはずです。その公開されている標準と細かい実装や規則が書かれたものを標準仕様書なんて読んだりします。英語だとspecificationとかで表現されたりします。

エンジニアなら誰しも読みたい標準仕様書

エンジニアとして開発をしていると、そういえばHTMLには俺の知らない仕様があるのかも....なんて思ったり、いや〜ブラウザ作りたいからHTMLの詳しいルール知りたいな〜なんて思ったりすることが一度や二度あるはずです。

そこで読むのが標準仕様書です。

HTML Livinig Standard

HTMLの標準仕様書はHTML Living Standardという名前で公開されており、WHATWGという団体が標準化〜管理を行なっています。HTMLの標準は一度決められるとそれが一生続くわけではなく、むしろ一生更新し続ける生きている（living）標準なんです。

全文はこちらのサイトから

なぜ「Introduction」？

HTML標準仕様書初めて読む方は、CとかC++のコードが載ってて詳しい実装が書いているんでしょ...？や、なんか細かい数式がいっぱい書いてて...みたいに思われるかもしれませんがそんなことはありません。

そもそも標準は実装に対して基本的には制約を設けませんあくまでも仕様です。実装まで具体化するとパフォーマンスに重大な問題があった際に変更しづらいなどがありますし、そこは抽象化した上で各ブラウザベンダにお任せで良いでしょう。

多くの標準仕様書のIntroduction（もしくは導入、もしくはabstract）にはとてもいいことが書いています。それは何かというと....

なぜ標準があるのか考えるための材料

標準仕様書のIntroductionの多くには、標準で定められた技術の歴史やなぜ今この団体が管理しているのか、どういう経緯で今開発され今後どうなっていくのか、技術のコンセプトなどが書かれています。つまりちょっとメタ的な読み物なのです。HTMLをただのマークアップではなく、ちゃんと目的を持った技術であることが理解できます。

これの何が大事かというとわざわざコストをかけて標準化して公開するということはそれなりの理由が必ずあるということです。その理由は標準技術をどれだけ採用するか、そもそもそれを採用するかを判断していくための重要な軸になり得ます。まずは細かい実装を読むためにIntroductionを読んでみる。大事なアプローチです。

そしてIntroductionにはもう一つ、標準仕様書の詳しい読み方が書いていることが多いです。というのも標準仕様書は相当な分量があるため、書き方や表現を統一することで余計な情報を省きその本質だけを記述する必要があるのです。というわけでそれを読むためのいわゆるお作法なども書いています。