HTML Tutorial

HTML Aside tag

HTML <aside> Tag

The <aside> tag is used to define content that is tangentially related to the content around it. It often appears as sidebars, pull quotes, or supplementary content. The <aside> element helps in structuring the page in a meaningful way.

When to Use <aside>?

Use <aside> to define content that complements the main content but isn't critical to its understanding. It’s typically used for side content like advertisements, links, or additional information.

Syntax

<aside>
  <h2>Related Links</h2>
  <p>Learn more about HTML and CSS on these resources: ...</p>
</aside>

Example

<!DOCTYPE html>
<html>
  <head>
    <title>Aside Example</title>
  </head>
  <body>

    <article>
      <h2>Understanding HTML</h2>
      <p>HTML is the foundation of web development. Learn about its elements and structure.</p>
    </article>

    <aside>
      <h2>Recommended Reading</h2>
      <p>Check out these resources for a deeper dive into HTML and web development.</p>
    </aside>

  </body>
</html>

Best Practices

Use <aside> for tangential content that complements the main content
Keep the content inside <aside> relevant but not essential to the main content
Place it near the main content where it is easily noticeable but doesn’t distract

Conclusion

The <aside> tag is great for displaying supplementary content like sidebars, quotes, or links that provide additional context to the main page content.

🌟 Enjoyed Learning with Us?

Help others discover Technorank Learning by sharing your honest experience.
Your support inspires us to keep building!

Leave a Google Review

Topics