During an accessibility review all of the element anchors on /styleguide were flagged because they contain the deprecated name attribute, for example, <a name="a"></a>. I'm not certain that an up-to-date validator would flag these or not since WCAG dropped most HTML parsing as a requirement for compatibility.
I realize that this is probably a low-priority thing to change since this isn't meant to be a visitor-facing page. But I'm using the Styleguide during the development of a custom theme. Fixing this cuts WAY down on the amount of errors the validator throws when scanning the page. And it's one less false-positive that my reviewers will report to me once I turn them loose on the theme.
Move the anchor name to the id on the element heading.
Other changes:
aria-label and aria-describedby attributes to the element container.<p> to a <div>.
Show commandsStart within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
changes, plain diff MR !16
Comments
Comment #3
dcam commentedI don't know why the previous major test is failing. I don't have a D9 test environment on this machine because all our sites are on D10. I'll have to check it on my personal time later.
Comment #4
dcam commentedIt was failing on D9 because I used the
clean_unique_idTwig filter, which was introduced in D10.1. I initially changed it toclean_idbefore remembering that the point of putting it in was to guarantee the description id's uniqueness. So I took out the filter entirely. If this is committed after the D11 upgrade issue - which I hope will remove D9 compatibility - then you might consider reverting those two commits to restore theclean_unique_idfilter.Comment #5
dcam commentedI'm adding another change to the description wrapper. Currently the descriptions are wrapped in a
<p>tag.The only time that the item descriptions are used is for image styles. But those descriptions are themed as an item list. The resulting
<ul>are then wrapped by the<p>, which is invalid HTML. It would be better if the descriptions were wrapped in a<div>instead.Comment #7
dcam commented