Website Accessibility

March’s upcoming IndieWeb Carnival topic is going to be ‘Accessibility on the Personal Web’, hosted by orchids (of basement community). They posted this today as a sort-of preamble post: 4 of the most overlooked web accessibility issues. But I noticed their doesn’t seem to be an accessibility thread, so I thought I’d make one. To be honest, I don’t really know much of anything about accessibility myself… I’m familiar with the Accessible Net Directory and a11y-webring.club, but, since my site is a template, anything it does on this front wasn’t done by my hand.

I also noticed accessibility being mentioned in the What do you wish you knew when you started web-building? thread, so hopefully we can dive more into those things here. A bit worried I won’t be able to participate in the carnival so would love to hear potentially inspirational topics to tackle!

9 Likes

Oh, how exciting! Seems I made my website just in time.

I’m not an expert or professional, but I’m super interested in accessibility. I feel like in some cases it’s much easier than people expect, while in others it takes a bit of familiarity to notice issues.

The best way that I found to get more familiar with the nitty gritty is to follow accessibility professionals, like some of the people that I link to on my bookmarks page. There’s unfortunately a lot of outdated or earnest but misleading advice out there about accessibility, and it helps to go to knowledgeable sources.

Speaking of, I kind of disagree with a part of orchid’s article…

<a aria-label="go to homepage" href="/home">
    <img src="./logo.png" />
</a>

It’s much more appropriate in this case to add “home page” as the alt text for the image and to avoid using aria-label all together. After all, the first rule of ARIA is “don’t use ARIA.” :smiley:

5 Likes

thanks for the read @eladnarra! I actually chose the aria-label for links instead of title because of some prior reading on what properties are preferred in order where aria-labelledby is most preferred, aria-label is next, then as a last resort is title

under " 5.6.1.3. Text Alternative Computation" here:

https://www.w3.org/TR/wai-aria-implementation/

i’m no so sure I agree that the alt text for an image would be the best choice, since that property is more used to describe the contents of an image to people that use screen-readers.

Hi!

Yeah, definitely agree with you on title, it sounds like it’s inconsistent with screen readers.

Im no so sure I agree that the alt text for an image would be the best choice, since that property is more used to describe the contents of an image to people that use screen-readers.

Since the image is in a link, it counts as a functional image, so the alt text is a bit different — rather than describing the image, it should be the function or the destination (if it’s a link). This gives it an accessible name without using ARIA.

Um, anyway. :sweat_smile: I’m excited to write something for this month’s carnival! (And I’m sorry for coming out of the gate with a quibble on an unrelated forum — I intended to email you, but got distracted.)

@arevakhach - were you still interested in brainstorming ideas? (I’m realizing I took a detour from that.) Did you have any further thoughts?

huh learned something new then! in my case, I’m actually using both on my site, but using the alt tag to credit the artist who drew the logo. I wonder if there’s any clashes between that an the aria-label on some screen-readers:

and please do submit! we’ve already got a few submissions so far and I feel like the month is starting out strong

1 Like

I just write this for the Carnival. I should probably submit it via Basement Community, too.

1 Like

Nice! I need to post mine… Maybe split it into two parts because I’m not sure I’ll finish it if I don’t. :sweat_smile:

1 Like

@cheedle has posted the IndieWeb Carnival roundup:

2 Likes