{"id":71,"date":"2013-09-03T11:25:41","date_gmt":"2013-09-03T11:25:41","guid":{"rendered":"http:\/\/www.w3.org\/community\/html5spec\/?p=71"},"modified":"2013-09-03T11:50:00","modified_gmt":"2013-09-03T11:50:00","slug":"correct-use-of","status":"publish","type":"post","link":"https:\/\/www.w3.org\/community\/html5spec\/2013\/09\/03\/correct-use-of\/","title":{"rendered":"Correct use of aside element"},"content":{"rendered":"<p>Hi all,<\/p>\n<p>My name is Willem-Siebe and I hope I found the right place here to have some good discussions about the correct use of HTML5. I&#8217;m not sure if I should use one of the three mailinglists or write a post like I do now, please tell me for the next time ;-).<\/p>\n<p>My problem: a typical website design can have a right-sidebar area. Can I use the &lt;aside&gt; element for this?<\/p>\n<p>When I read about the &lt;aside&gt; element here:\u00a0<a href=\"http:\/\/www.w3.org\/html\/wg\/drafts\/html\/CR\/sections.html#the-aside-element\">http:\/\/www.w3.org\/html\/wg\/drafts\/html\/CR\/sections.html#the-aside-element<\/a>:<\/p>\n<blockquote><p>The element can be used for typographical effects like pull quotes or sidebars<\/p><\/blockquote>\n<p>On this page W3C discusses a typical website structure:\u00a0<a href=\"http:\/\/www.w3.org\/community\/webed\/wiki\/HTML_structural_elements\">http:\/\/www.w3.org\/community\/webed\/wiki\/HTML_structural_elements<\/a>.<\/p>\n<p>This example has two sidebars, one sidebar is wrapped in an &lt;aside&gt; element, with this explenation:<\/p>\n<blockquote><p>you may have noticed that we used an\u00a0<code>&lt;aside&gt;<\/code>\u00a0element to markup the 2nd sidebar: the one containing latest gigs and contact details. This is perfectly appropriate, as\u00a0<code>&lt;aside&gt;<\/code>\u00a0is for marking up pieces of information that are related to the main flow, but don&#8217;t fit in to it directly. And the main content in this case is all about the band!<\/p>\n<p>Other good choices for an\u00a0<code>&lt;aside&gt;<\/code>\u00a0would be information about the author of the blog post(s), a band biography, or a band discography with links to buy their albums.<\/p><\/blockquote>\n<p>However, for the left-sidebar, they don&#8217;t use a &lt;aside&gt; element, with this explenation:<\/p>\n<blockquote>\n<ul>\n<li>&#8220;sidebar1&#8221; contains various useful links that will persist on every page of the site, such as &#8220;subscribe to RSS&#8221; and &#8220;Buy music from store&#8221;.<\/li>\n<\/ul>\n<\/blockquote>\n<p>In the first explenation they explain: the main content in this case is all about the band!<\/p>\n<p>Can anybody explain me why a RSS (about the band) and Buy Music link (from the band) are not related to the main content (all about the band!).<\/p>\n<p>And when they talk about &#8216;main&#8217; content, do I think of that on site-level (what is the site about) or really specific on page-level (what is the page about).<\/p>\n<p>In my opinion it is normal use of a sidebar that is has elements, like navigation and advertisements, that will always be there. But when I have to take the above example serious, I can have a problem, because they explain not to use a &lt;aside&gt; element because: that will persist on every page..<\/p>\n<p>Hope somebody would like to contribute to this problem.<\/p>\n<p>Kind regards,<\/p>\n<p>Willem-Siebe<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Hi all, My name is Willem-Siebe and I hope I found the right place here to have some good discussions about the correct use of HTML5. I&#8217;m not sure if I should use one of the three mailinglists or write &hellip; <a href=\"https:\/\/www.w3.org\/community\/html5spec\/2013\/09\/03\/correct-use-of\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":5044,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_s2mail":"yes","footnotes":""},"categories":[14],"tags":[],"class_list":["post-71","post","type-post","status-publish","format-standard","hentry","category-semantics"],"_links":{"self":[{"href":"https:\/\/www.w3.org\/community\/html5spec\/wp-json\/wp\/v2\/posts\/71","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.w3.org\/community\/html5spec\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.w3.org\/community\/html5spec\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.w3.org\/community\/html5spec\/wp-json\/wp\/v2\/users\/5044"}],"replies":[{"embeddable":true,"href":"https:\/\/www.w3.org\/community\/html5spec\/wp-json\/wp\/v2\/comments?post=71"}],"version-history":[{"count":2,"href":"https:\/\/www.w3.org\/community\/html5spec\/wp-json\/wp\/v2\/posts\/71\/revisions"}],"predecessor-version":[{"id":73,"href":"https:\/\/www.w3.org\/community\/html5spec\/wp-json\/wp\/v2\/posts\/71\/revisions\/73"}],"wp:attachment":[{"href":"https:\/\/www.w3.org\/community\/html5spec\/wp-json\/wp\/v2\/media?parent=71"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.w3.org\/community\/html5spec\/wp-json\/wp\/v2\/categories?post=71"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.w3.org\/community\/html5spec\/wp-json\/wp\/v2\/tags?post=71"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}