HTML5のカテゴリーとコンテンツモデルの違いとは?

2つの新概念!違いを知らないと、、、

html5

HTML5では、HTML4.01でおなじみだったブロックレベル要素・インライン要素という定義がなくなりました。

代わりに登場したのが、カテゴリーという概念とコンテンツモデルという概念です。

で、始めてHTML5を学ぼうとした人は、この2つがゴチャゴチャになってしまうことが多い。

今日は、カテゴリーの意味とコンテンツモデルの意味にのみ、焦点をあててお話しします。

※内容は2014年2月段階の情報となります。

カテゴリーとは何か? コンテンツモデルとは何か?

2つの違いを押さえていただくため、まずは下記の定義をご覧ください。

カテゴリー
その要素が、
どんな内容を示すのに使われるか?を表す分類。
【例】link要素は「ページ上に表示されない文書情報を示すメタデータコンテンツという分類」
コンテンツモデル
その要素の中に、
どのカテゴリーの要素を入れられるか?を示すルール。(※例外も存在します)

両者の違いが分からないうちに、新要素カテゴリーの解説なんかを読んでしまうと、「???、、、なんかHTML5って難しいそうだからやーめたっ!」ということになってしまうのです。

カテゴリーとコンテンツモデルの例

例えば、h1要素のカテゴリーは、フローコンテンツであり、かつヘッディングコンテンツです。

これはh1要素が、

  1. 文書の本体に現れる一般的な内容を示すために使用される要素。
  2. 見出しを表す内容を示すために使用される要素。

上記2つの分類にあてはまることを示しています。

一方で、h1要素のコンテンツモデルはフレージングコンテンツになります。

このことは、h1要素の中に入れられる要素は、段落内で使用するようなコンテンツに使用される要素。

すなわち、
「a,  abbr,  area,  audio,  b,  bdi,  bdo,  br,  button,  canvas,  cite,  code,  command,  datalist,  del,  dfn,  em,  embed,  i,  iframe,  img,  input,  ins,  kbd,  keygen,  label,  map,  mark,  meter,  noscript,  object,  output,  progress,  q,  ruby,  s,  samp,  script,  select,  small,  span,  strong,  sub,  sup,  textarea,  time,  u,  var,  video,  wbr,  テキスト, 」
といった要素が、h1の中に入れられるとルール付けされていることを意味します。

カテゴリーとコンテンツモデル。まずは違いを押さえた後に、どんなカテゴリーがあるのか?とか、コンテンツモデルの詳細などを知ることが大切です。

人気の無料メール講座を、ご利用ください。

  • 【プロ直伝】制作前に必ず行う2つのこととは?
  • 【重要】収益サイト制作者が取るべき手段は何か?
  • 【発表】魅せるデザインのラインナップはこちらです。
  • 【無料】必ず入れておくべき、フリープラグイン8選!
  • 【一瞬】瞬時にサイトの印象を引き立てる方法。
  • 【3.5倍】こうして成約率が急上昇しました。
  • 【注意】なぜ記事を増やしてもアクセスが伸びないのか?

※下記のフォームからメール講座に ご登録いただけます。

記事をシェアする

  • Tweetする
  • FaceBookでシェアする
  • はてブにBookmarkする
  • Google+で共有する

Tags


Trackbacks & Comments

Trackback URL for this post:

Leave a Reply