blep

caaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaat

@blep

type of creature

locationutc+2

 

posting about computers unfortunately


safari user here to break your css in the name of web diversity


it seems cohost doesn’t strip ARIA properties like aria-label!! i think it would be nice if posts with css crimes had a little bit of aria properties so they’re not completely inaccessible to e.g. screen readers. (i mean, if you already spent an hour making a post, i think adding some labels shouldn’t be too much to ask lol)

Update

my post is mildly incorrect!! (i only briefly tested it with VoiceOver and thought it was good enough to go… sorry) aria-label is primarily meant for interactive elements and may not work for static content. consider using aria-describedby for that instead.

Also see:

original post continues below:

don’t heed this
it’s very easy!! you can just add a short description to the container element:
<div aria-label="A short description of what this CSS crime is.">
  <!-- css crimes -->
</div>

and then accessibility tools will show or read this to the user when they select this element.

elements within will still be selectable, though. if the css crime is functionally equivalent to an image, then it’s probably okay to also add aria-hidden to anything inside. this makes accessibility tools pretend that those elements don’t exist.

<div aria-label="a css crime">
  <div aria-hidden="true">this is invisible to accessibility tools</div>
</div>

otherwise, consider adding aria-labels and appropriate roles* to elements (especially interactive elements). you can read more in The Documentation

*turns out role does get stripped… awh

ok that’s all i know!!!!

i should note that i myself dont use accessibility tools very often; i just read accessibility guidelines and hope im doing ok when writing websites. you should probably not consider anything i say to be authoritative