2013年11月30日に開催された「HTML5 Conference2013」において行われた数々のセッション。その中で今回は、マークアップに関する活動を展開している「マークアップ部」メンバー3名によるセッション「Markup Maniax – マークアップ部が語り合うHTML5仕様のいま・これから」の一部に関してレポートする。

HTML5といえばAPIや周辺技術の話題を目にすることが多くなった一方、Webサイトで重要なのはやはりマークアップ。HTML5がLast Callになってからも仕様に随時変更が加わっている。また、独自の要素を定義できる仕組みも登場している。今回のセッションでは「マークアップの今後はどう向かうのか？」マークアップ部から3人、バスタイムフィッシュ村岡正和氏、WEBCRE8.jp酒井優氏、矢倉眞隆氏がそれぞれの持論を展開した。

H1の使い方はどうあるべき？

村岡：今、HTML5.1の方で、新しい要素がどんどん追加されています。要素や属性も含め、どうしたらやりやすく解決できるか？ 世界中で議論されています。

酒井：最近のマークアップに注目すると、特に見出しに関して大きな変化がありましたよね。　

矢倉：HTML5以前は、そもそもセクショニングコンテンツがなかった。そこにHTML5で新たにセクションがでてきて、H1 H2と数字を見て判断できていたことが行えなくなりました。H1 H2 H3と重要度に応じた見出しを使い分けていましたが、HTML5では数字は関係ない。そうすると見出しはH1だけでいいのでは、という考えもあり仕様にもそう書かれている。

村岡：僕も昔からH1 H2とマークアップしていたし、Hの見出しでアウトライン考えていました。しかしそれがすべてH1になってしまうと、人間的レベルの気持ち悪さを感じてしまうんですよね。

酒井：コーダーとして困っていることがあって、それはサイトトップのロゴをH1でマークアップしたら、記事中にもまたH1を使う。H1はどうなっていくのだろう、という困惑が私の中にはあります。

矢倉：そもそもH1を2回使っちゃいけないという明確なルールはなく、仕様で決まっているわけではないので。ニュース記事を伝えるサイトの構造　側としてのレベルとコンテンツ、そうした混在したものをH1にするかしないかで意見は分かれると思います。「ロゴはH1だろう」という考えもあれば、「そもそもサイトのトップページはいろんなものが混在しているのでH1はあり得ない」という人もいる。本当に正解はないですよね。

パンくずリストから考える「マークアップに正解はない」

村岡：どういう目的でどういうサイトを作るのかによって、マークアップの仕方も変わってくる。

矢倉：マークアップ部は正解を出すより「おまえの考えで文章構造とはなんぞや」を問う部活動ですから。

村岡：「目的に応じたマークアップができてます」と自信を持って言い切れればそれでいいんですよね。

矢倉：パンくずリストを例に考えてみたいと思います。これまでと違い、HTML5.1では「→（矢印）」がパンくずだとされ、Webサイトの階層構造と認識されている。

村岡：私、実はこれが非常に気持ち悪くて、やりたくない人も多いんじゃないでしょうか？　そもそもパンくずをマークアップする専用のタグがないから、こんなことが起こる。「Breadcrumbs」というタグがあればいいのに。

矢倉：最近「Web Components」が登場して、マークアップやスクリプトをコンポーネントとして組み込んでいるので、ｐだのなんだの議論すること自体が無駄になるかも、という議論も。

酒井：コーダーとしてWeb Componentsにどう向き合うか？　Web Componentsを使ってソースコードを公開し、それを真似して使ってデファクトにしていく。そうするとHTML仕様に組み込まれる可能もでてくるのか？

矢倉：Web Componentsがもてはやされる理由として、みんなの要望に答えられていない現状があって、そこでもっと下のレイヤーで答えていこう、という流れがある。そこから標準化の検討課題になるのではないでしょうか。

村岡：私としては2つの立場があるんですよ。マークアップを研究する立場でいえば「どこまでパンくずのことを考えられるか？」ぜひやりたい。でもそれは、一切ご飯が食べれないからきついですよね（笑）。

仕事をする立場としては、人が作ったものを使いたいという思いもある。例えばモジラが作っているBrick というWeb Components frameworkがあって、「x-fripbox」というタグを入れるだけで、フリックボックスが作れてしまう便利なものもある。

矢倉：やがてマークアップでUIをつくるWeb Componentsが出てきてもおかしくない。そうすると、あれこれ考えなくてもパンくずつかえるわけです。

酒井：一見、思考停止に見えるかもしれないけれど、いいことだと思います。文書構造で考えると、Webサイトにしかパンくずはない　

村岡：HTML5の仕様策定では、実装が仕様になるスキームで動いているので、とりあえずみんながトライして「いいね！」が一番多いマークアップが仕様になる気がします。自分がいいと思ったものが一番いいし、そういう意味では今が無法地帯。いつか「Breadcrumbs」というタグができると信じてその時、「理想の構造は？」「パンくずリストは何か？」を自分で考え、出した答えをよしとしよう。まだ正解はないんです。

矢倉：「マークアップに正解はない」これがマークアップ部の座右の銘になりますかね（笑）。

エンジニアがデザインに「文句を言える」ようになってほしい

村岡：マークアップ部では「マークアップカフェ」というイベントを定期的に開催しています。先ほど話したようにマークアップに正解はない以上は、もうみんなで決めるしかない。そこで「どれが一番いい感じか？」を議論しています。その中で例えばあるお題を出して「これ、あなたならどうマークアップしますか？」と30分考えて答えを出してもらう。ふつう、業務でマークアップの方法について30分もまず考えないですよね。でもあえて考えることで、いろんな疑問や考え方が出てくるわけです。

酒井：確かに仕事では時間の制約上、マークアップについてそこまで深く考えることができずに不完全燃焼で終わること多いですね。でも仕事を離れたこうした場で改めて考えると、割と迷うことに気付くんです。結局のところ、結論を出すことより構造を考えることがマークアップにとって重要で、意義があるのではないでしょうか。

矢倉：実は提示されているお題にも構造的なミスがあるケースもあります。その場合、そもそもデザインの方で直せないのか？といった議論も起こる。

村岡：「マークアップエンジニアがデザインに文句を言える」これが重要だと思うんですよ。「これでは正しい文書構造を表現できない」と思ったとき、論理的に言い切れる知識と経験・根拠を持った説明ができるマークアップエンジニアになってほしいし、そうやって正しいものになっていくのだと思います。

酒井：そもそも仕様を策定する人も人間だし、自分らも同じ土俵に立っている。じゃあ、正解がないのになぜ考えるのか？　それは仕様を理解することからはじめて、その上で「自分はこう思う」という考えを持つことが大事だから。

村岡：皆さんにはぜひhtml5jのメーリングリストで「これどうデザインします？」と気軽に投稿してほしい。少なくとも僕が必ずレスつけます（笑）。

酒井：私もちょいちょい投げ込んでます。「もしかして自分だけ気になっていることかも？」という不安もありましたけど、実は結構有名な人が返してくれたりするんですよね。だから気軽に質問放り込んでほしい。

村岡：何度も言いますけど、マークアップに正解はない以上、どんな著名な人も「これはこうです」とはいえなくて、「僕はこう思います」としかいえない。その上で「僕はこう思う」をたくさん共有したらいいと思っています。

【講演資料・セッション映像】