Skip to content

Landmark Practice: Update alignment between HTML aside element and ARIA complementary role#3418

Open
NakajimaTakuya wants to merge 5 commits into
w3c:mainfrom
NakajimaTakuya:fix/landmark-aside
Open

Landmark Practice: Update alignment between HTML aside element and ARIA complementary role#3418
NakajimaTakuya wants to merge 5 commits into
w3c:mainfrom
NakajimaTakuya:fix/landmark-aside

Conversation

@NakajimaTakuya

@NakajimaTakuya NakajimaTakuya commented Mar 6, 2026

Copy link
Copy Markdown
Contributor

I have revised the description of complementary roles where it now appears to be inaccurate.

  • The description that the aside element uniformly has the complementary role.
  • The description that the complementary role is a top-level landmark role

According to html-aam, it appears that the complementary role is now assigned to aside elements only in two specific cases: when they are in the context of a body or main element, and when they have an accessible name.

related: w3c/html-aam#350

(I'm not a native English speaker, so I'd appreciate it if you could suggest corrections if my writing seems awkward.)

Preview

Preview the landmarks practice page in the compare branch


WAI Preview Link (Last built on Thu, 14 May 2026 10:42:30 GMT).

@mcking65 mcking65 changed the title fix the relationship between the aside and complementary roles Landmark Practice: Update alignment between HTML aside element and ARIA complementary role Mar 18, 2026
@joelamyman joelamyman self-requested a review March 18, 2026 16:45
@daniel-montalvo daniel-montalvo self-requested a review March 18, 2026 16:45
@jugglinmike

Copy link
Copy Markdown
Contributor

The ARIA Authoring Practices (APG) Task Force just discussed this issue.

The full log of that discussion

Matt_King: the contributor is trying to align with what HTML says about “aside”
Matt_King: I haven’t reviewed the spec recently
Matt_King: for right now, I would love to designate someone who would love to “run point” on the technical entails of this pull request–does it say what we need it to say, and are the details justified?
joe: I can review
daniel: I can review as well
Matt_King: I really appreciate that someone from the outside is paying close attention

@jongund

jongund commented Mar 18, 2026

Copy link
Copy Markdown
Contributor

Related to this issue is the ARIA in HTML spec for aside also needs to be updated.

@jongund

jongund commented Mar 18, 2026

Copy link
Copy Markdown
Contributor

The aside element is behaving as specified in the AAM, but seems under specified in the AAM and ARIA in HTML specification based on testing.

Did some additional testing by making a test page and the aside element produces a complementary landmark in the context of body, main, header and footer elements, but not in the context of section, nav, form and other aside elements, unless it has an accessible name.

@NakajimaTakuya

Copy link
Copy Markdown
Contributor Author

@jongund

Thank you for verifying this.
I hadn’t realized that they are evaluated as complementary even in the header and footer contexts. I confirmed through my own testing that they are indeed treated that way.
However, since this seems to conflict with the documentation for html-aam, should we wait for the outcome of the discussion regarding html-aria for now?

@mcking65

mcking65 commented Apr 1, 2026

Copy link
Copy Markdown
Contributor

Ya, seems like there may be bugs in the chrome and Firefox implementations.

APG should be aligned with the spec, so we should get confirmation that the spec does not intend unnamed asides to be complementary in header and footer. I don't think it would be good for users if aside generated complementary landmarks in header and footer.

@mcking65 mcking65 added this to the 2026 May publication milestone Apr 1, 2026
@css-meeting-bot

Copy link
Copy Markdown
Member

The ARIA Authoring Practices (APG) Task Force just discussed PR 3418: Landmark Practice: Update alignment between HTML aside element and ARIA complementary role by NakajimaTakuya.

The full IRC log of that discussion <jugglinmike> subtopic: PR 3418: Landmark Practice: Update alignment between HTML aside element and ARIA complementary role by NakajimaTakuya
<jugglinmike> github: https://github.com//pull/3418
<jugglinmike> Matt_King: jongund_ commented on this pull request, but it belongs to someone else
<jugglinmike> jongund_: Aside only generates complimentary roles if it's in the scope of the body element, the main element, or the header or footer element
<Daniel> q+
<jugglinmike> jongund_: But I also noticed that if you're using role=navigation or role=region, then that seems to impact the behavior
<jugglinmike> Matt_King: The purpose of the AAM update was to limit it. It was supposed to be only complimentary if it was in the scope of body or main
<jugglinmike> Matt_King: The fact that it's doing it inside of header or footer seems to be a bug. Those should be getting ignored (not complimentary)
<jugglinmike> jongund_: Chrome and Firefox are not ignoring under those circumstances
<jugglinmike> Matt_King: That seems like a bug to me
<jugglinmike> Matt_King: Is the text of the pull request correctly reflecting what the guidance should be? Or are you saying that the text in the pull request needs to be updated?
<jugglinmike> jongund_: I saw the links to the AAM, but I didn't recognize that there was text to be reviewed. I will take a look offline
<jugglinmike> ack Daniel
<jugglinmike> Daniel: There are places where you need to create a complimentary within an aside. I was worried that we were enforcing a restriction across the board. But if the restriction only applies when it doesn't have a name, then I think that's fine
<jugglinmike> Matt_King: I think that's what the HTML AAM language says
<jugglinmike> Matt_King: This pull request in the APG isn't to say what should happen, of course. It's just to reflect what the specifications tell people
<jugglinmike> Matt_King: So I want to make sure the language in the APG is aligned with the specification
<jugglinmike> Matt_King: For what it's worth, I'm aligned with you. Just like with the section element--when it's named, then it will get revealed as a landmark
<jugglinmike> jongund_: I filed an issue for the HTML and ARIA spec to say that it isn't aligned with AAM
<jugglinmike> Daniel: One of the reasons it hasn't been addressed yet is because we're trying to publish what we're calling a "revised recommendation" to include the changes that have been made since 2021
<jugglinmike> Daniel: And this is making me think we may want to hold off on publishing that until we've resolved this issue
<jugglinmike> Matt_King: If the AAM says that unnamed asides should only be complimentary when in body or main, then I think somebody needs to raise some bugs against Firefox and Chrome
<jugglinmike> Matt_King: In any case, the goal here is to align the APG with the AAM

@css-meeting-bot

Copy link
Copy Markdown
Member

The ARIA Authoring Practices (APG) Task Force just discussed PR 3418: Landmark Practice: Update alignment between HTML aside element and ARIA complementary role by NakajimaTakuya.

The full IRC log of that discussion <jugglinmike> subtopic: PR 3418: Landmark Practice: Update alignment between HTML aside element and ARIA complementary role by NakajimaTakuya
<jugglinmike> github: https://github.com//pull/3418
<jugglinmike> Matt_King: The last time we discussed this, jongund had review it, but he hadn't actually looked at whether or not the content changes were aligned with the HTML-AAM.
<jugglinmike> Matt_King: Last time we talked about this, we talked about some potential bugs in Firefox--but that isn't relevant to the pull request
<jugglinmike> Matt_King: What's relevant is whether the text correctly reflects the HTML-AAM, so I think this still needs your review, jongund
<jugglinmike> Jem_: Joe is also marked as a reviewer, so we should nudge Joe
<jugglinmike> Matt_King: Daniel is also listed as a reviewer
<jugglinmike> Daniel: Ah, yes, now I remember. On the WAI website, we have an implementation that just uses summary and details that operates like an accordion
<jugglinmike> Matt_King: That was a different issue, actually.
<jugglinmike> Matt_King: This issue is related to the "aside" element and how our guidance doesn't currently reflect recent changes to the AAM. The author has proposed change that he believes will align our guidance
<jugglinmike> Daniel: I have been speaking with Valerie to add this to the ARIA group's agenda on Thursday
<jugglinmike> Matt_King: Okay, thanks for doing that. That's good

@joelamyman joelamyman left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These proposed changes look like an excellent step in the right direction!

I'm not 100% confident in my feedback as landmarks aren't my strong suit, however, after reviewing the AAM and the ARIA spec, I think that there may be a few minor wording changes needed, just to ensure that this accurately reflects the usage specified in both documents.

<tbody>
<tr>
<td><code>aside</code></td>
<td><code>aside</code> if it is in the context of a <code>body</code> or <code>main</code> element. Or if it has an accessible name provided by <code>aria-labelledby</code> or <code>aria-label</code></td>

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

After reviewing the AAM spec, this is accurate. I wonder if it would be useful to mention that the AAM specifies that if it's if the aside is scoped to a sectioning content element and has an accessible name?

For example:

<code>aside</code> if it is in the context of a <code>body</code> or <code>main</code> element. Or if it is scoped to another sectioning content element and has an accessible name provided by <code>aria-labelledby</code> or <code>aria-label</code>

At the same time, I appreciate this is starting to become a bit lengthy, so please feel free to dismiss this! 😅

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we need a comma before the 'or' and we could shorten the text by eliminating the naming techniques:

aside if it is in the context of a body or main element, or if it is scoped to another sectioning content element and has an accessible name.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

if we were to remove the naming technique from the ro in the table for 'aside", then we'd probably want to remove it from the row about 'section' as well for editorial consistency. I'm not sure which is better, in this case -- brevity or clarity.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@joelamyman @mcking65

Thank you. I’ve added the description regarding the scope.
Also, regarding the issue of the text being too long, I’ve adopted the method you suggested to simplify the process for setting accessible names.

f47c745


<ul>
<li>Assign landmark roles based on the type of content in the area.</li>
<li><code>banner</code>, <code>main</code>, <code>complementary</code> and <code>contentinfo</code> landmarks should be top level landmarks.</li>

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure about removing complementary from this list - the ARIA spec states that:

A landmark that is designed to be complementary to the main content at a similar level in the DOM hierarchy, but remaining meaningful when separated from the main content.

Therefore, it's my understanding that the primary purpose of this landmark is to be positioned alongside the main content, so it would make sense for it to be a top level landmark. Does this make sense?

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Correct, it seems to me that complementary should not be removed.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@joelamyman @mcking65
Sorry for the late reply.
You're right—if we assume the goal is to complement the “main” file, then that makes sense.
I've restored it.

5c4d7bd

</p>

<ul>
<li><code>complementary</code> landmarks should be top level landmarks (e.g. not contained within any other landmarks).</li>

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Given that the AAM specifies that it's possible for the complementary role to apply to an aside scoped to other sectioning content elements, this makes sense to be removed!

<h4>HTML Technique</h4>

<p>Use the HTML <code>aside</code> element to define a <code>complementary</code> landmark.</p>
<p>The HTML <code>aside</code> element defines a <code>complementary</code> landmark when has an accessible name (e.g. <code>aria-labelledby</code>, <code>aria-label</code>).</p>

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Similar to my earlier comment, I wonder if this needs to specify both options, so maybe something like:

<ul>
  <li><p>The HTML <code>aside</code> element defines a <code>complementary</code> landmark when its context is the <code>body</code> or <code>main</code> element.</p></li>
  <li><p>The HTML <code>aside</code> element defines a <code>complementary</code> landmark when its context is another sectioning content element, and when it has an accessible name (e.g. provided using either the <code>aria-labelledby</code> or <code>aria-label</code> attributes).</p></li>
</ul>

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@joelamyman
Thank you. You were right, so I’ve made the correction.
c105f5a

@mcking65 mcking65 removed this from the 2026 May publication milestone Apr 29, 2026
@daniel-montalvo

Copy link
Copy Markdown
Contributor

Discussed in 29 April meeting

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

8 participants