Skip to content

Subliminal Learning

Let's talk about accidentally teaching something while explaining something entirely different. Conveying a message within the message. Presenting the reader with information we aren't even really covering.

I didn't study psychology. I'm not big in educational science, either. There may very well be an official term for the thoughts I'm calling Subliminal Learning. Maybe Scientia doctrina inter lineas. Wouldn't that be giving this line of though much more substance? Anyway, this blog post is a question, not wisdom I'd like to share.

I've recently proof-read an article that contained a bit of example code. An HTML fragment that was used as the base of a tabbed panel implementation. Instead of using style="display: none" or class="hidden" or whatever, the author chose to use aria-hidden="true". There was no mention of accessibility. No explanation of what that weird-looking aria meant. Only the accompanying CSS [aria-hidden="true"] { display: none; } served as a hint to what this was supposed to accomplish. That was the only use of WAI ARIA in that article. But it was enough to get me interested.


To illustrate my point, have a look at this tab panel example using ARIA roles:

<div class="tabgroup">
  <ul role="tablist">
    <li id="tab1" aria-controls="panel1" role="tab" class="active">Tab 1</li>
    <li id="tab2" aria-controls="panel2" role="tab">Tab 2</li>
  </ul>
  <div id="panel1" aria-labeledby="tab1" role="tabpanel"></div>
  <div id="panel2" aria-labeledby="tab2" role="tabpanel" aria-hidden="true"></div>
</div>

Now compare that to markup we've come to expect to see in examples on the web:

<div class="tabgroup">
  <ul class="tablist">
    <li id="tab1" class="tab active">Tab 1</li>
    <li id="tab2" class="tab">Tab 2</li>
  </ul>
  <div id="panel1" data-for="tab1" class="tabpanel"></div>
  <div id="panel2" data-for="tab2" class="tabpanel hidden"></div>
</div>

Until today I thought of aria as something you add to your markup (and subsequently never really looked into it). Only now do I realize that you can actually use this in place of other (less semantic) things you did.


Earlier I said I was going to ask a question, so here it is: Would I know more about WAI ARIA, had I seen it used in "everyday code examples" rather than only in articles covering accessibility? I think I would.

I would have - most probably - not looked up WAI ARIA at first. In fact, I would've probably just started using it - the way the examples taught me - without giving it a closer look. After all, it was quite a number of years after I started with web development, that I had my first look at an official specification document. The thing is, we learn a couple of things and we infer from there. (and by "we" I mean "me")

We tend to search for answers to the problem at hand. The above example shows a tab panel, so I'd likely be looking for something explaining how that works. All that aria stuff in there is just something I would pick up along the way. Possibly using it as a base to start investigations from the next time 'round. It's clearly not necessary information to build a tab panel - but it's important if you want to get it right.


The same holds true for pretty much everything else we know. How to write easily testable code is left up to articles covering the topic of testing. The problem is, people have to know that testing/testability is a thing to go looking for information on it. They're not - accidentally or consciously - nudged in the right direction. ("right direction", whatever we think that is…)

I remember Chris Heilmann explaining to me the problem he saw with the efforts to propagate HTML5 throughout the software industry (yep, the "enterprise" thingie). We are speaking at conferences for people interested in the web. We are writing articles for people interested in the web. Unless you're interested in the web, you're not going to attend our conferences, you're not going to read our blogs. We are - quite literally - preachingliving in an echo chamber. We reach the people we've always reached, but not those that could actually benefit the most.

I think we're experiencing a similar problem when writing about ES6 and calling it "ECMAScript6: The Future of JavaScript". Unless we start using WeakMap in code examples that are not about ES6, the majority won't care. Unless we start using role attributes in articles about UI Components, the majority won't care.


I handed this post to a couple of people before publishing it. I got responses like »I had no idea that ARIA could be useful for more than accessibility alone« and »Now I'm using ARIA everywhere, at least the role attribute«. Doesn't that kind of prove my point?

But is this really the problem I make it out to be? I don't know. Can we do Better? We can certainly try!

Comments

Display comments as Linear | Threaded

No comments

The author does not allow comments to this entry