Non-aria way to declare an svg as presentational

[scottaohara]

As with the img element, it seems to me there should be a way to mark svgs as decorative without having to resort to using aria-hidden=true or role=none on the svg element.

I'm logging this issue here because i'd like to hope this might be possible by leveraging existing svg features / specifying this in the svg aam, rather than creating a new attribute. but maybe that's not possible. and if that's the case, then this issue can be closed in favor of a new issue against the svg spec for such a feature.

[cookiecrook]

What's wrong with leaving it as display:none or role=none? It works. It's reasonably understood by authors.

One request if the decision is to add something anyway: Please make it backward compatible, similar to the way HTML implemented the boolean hidden attribute as a user agent style sheet rule:

[hidden] { 
  display: none;
}

[scottaohara]

those should remain / still work. but the role=none or aria-hidden=true approach is more in line with the img alt="" that i was wondering about the appetite to replicate.

an existing way that i could potentially see for doing this would be to have an svg that had an empty title

<svg>
  <title></title>
  ...
</svg>

so if that were the case, treat it as an implicit role=none, and specifically role=none and not aria-hidden=true so that if someone did have content that would be important to accessibility within that svg, then it could still be present in the a11y tree. like <text> or an <image> or any element with its own aria attributes.

an svg can be marked as decorative if its rendered with the img element and an alt="", but people shy away from doing that because they might want to use that svg as a decorative icon that should respond to CSS color changes (dark mode, high contrast, or general hover/focus, etc. user interactions on its parent element)

hopefully that helps add some context prior to talking about this more when it is on the agenda.

[cookiecrook]

an existing way that i could potentially see for doing this would be to have an svg that had an empty title

seems like that could just as easily be accidental though, perhaps even more easily accidental than alt=""

[scottaohara]

yeah, i can't disagree with that. which may mean that maybe using an existing feature like that / an existing feature at all wouldn't be possible. and if that's the case, maybe this has to be a feature request for svgs, and not something that can handled just in svg aam.

but that's why i wanted to talk this out - see what others thought and then close if there's nothing that currently exists that might be able to facilitate.

[stevefaulkner]

what is the objection to using role=none as previously suggested?

[stes-acc]

what is the objection to using role=none as previously suggested?

Because "role" is ARIA which is not what was been asked for in this thread 😉

I would always use role="none" and aria-hidden="true" in a heartbeat for such things, because it is simple and elegant.

How this maps to an adequate HTML construct is a different question. I think HTML would be overstressed here to serve well.

[stevefaulkner]

@stes-acc

the role attribute itself is not ARIA, it is defined elsewhere 😉

[ROLE-ATTRIBUTE] Role Attribute 1.0. Shane McCarron et al. W3C. 28 March 2013. W3C Recommendation. URL: https://www.w3.org/TR/role-attribute/

[stes-acc]

@stevefaulkner

Maybe nit-picking but already in the abstract of Role Attribute 1.0 it is mentioned that

The role attribute is necessary to support Accessible Rich Internet Applications (WAI-ARIA) [WAI-ARIA] ..

In that sense I mean that.

"Because "role" is ARIA "

I am willing to change that to "ARIA-related" 😉

Also I doubt that role=none alone will do the trick in an unmistakable way.

[scottaohara]

closing in favor of the SVG issue just filed.

[spectranaut]

Notes from today's meeting: https://www.w3.org/2024/08/22-aria-minutes#t07