Landmark Practice: Update alignment between HTML aside element and ARIA complementary role#3418
Landmark Practice: Update alignment between HTML aside element and ARIA complementary role#3418NakajimaTakuya wants to merge 5 commits into
Conversation
|
The ARIA Authoring Practices (APG) Task Force just discussed this issue. The full log of that discussionMatt_King: the contributor is trying to align with what HTML says about “aside” |
|
Related to this issue is the ARIA in HTML spec for aside also needs to be updated. |
|
The Did some additional testing by making a test page and the |
|
Thank you for verifying this. |
|
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. |
|
The ARIA Authoring Practices (APG) Task Force just discussed 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 |
|
The ARIA Authoring Practices (APG) Task Force just discussed 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
left a comment
There was a problem hiding this comment.
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> |
There was a problem hiding this comment.
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! 😅
There was a problem hiding this comment.
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.
There was a problem hiding this comment.
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.
There was a problem hiding this comment.
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.
|
|
||
| <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> |
There was a problem hiding this comment.
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?
There was a problem hiding this comment.
Correct, it seems to me that complementary should not be removed.
There was a problem hiding this comment.
@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.
| </p> | ||
|
|
||
| <ul> | ||
| <li><code>complementary</code> landmarks should be top level landmarks (e.g. not contained within any other landmarks).</li> |
There was a problem hiding this comment.
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> |
There was a problem hiding this comment.
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>
There was a problem hiding this comment.
@joelamyman
Thank you. You were right, so I’ve made the correction.
c105f5a
|
Discussed in 29 April meeting |
and omitted the instructions for setting the name
I have revised the description of complementary roles where it now appears to be inaccurate.
asideelement uniformly has the complementary 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).