【HTML5】aside要素について
HTML5におけるaside要素の使用例を紹介します。
aside要素は、主要なコンテンツと少し関連性のある内容をマークアップします。具体的にはサイドメニューや広告等で使用します。
<aside> <h2>記事検索</h2> <form method="get" action="index.php"> <input type="hidden" name="amount" value="0" /> <input type="hidden" name="blogid" value="1" /> <input name="query" alt="検索キーワード" class="formfield" size="10" maxlength="60" accesskey="4" value="" /> <input type="submit" alt="検索" value="検索" class="formbutton" /> </form> <h2>最新記事</h2> <ul> <li><a href="item1">記事1</a></li> <li><a href="item2">記事2</a></li> <li><a href="item3">記事3</a></li> </ul> <h2>カテゴリー</h2> <ul> <li><a href="category1">カテゴリー1</a></li> <li><a href="category2">カテゴリー2</a></li> <li><a href="category3">カテゴリー3</a></li> </ul> <h2>アーカイブ</h2> <ul> <li><a href="archive1">2011年5月</a></li> <li><a href="archive2">2011年4月</a></li> <li><a href="archive3">2011年3月</a></li> </ul> </aside>
上記例のように、検索窓、最新記事、カテゴリー、アーカイブなど、主要コンテンツであるブログ記事記事を補足したり、付随するものをasideでマークアップします。
コメントを残す