HTML <aside> Tag

If this site has been useful, we’d love your support! Consider buying us a coffee to keep things going strong!

Description

The <aside> tag is used to define content that is indirectly related to the main content of a webpage. It typically contains supplementary information such as side notes, callouts, related links, advertisements, author bios, or contextual information that enhances the primary content without being essential to it.

Content inside an <aside> is usually displayed as a sidebar or highlighted section, but its actual appearance depends on the CSS styling applied. While visually separated, the content should still be relevant to the surrounding content.

The <aside> element improves semantic structure, helping search engines and assistive technologies better understand the relationship between main content and supporting information.

Common Uses

Related articles or links
Pull quotes or highlights
Advertisements or promotions
Author information or bios
Tips, notes, or warnings

Example

<aside>
  <h3>Did You Know?</h3>
  <p>The aside tag is often used for sidebars or supplementary content.</p>
</aside>

Notes

The <aside> tag can be placed inside or outside of the main content.
It should not be used for content that is essential to understanding the main topic.
Works well with semantic elements like <main>, <article>, and <section>.

Properties

Permitted Parents: Any element that accepts flow content. Note that an <aside> element must not be a descendant of an <address> element.
Content: Block, inline and text
Start/End Tags: Start tag: required, End tag: required

Example

HTML

<p>The Great Barrier Reef is the largest coral reef in the world.</p><aside><p>The Great Barrier Reef is the world's largest coral reef system composed of over 2,900 individual reefs and 900 islands stretching for over 2,600 kilometres over an area of approximately 344,400 square kilometres.</p></aside>

Result

Editor

Attributes

None

Global Attributes

The <aside> tag also supports the Global Attributes in HTML5

Event Attributes

The <aside> tag also supports the Event Attributes in HTML5

Browser Support

The following information will show you the current browser support for the HTML <aside> tag. Hover over a browser icon to see the version that first introduced support for this HTML tag.