Skip to main content

html-tags.com

<aside>

Content tangentially related to what surrounds it: pull quotes, related links, sidebars, callouts.

Baseline: Widely available · Sectioning & landmarks

When to use it

When the page would still make complete sense with the block removed.

When not to

Don't use it for content the flow depends on, and label it (aria-labelledby) when it has a heading.

Key attributes

aria-labelledby
points at the aside's heading

Example

<aside aria-labelledby='related-h'>
  <h2 id='related-h'>Related reading</h2>
  <ul><li><a href='/tags/section.html'>section vs article</a></li></ul>
</aside>
Rendered live above, source below.

Authoritative references