Asideラベル

2071 ワード

aside
HTML 5が提供するaside要素ラベルは、現在のページまたは記事の付属情報部分を表すために使用され、現在のページまたは主要コンテンツに関連する参照、サイドバー、広告、nav要素グループ、およびその他の類似の主要コンテンツとは異なる部分を含むことができる.
現在の仕様によると、aside要素には2つの使用方法があります.
  • は、articleの主要コンテンツの付属情報部分として含まれており、その内容は、現在の文書に関する引用、語彙リスト等であってもよい.
  • は、ページまたはサイトのグローバルな付属情報部分としてarticleの外で使用される.最も典型的な形式はサイドバーであり、その内容は友情リンク、付属ナビゲーション、または広告ユニットなどであってもよい.

  • 次のコード例は、上記の2つの使用方法を統合しています.
    <body>
    <header>
        <h1>My Blog</h1>
    </header>
    <article>
        <h1>My Blog Post</h1>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
            incididunt ut labore et dolore magna aliqua.</p>
        <aside>
            <!-- Since this aside is contained within an article, a parser
    
      should understand that the content of this aside is directly related
    
      to the article itself. -->
            <h1>Glossary</h1>
            <dl>
                <dt>Lorem</dt>
                <dd>ipsum dolor sit amet</dd>
            </dl>
        </aside>
    </article>
    <aside>
        <!-- This aside is outside of the article. Its content is related
    
    to the page, but not as closely related to the above article -->
        <h2>Blogroll</h2>
        <ul>
            <li><a href="#">My Friend</a></li>
            <li><a href="#">My Other Friend</a></li>
            <li><a href="#">My Best Friend</a></li>
        </ul>
    </aside>
    </body>

    HTML 5学習ノート簡明版(3):新要素のhgroup,header,footer,address,nav
    Asideもサイドバーとは関係なく、ツール的なものを表しており、コアコンテンツとはあまり関係ありません.(read it laterツールや検索エンジンは無視できるかもしれません)
    HTML 5のsection articleの違いは何ですか?header footer navはどのように理解しますか?