rem

@rem

← but some part is blaring and perfect →

i'm ian, i've got music in my pores—but i love reading, tinkering, and experimenting pretty holistically: a mile across, but only a few inches deep in places. you probably have got an adequate intuition for that if you're here

@ıI||||||Iı#ıI||||||Iı@ıI||||||Iı#ıI||||||Iı@ıI||||||Iı

(abridged) list of current projects:

🎼 ⇒ final revisions, electronica LP
🀄 ⇒ svg timeline, china's dynastic history
♟ ⇒ mixed media video essay, chess history

#ıI||||||Iı@ıI||||||Iı#ıI||||||Iı@ıI||||||Iı#ıI||||||Iı@

learning chinese ⇒ 🀄 ⇒ @cidian
〃to be a person ⇒ 🦒 ⇒ @aquamanile

✨X≡¤≈∶∓⹀)⁄⁏;-ɐ±‥≁ɚ×—≡¤≈∶⹀⁏|∣-♯‥≁ɚ×✨

🧿🏡🧿 ⇒ https://ianremsen.nand.sh
🎶🎼🎛 ⇒ https://audio.com/ia.remsen
🔡🗨🔡 ⇒ @​iar:matrix.org
🐘⚗🐘 ⇒ @ian@​cathode.church
🐘🎹🐘 ⇒ @ian@​musicians.today

last.fm listening

log in
rem
@rem

does anyone have any best common practices with making the potentially avant-garde online accessible?

like, i'm making web content that's intentionally a bit idiosyncratic, with like inline text art and such, are there things i should always be doing with ARIA and so on to make sure it's not getting in the way of people using screen readers, etc. etc.?

  1. Fairly Normal. Like you describe, on my homepage i have a lot of emoji, and inevitably various non-emoji unicode codepoints from varyingly obscure or exotic blocks.
  2. language nonsense. i already know about the lang tag but on pages like this one, do most screen readers generally expect you to tag every instance of any character in a non-main language?
  3. dynamic stuff, like the tooltips on that same page.
  4. i wanna make unicode art proper, i assume the best thing to do is just title it and make sure it doesn't try to read out the string?
  1. i type stuff weird sometimes in a way that a screen reader might not understand. (i.e. 'the whole #!' for 'the whole shebang', is there a way to have that worked with?
You must log in to comment.

in reply to @rem's post:

eladnarra
@eladnarra

Can you give an example of what you mean by inline text art? Is it like ascii art and/or like text emojis like this table flip dude? (⁠╯⁠°⁠□⁠°⁠）⁠╯⁠︵⁠ ⁠┻⁠━⁠┻

login to reply
rem
@rem
  1. Fairly Normal. Like you describe, on my homepage i have a lot of emoji, and inevitably various non-emoji unicode codepoints from varyingly obscure or exotic blocks.
  2. language nonsense. i already know about the lang tag but on pages like this one, do most screen readers generally expect you to tag every instance of any character in a non-main language?
  3. dynamic stuff, like the tooltips on that same page.
  4. i wanna make unicode art proper, i assume the best thing to do is just title it and make sure it doesn't try to read out the string?
  1. i type stuff weird sometimes in a way that a screen reader might not understand. (i.e. 'the whole #!' for 'the whole shebang', is there a way to have that worked with?
login to reply
eladnarra
@eladnarra
  1. For those emojis, I'd say first you'd decide if they were decorative or not. If they're not (and they may be important to convey the feel of the page!), you can check out Providing text alternatives for emojis, emoticons, ASCII art, and leetspeak. For emojis within words, I'm not 100% certain, but @easrng's method might make those more readable.
  2. It sounds like everything does require a lang tag. In the case of different character sets, I believe Chinese characters might even end up completely skipped if they don't have a lang tag on an otherwise English page.
  3. I'm on mobile so I haven't seen these- but generally for mobile and keyboard users, anything involving a hover must be coded so someone can get to it another way.
  4. I think the link in #1 shows some techniques for this.
  5. I don't know the definitive way to do this, but I think @easrng's method works. Just be mindful of links - I'm pretty sure if you use visually hidden/screen reader text at the beginning of a link, sighted people using voice recognition might have issues activating the link (because they aren't saying the actual name of the link).
login to reply
eladnarra
@eladnarra

Oh, also! NVDA is a free screen reader for Windows, and Macs come with Voiceover. I recommend trying them out to see how things sound. I'm not a screen reader user, so I'm still learning the conventions and the ways things are supposed to sound (so I may miss some errors), but it's still helpful for catching blatantly wrong stuff.

login to reply
phi
@phi
  • alt text for images
  • normal text alternative using ARIA for animated text or text that would otherwise not be read correctly by screen readers (markdown plus already does this by default)
  • respecting limited motion options in css animations
  • avoiding/tagging/warning about rapidly flashing lights

That's teh gist of it, as far as common etiquette goes. I also tend to avoid using typing quirks too much in informational text.

login to reply
easrng
@easrng

you can do things like the whole <span class="visually-hidden">shebang</span><span aria-hidden="true">#!</span> (steal .visually-hidden from bootstrap if you aren't using a framework that has it already (sometimes it's called .sr-only instead)). the firefox accessibility inspector is helpful for checking how things will be read, but it's not perfect, you'll need to test with an actual screen reader to be sure.

login to reply
Pinned Tags