This is an archived snapshot of W3C's public bugzilla bug tracker, decommissioned in April 2019. Please see the home page for more details.
"Using ARIA in HTML" could be more clear if markup that represents the accessibility tree was styled differently than markup from the html it's derived from, for example a different color, different case, maybe right-aligning the block. Maybe even consider making the tag names accessibility-specific, like this: html tree: <h1 role="button">text</h1> accessible tree: <AccessibleButton>text</AccessibleButton> That would really stress the fact that accessibility objects are parallel to the html tree, but distinct, and that the roles are not a perfect 1:1 match.
This may improve its readability. Perhaps we can use color as long have the words "accessibility tree", or "HTML tree" above each one so it is being distinguished by the sentence prior to the code, Then it could pass WCAG SC 1.4.1. I'm a little shy to use the words, html tree: Accessibility tree: inline with the code, besides the sentences before the code says that... So I think the color change would satisfy this bug. I'll try blue text for the accessibility tree.
The text colour for code had an !Important on it so I left the same colour and provided a light yellow background for accessibility tree, and made the text clear between the html tree and accessibility tree... I think that should address this issue.