Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML HTML Basics Structuring Your Content Marking Up a Blog Post

J.Ryan Moss
J.Ryan Moss
1,202 Points
Posted by J.Ryan Moss
J.Ryan Moss
1,202 Points

Why do I need an aside tag around my <h3> if without one my content still shows up the same in my browser???

<!DOCTYPE html> <html> <head> <title>VR Article</title> </head>

<body> <header> <h1>Experience VR</h1> <p>A simple blog about virtual reality experiences</p>

  <nav>
    <ul>
      <li><a href="#">Home</a></li>
      <li><a href="#">About</a></li>
      <li><a href="#">Articles</a></li>
      <li><a href="#">Contact</a></li>  
    </ul>
  </nav>

</header>

<article> <h2>VR Article</h2> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus ultrices euismod turpis eget porta. Etiam nulla massa, pretium et massa nec, ornare dignissim nisi.</p> <aside> <q>This is a pulled quote from the VR article.</q> </aside> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus ultrices euismod turpis eget porta. Etiam nulla massa, pretium et massa nec, ornare dignissim nisi.</p> </article>

<aside> <h3>More Articles about VR</h3> <ul> <li><a href="#">Make a VR</a></li> <li><a href="#">Learn VR in Unity</a></li> <li><a href="#">Build User Interface in VR</a></li> </ul> </aside>

<footer>
  <p>&copy; 2017 Experience VR, The Blog</p>
</footer>

</body> </html>

3 Answers

Bruno Navarrete
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Bruno Navarrete
Full Stack JavaScript Techdegree Graduate 22,246 Points
Bruno Navarrete
.a{fill-rule:evenodd;}techdegree seal-36
Bruno Navarrete
Full Stack JavaScript Techdegree Graduate 22,246 Points

HTML5 prioritizes semantic content, so the <aside> tag will help both the developer and the browser know that the <h3> is not part of the main content. It will also help you style the whole <aside> element when using CSS.

J.Ryan Moss
J.Ryan Moss
1,202 Points
J.Ryan Moss
J.Ryan Moss
1,202 Points

Great I understand a lot better. Thank you Bruno

nfs
nfs
35,526 Points
nfs
nfs
35,526 Points

Hey, J.Ryan Moss, I found this article very helpful. Hope this helps you too...

Happy coding

Ari Misha
Ari Misha
19,323 Points
Ari Misha
Ari Misha
19,323 Points

Hiya!! The <aside> tag defines some content "aside" from the content it is placed in. The "aside" content should be related to the surrounding content. Its not a part of main content but it relates to it in many ways. Its mostly used for sidebar content and stuff, where ya display other blog posts and whatnot. I hope it helped (: