2011年7月3日日曜日

「HTML5 の基礎: 第 1 回 最初の一歩」 という記事は素晴らしい

 HTML5で理解できない部分があった。いや、理解出来ない部分のほうが多かったと言い直しておこう。それを見事に解消してくれそうなのが、HTML5 の基礎: 第 1 回 最初の一歩であります。「なんだ、まだそんなことをやっているのか」と笑われそうですが、そうなんです。モタモタしながら決して焦らず確実に学習しています。と、いうよりも自分の能力が追いつかないのですからしょうがありません。

 それでこのサイトで何がわかったのかということですが、左の図を見てください。これまで曖昧だったのが<aticle>タグと<section>タグの力関係でありました。この図をみると<aticle>タグの下に<section>がきています。これまでその反対だと誤解してましたものですから、これまで作成したものは全部書き直しになってしまいますが、ま、それも勉強ですから仕方ありません。

 とここまで書いて、もう一度記事を読み返してみると、この図には示されていないことが説明されているではないですか、危うく早とちりをやらかすところでありました。しかし、この説明は翻訳が悪いのだろか、<aticle>と<section>の関係がなかなか理解できません。もうしばらく悩む日々が続きそうです。取り敢えず、この図が示しているように<aticle>が<section>を包括するような形を採用してみようかと思います。以下引用文
記事領域およびセクション領域
ここで設計しているページには、1 つの記事セクションがあり、ここにページの実際のコンテンツが入ります。この領域を作成するには、<article> タグを使用します。このタグが定義するコンテンツは、ページの他のコンテンツとは独立して使用することができます。例えば、RSS フィードを作成する場合には、<article> を使用してフィードのコンテンツを一意に識別することができます。<article> タグによって識別されるコンテンツを削除したり、別のコンテキストに配置したりしても、そのコンテキストにおけるコンテンツは完全に理解することができます。
Acme United 計画の記事領域には、3 つのセクション領域が含まれます。これらのセクション領域を作成するには、<section> タグを使用します。<section> の中に含めるのは、Web コンテンツ内で互いに関連するコンポーネント領域です。<section> タグには (<article> タグもそうですが)、ヘッダー、フッター、さらにセクションを完成するために必要なその他すべてのコンポーネントを含めることができます。<section> タグは、コンテンツをグループ化するために使用します。<section> タグと <article> タグのコンテンツはどちらも通常は <header> で始まり、<footer> で終わります。この 2 つの間に、タグのコンテンツが入ります。
<article> タグの中に <section> タグを含めることができるのと同じく、<section> タグの中に <article> タグを含めることもできます。<section> タグは同様の情報をグループ化するために使用し、<article> タグは記事やブログなど、コンテンツが持つ意味に影響を与えることなく、削除したり、新しいコンテキストに移動したりすることができる情報に使用します。<article> タグはその名前が示唆するように、完全な情報一式を提供します。それとは対照的に、<section> タグには関連情報が含まれていても、その情報だけを別のコンテキストに配置することはできません。そうすると、その情報が持つ意味が失われてしまうためです。
リスト 4 に、<article> タグと <section> タグの使用例を記載します。

リスト 4. <article> タグおよび <section> タグの例
<article>
     <section>
          Content
     </section>
     <section>
          Content
     </section>
</article>
<section>
     <article>
          Content
     </article>
     <article>
          Content
     </article>
</section>
コメントを投稿