Thoughts on Accessible CSS.
I caught Stuart Robson’s post about accessible CSS on twitter today. if you have not read it yet go read it now, i will wait.
Read it? interesting right?
The basic idea is we could reduce the amount of code required in some situations by allowing CSS to include ARIA attributes. This would remove the duplicated code from the HTML and instead move it into a single place in the CSS.
This is an interesting idea and i dont think the answer is completely clear cut. However, after mulling it over lunch i think i would come down on the “lets not” side of the dicussion.
I have two reasons, document semantics and code clarity.
So in no patricular order:
HTML contains the structure and content of a document. I would consider ARIA roles part of the structure. They specifically tie elements to a structural meaning.
Having this structural content added via CSS means browsers would have to parse & process both the CSS & HTML before it had a semantically complete document. With external CSS this means two documents need downloading and processing before the full DOM can be built. This will slow down page rendering for very minimal benefit.
This also makes important accessibility APIs fragile, if for some reasons static assets are not loaded then the page looses some structure. At the BBC we serve static assets and HTML from separate systems. It’s very possible for pages to be served missing static assets.
Stuart makes a good point about developers not adding all the myriad of CSS prefixs when they use experimental features.
He postulates adding more properties to be missed is a problem. From this point i can see how the argument that having a single CSS property beats dozens of attributes evolves.
However, i’m not sure this is positive. It hides the true nature of the propery (semantic meaning) behind the styling and selection mechnism (CSS selectors). This is confusing!
For me this decreases the clarity of the code in hand. It introduces an extra layer for a developer to understand. Further to this, the mechnism is unique and thus has to be understood as an exception. Adding exceptions and breaking a well understood (simple-ish) model in order to make something quicker or easier feels somewhat self defeating. Its something else to forget about and maintain etc.
I’m not looking forward to answering the question about which is better between adding attributes in HTML or CSS dozens of times.
I think keeping exceptions to a minimuim results in a more understandable, consistant and learnable technology.
What do you think? These are my reactions after mulling it for a bit. I can see it would be useful, but i dont think that justifies the complexity and clarity costs.