WEBCRE8.jpウェブクリ8.jp

webデザイナーによる、デザインとwebを楽しむ情報ブログ

調べる。

備忘録としてwebやデザインについて調べたり
新しく知ったことなどを書き残していくカテゴリです。

[HTML5]HTML5にmain要素が追加された…(現在HTML5のタグは109)

この記事は約5分ぐらいで読めます

まあ、変化していくものは仕方がない
恒例の108云々の記事です。多分他で書く人もいるだろうし別にぶっちゃけどうでもいいんですけど、始めてしまったものは仕方ないので書くことにしますw皆、109ですよ!w

これまでのあらすじ

はい、特にネタがあるわけでもないんですけどHTML5のCR(勧告候補)が先日更新されまして、めでたくHTML5にmain要素が追加されました。hgroupは実際に消えましたねー。

これまでの流れは

  1. HTML5のタグって現時点(2012年8月)でいくつあるの? ― #HTML5のタグは百八つまであるぞ …? ― – WEBCRE8.jp
  2. 【悲報】HTML5のタグが109個になってる…(またはdialog要素について)【今更】 – WEBCRE8.jp
  3. 【108厨歓喜】HTML5のタグ,108つに戻るってよ【らしい】 – WEBCRE8.jp

といった感じです。108とか言いだしたのが運のつき…w

main要素とは

以下はmain要素の仕様。

The main element represents the main content of the body of a document or application. The main content area consists of content that is directly related to or expands upon the central topic of a document or central functionality of an application.

4.5 Grouping content — HTML5

ざっくり訳すとmain要素はドキュメントまたはアプリケーションのbody要素のメインコンテンツを表します」というようなこと。body内に1つしか存在しません

フロー・コンテンツ、パルパブル・コンテンツに属し、コンテンツ・モデルはフロー・コンテンツです。つまり、殆どなんでも入れられるし、空であってはいけないという事です。

期待されるコンテキストはフロー・コンテンツとしてですが、articleasideheaderfooternavの中には含められません。

セクショニング・コンテンツではありませんのでアウトラインを形成しません、とわざわざ書いてあります。

このタグで囲まれた部分をメイン・コンテンツであると定義するタグなわけで、その直下に配置されるのは恐らく殆どの場合はarticlesection等になるのではないかと思います。今までのよくあるコーディングで言えばdiv id="main"といった書き方をされていたものに置き換わる感じです。

覚え書き@kazuhi.to: 巷(何処)で話題のmain要素とは何か

この記事でもmain要素がしっかり解説されています。去年のHTML5 Advent Calendar 2012の1発目の記事でしたね。このときは私もちょっとこの辺でHTML5のタグを全部確認してみようぜ!! – WEBCRE8.jpという記事を書いています。

この記事でも触れられている通り(私はあんまり詳しくありませんが)WAI-ARIAでのrole属性mainと等価の働きをするようにブラウザーの実装が進んでいるようです。アクセシビリティー的に意義のある要素で、ちゃんと使われれば有用なものだとは思います。

いちいち知っておく必要あるの?

まだまだ仕様の確定まで予断を許さないHTML5ですが、そもそもいちいちこんな情報をキャッチアップする必要性って普通のコーダーやweb制作者が知っている必要がどのくらいあるの?という疑問を抱く人がいるかと思います。

私としてはぶっちゃけそんなにないと思いますw 私は好きだから情報を追う事にしてますが、実際に業務でHTML5を使う人はat riskに含まれていたり実装の完璧でないタグを書かないようにしていればいいのかなと考えています。

結局HTML5の仕様が確定したところで、HTML5.1で不要と判断されれば、その時点以降に作られるHTML5のサイトからも外したくなってくるわけです。

○○が確定するまで~とか考えていても、実際は常に何かしらが変化していく世界です。サイト作成時点での状況で採用/不採用を判断すればいいんじゃないかなと思うわけです★

終わりに

報告だけなんで特にコーディング例もしませんでしたが、そんな感じで。

私としてはmain要素はあってもなくてもいい派でした。headerfooternavaside以外がmainだろ、みたいな。でもまあ、それ(div id=main)が殆どのサイトに存在するのであれば、いっそ要素として定義しちゃおうというのはわかる気がします。レイアウトの為にほぼ確実に書きますしね。

追記

追記というか公開前に追記する感じになっちゃったんですけど、WWW WATCHで殆ど同内容の記事が先に公開されてます。

HTML5 勧告候補に main 要素が追加、hgroup 要素は予定通り削除 | WWW WATCH

いやー、普段時事ネタというかニュースはあんまり取り扱わないんですが、こればっかりは勘弁してくださいw