For the love of all that is holy, can you all please start using `` for navigation and `` for actions, not the other way around?
-
Marijke Luttekesreplied to Dan Fixes Coin-Ops last edited by
@ifixcoinops Working on it!
-
@carlton I don't think they're directly comparable.
Django has a canonical set of official docs to refer back to, as well as the code itself. Many tutorials are written to make those things more approachable, or tie multiple strands together in ways people may not find obvious. The information quite often (though not always) does already exist elsewhere, and that state of affairs provides a nice progression story for people wanting to dive in in more detail.
In accessibility, a lot of the literature out there is reactive rather than proactive. I include WCAG in this, which many people might point to as a canonical work. But in truth, it was written as an attempt to make sense of very messy things and get them down in writing, but the scope is extremely limited (and quickly becomes outdated). And with less content overall, there are less opportunities to cross reference.
That last point might sound like I'm encouraging more writing, rather than less. But there is a huge imbalance between "basic" topics that have been written to death, and more advanced ones that have zero resources (mostly because people get paid to consult on those and don't/can't write anything down).
-
Marijke Luttekesreplied to Marijke Luttekes last edited by
You asked, and I delivered. New blog post online:
"HTML link, or button, that is the question."
HTML link, or button, that is the question / Marijke Luttekes
Did you know that HTML links and buttons are not interchangeable? Learn more about their proper use cases in this article.
(marijkeluttekes.dev)
-
-
Rachel Wil Singh ~ Moos-a-deereplied to Marijke Luttekes last edited by
@mahryekuh not really relevant for my teacher peers building out their Canvas courses usually, but I'll still read it and use it in a blog post I'm writing oriented towards accessibility in courses! Thank you for the post.
-
@mahryekuh I was working on a codebase last week and someone wrapped an a with a button.
-
@troy Haha, oh dear. I hope you managed to persuade them from this path!
-
Marijke Luttekesreplied to Rachel Wil Singh ~ Moos-a-dee last edited by
@Moosader Thank you! Feel free to send an update once the article is out.
-
@mahryekuh well, technically speaking, "a" does stand for "action", you know. So I'm ok with using them for buttons (although "button" is a perfectly good element... But why would anyone use it for navigation? Seems like extra work. Unnecessary, if you ask me)
-
@GrahamDowns Are you serious?
-
@mahryekuh
<button type="a"> -
@mahryekuh Thanks for the nudge! I double-checked the menu HTML for my in-progress site conversion, and on mobile it uses <button> for expanding menu headings (which are *not* links in their own right) and <ul> <li> <a> for the actual menu content and links; and on desktop it uses just <ul> <li> <a> lists; so I guess I should be OK. Both with styling through CSS.
(My currently-online web site is slightly different because Reasons.)
I'm really *trying* to do the right thing!
-
@mkj I can’t judge your website from here, but I highly recommend this article about disclosure navigations:
Example Disclosure Navigation Menu
Accessibility resources free online from the international standards organization: W3C Web Accessibility Initiative (WAI).
Web Accessibility Initiative (WAI) (www.w3.org)
-
@mahryekuh you can do cursors with CSS, too.
I have one more point I may need to get back to, but great article, especially for categorically damning
<a href="#"with good reason. -
@mirabilos Before you get back to that other point; if it’s of the same level as setting cursors in CSS, please spare yourself the effort, I am aware of that.
-
@Optional Perfect. 10/10 no remarks. Ship it!
-
@mahryekuh no, it’s about the
inputs (specifically, checking if their button variants work on text browsers) -
@mirabilos Now that sounds interesting.
-
@mahryekuh You have a typo:
> Be aware that I will use the words "link" and "anchor" to refer to the HTML <a> attribute, ...
"attribute" should be "element".
I'd also suggest hiding the line numbers in code snipets with `aria-hidden`, because they prevent screen readers from conveying indentation properly. A solution that makes the line numbers more accessible would of course be better, but I don't know of one on the web.
