HTML HTML Tutorial HTML Forms HTML Graphics HTML Media HTML APIs HTML Tags



HTML Tag: aside

The <aside> tag is an HTML5 element that is used to define content that is related to the main content of a web page, but is not necessarily a part of it. The content inside the <aside> tag is typically presented as a sidebar or a block of content that is separate from the main content of the page.

The <aside> tag is often used to provide additional information or context to the main content of a web page. This can include things like related articles, advertisements, or other content that is related to the main topic of the page.

Brief Explanation about HTML Tag: aside

The <aside> tag is a semantic HTML element that is used to provide additional information or context to the main content of a web page. It is typically used to present content that is related to the main topic of the page, but is not necessarily a part of it.

The <aside> tag can be used in a variety of ways, depending on the specific needs of the web page. For example, it can be used to present related articles, advertisements, or other content that is related to the main topic of the page. It can also be used to present additional information or context about the main content of the page, such as a summary or a list of key points.

One of the key benefits of using the <aside> tag is that it helps to improve the accessibility and usability of a web page. By providing additional information or context to the main content of the page, users are able to better understand the purpose and context of the content they are viewing.

Code Examples in Per Tags

Here are some examples of how the <aside> tag can be used in HTML:

Example 1: Basic Usage

In this example, the <aside> tag is used to present a block of content that is related to the main content of the page:

<article>
  <h1>Article Title</h1>
  <p>Main content of the article goes here...</p>
  
  <aside>
    <h2>Related Articles</h2>
    <ul>
      <li><a href="#">Related Article 1</a></li>
      <li><a href="#">Related Article 2</a></li>
      <li><a href="#">Related Article 3</a></li>
    </ul>
  </aside>
</article>

Example 2: Providing Additional Information

In this example, the <aside> tag is used to provide additional information about the main content of the page:

<article>
  <h1>Article Title</h1>
  <p>Main content of the article goes here...</p>
  
  <aside>
    <p>This article was last updated on January 1, 2021.</p>
  </aside>
</article>

Example 3: Including Advertisements

In this example, the <aside> tag is used to include advertisements that are related to the main content of the page:

<article>
  <h1>Article Title</h1>
  <p>Main content of the article goes here...</p>
  
  <aside>
    <h2>Advertisements</h2>
    <ul>
      <li><a href="#">Advertisement 1</a></li>
      <li><a href="#">Advertisement 2</a></li>
      <li><a href="#">Advertisement 3</a></li>
    </ul>
  </aside>
</article>

References

Activity