Naming ::content – your bestest chums at the CSS Working Group want your help bikeshedding the name of the ::content pseudo-wotsit (they’re n00bs at bike-shedding). I chose “::content” because HTML is the content, regardless of shadow shenanigans.
Introducing WhatTF – “a taskforce that wants to define the CSS Box Tree(T) and its functionality(F). In other words we want to know What Tree Functions(WhatTF) are missing/needed from the web platform today in order to simplify or make CSS more powerful for our users”. As far as I can tell, bringing Extensible Web Manifesto principles to CSS. Update: now renamed “Project Houdini“.
Pinned Apps – An app model for the web some Righteous Thinking from my chums at Moz, which earns each of them an Xmas snog. “If you think of the current app store experience as consumers going to a grocery store to buy packaged goods off a shelf, the web is more like a hunter-gatherer exploring a forest and discovering new tools and supplies along their journey.”
VATMOSS by Remy Sharp. “I’ve considered blocking EU members from subscribing… I’ve considered just killing the business side of JS Bin … This legislation is killing business in the UK”. And here’s how Remy did it.
Responsible Web Components by Jeremy Keith: “Like Bruce, I’m worried about this year-zero thinking. First of all, I think it’s self-defeating. In my experience, the web technologies that succeed are the ones that build upon what already exists, rather than sweeping everything aside.”
(This is sort of a public service announcement as I get lots of visitors who come here from a search for “multiple sclerosis”.)
I’m a bit grumpy today, not just because I’m in bed with a temperature of 38.7, sweating and occasionally coughing so hard I eject alarmingly yellow blobs of what is presumably some gelatinous form of plutonium, but because I should be at the airport flying to Oslo (where my employers are headquartered) for a meet-up with my excellent team-mates and the notoriously Epicurean office Xmas party. But I’ve elected not to go.
“What’s that?”, you cry. “You – Bruce – who plays punk guitar, does kickboxing and wrestles poodles (and wins!) have turned into Shirley Temple!” you mock.
Here’s the reasoning, in the hope that if you are a merry new recruit to the world of MS (I’m a veteran of ’99), it’ll be some help to you.
When you’re newly diagnosed it’s quite normal to be in and out of your neurologists’s office so often that the staff greet you by first name and soon start darting into stock rooms or crouching behind desks as you approach. You’re new, you’re worried and every tiny twinge sets of your anxiety. Later on, particularly if your kind of MS is cyclical remitting-relapsing, you might breathe a sigh of relief and start to think ‘I won’t let this diagnosis change me!’ and potentially push yourself too far. It’s not a good idea to be an MS hero.
As you probably know if you have it, MS is a disease of the auto-immune system. In highly technical terms, think of an MS person’s immune system as being like a crowd of drunk Millwall FC fans waiting for the opposing fans to enter their stadium. When they see the opposition, they’ll beat them up. But once the opposition is defeated, they’ll very likely smash a few windows, beat up some police, their own friends, set fire to their neighbours’ cars and then turn on each other.
Getting even more scientific, there are no police or windows in your immune system, so it will attack your nerves instead, stripping their myelin sheaths which will never regenerate.
As I write this, my eyes hurt if I move them left, right, up or down. This isn’t much fun – you tend to turn your head instead of having to move your eyes which makes you look a bit like a robot in a sci-fi film. But when this happens to me it’s a warning signal. One of my first MS presentations was going effectively blind in my left eye because of Optic Neuritis, which is an inflammation of the optic nerve that makes your eyes painful and vision darkened. (Mine was dealt with by injecting anti-inflammatory goo just behind the eye, a procedure which was pretty low in chuckles.)
I also have an increase in what I call “fizzy fingers” (due to my incorrigible love of alliteration). This is when my fingertips feel numb or full of “pins and needles”. I always have this to some extent – it’s why I can’t play guitar properly any more – and, to my eternal regret, it’s my own fault. When I was eventually diagnosed (3 years after the optic neuritis) my hands were basically not obeying orders – my handwriting was a scrawl, I couldn’t do my own buttons up etc. But I heroically soldiered on before eventually being admitted to hospital and being put on 1000mg of steroids daily in the medical equivalent of tear-gassing the rioting Millwall fans and shutting your immune system down so it can’t do any more damage. But the damage already done can’t be reversed.
So these days, when I get a little bit of a cold I soldier on. But when I start to get other more sinister signs, I give up and take to my bed. While I know that my team mates would love to sit in a room with me and my pathogens, inhaling the gift of a Christmas fever to take to their loved ones, and I understand that the ladies of Oslo have spent many weeks putting up welcoming street decorations, I’m vegging out until the auto-immune Millwall fans go back to their mums’ houses. (From 15 years’ experience, a couple of days.)
It’s not worth being heroic when the risk is irreparable damage (and I have 2 dependant kids, too). Your MS will be different; your level of heroism may be different. Good luck and take care.
M dot or RWD. Which is faster? – initial research on the top 1,000 mobile websites concludes that “m dot” sites are 50% slower for time to first byte, and “RWD sites are VERY competitive on Visually Complete and SpeedIndex scores. The median values are within 5% for both metrics. Even though it appears that RWD is faster, there is enough fluctuation in the data that we should probably call it a dead heat.”
Iterators gonna iterate – Iterators. They’re like ES6 velociraptors. And they’re in Opera, Chrome and Firefox. Jank Architect has the low-down.
The following content is not acceptable from the 1st December 2014 – “Pornography is the canary in the coalmine of free speech: it is the first freedom to die. If this assault on liberty is allowed to go unchallenged, other freedoms will fall as a consequence” – a lawyer on the ridiculous new UK censorship laws. Gotta love government small enough to fit in your bedroom.
I enjoyed watching Dimitri Glazkov’s introduction to Web Components Easy composition and reuse with Web Components, given at the Chrome Developer Summit. It’s an excellently-constructed talk that builds on the use-cases that web components address to make a compelling argument for the technology.
Custom elements is really neat. It basically says, “HTML it’s been a pleasure”.
There we are. Bye-bye HTML; you weren’t useful enough. Hello, brave new world of custom elements. Of course, this isn’t the full messaging; a 20 minute video can’t go into the nuances. But it’s what a lot of people are hearing.
Let’s straighten that out.
One of the advantages of oh-so-boring HTML was that certain elements carried default behaviours in browsers and assistive technology. Like, when you use this mark-up
<label for="form-name">What's yer name?<label>
Custom Elements present a fantastic opportunity for us to improve accessibility on the web.
Yes. Yes. Yes. (Thanks Addy and Alice!) It’s perfectly possible to make web components and custom elements accessible. Alice has an example which I’ve screenshotted in Opera (top) and Safari (bottom).
Note that the first column does render in Safari, but it’s just normal checkboxes; they aren’t sexy web component-ised as they are in Opera. But – crucially – you can still interact with them, as they’re web components progressively enhancing silly old “useless” HTML. It works like this:
<input type="checkbox" is="io-checkbox">
Simple, huh? You have a silly old useless HTML element, and a new attribute that says “this is extended via web components into a special element I’m calling ‘io-checkbox'”. The web component inherits all the silly old useless behaviour like associating labels with form fields, activation with keyboard for free.
Compare with the sexy but not progressively-enhanced way that doesn’t work in older browsers (the second column):
There’s a super-whizzo-fabbo-megalicious UltraShiny custom element there, which has no graceful degradation. It needs a tabindex and a role there because who wants that silly old useless HTML behaviour? Not us! We’re post-HTML. Yay!
Snarking aside, why do so few people talk about extending existing HTML elements with web components? Why’s all the talk about brand new custom elements? I don’t know.
Of course, not every new element you’ll want to make can extend an existing HTML element. In this case, you can still make your custom element accessible. Just because you’re in the super-whizzo-fabbo-megalicious UltraShiny world of web components, you can – and should – still add ARIA information to make your code accessible. Just because you’re hiding nasty code behind the Shadow DOM, it doesn’t mean that you can brush proper coding under the web components carpet.
You’d hope that those who are assiduously pushing components into the platform would ensure that their demos did this – after all, those demos are meant to be studied, copied and adapted by developers, right?
Google has expertise in-house to create functional, beautiful, web-component stuff that is also accessible. It would be great if high-profile demos like these would actually take advantage of those resources to create things that work not just for sighted mouse/touchscreen users…
To which he received the reply
There’s plenty that can be done in the convenience of unlimited time and resources. If you’d like to help, please submit a PR.
A big demo of a Google cutting-edge technology, made by Google, and there’s no resources simply to make it accessible.
At Paris Web, Karl Groves and I talked about Web Components – the right way, we talked of extending existing elements, adding ARIA and suggested that web accessibility advocates actively fix issues on Open-Source projects. But I meant fixing small projects that you’re using in your own sites – like the WordPress Live Comment Preview plugin, which I tweaked, thereby making 44,837 sites accessible.
I wasn’t talking about fixing demos by a company with a $362.48 Billion market capitalisation. As Patrick Lauke so eloquently puts it:
My resources are currently a bit more stretched than Google’s…but I’ll put it on my to-do list
I’m a fan of web components. But I’m increasingly worried about the messaging surrounding them.
This week’s reading list is devoted to Device Detection vs Responsive Web Design.
With all the cool kids getting into RWD these days, it’s time to have a look at the Device Detection companies again. Device Detection is the practice of matching a device’s UA string against a table of such strings and looking up certain characteristics of that device and then serving different websites accordingly.
Those who oppose Device Detection do so for philosophical reasons – it’s one web and we shouldn’t serve different content to different devices or browsers, or they are certain browser vendors: Internet Explorer, Firefox OS and Opera all have reasons to dislike browser sniffing or device detection (“this website is only available to iPad users”). Google uses device detection all the time on its properties, as do many other large companies.
The device detection companies have begun to issue reports comparing their products with responsive, client-side techniques. Here are three that I’ve seen this week:
RWD sites were the slowest, on average, to load on mobile – 8.4 seconds – while dedicated mobile sites loaded fastest – in 2.9 seconds. Non-responsive desktop sites took 6.57 seconds to load.
I’d like to see proper A/B testing: a well-made responsive version of a site versus its “m-dot” equivalent, redirected from its canonical URL and assembled after a device look-up, across a variety of devices and network conditions. If we’re going to argue, it might as well be about data.
Update 1 Dec 2014: Here’s some initial research on the top 1,000 mobile websites: M dot or RWD. Which is faster? that concludes that “m dot” sites are 50% slower for time to first byte, and
RWD sites are VERY competitive on Visually Complete and SpeedIndex scores. The median values are within 5% for both metrics. Even though it appears that RWD is faster, there is enough fluctuation in the data that we should probably call it a dead heat.
Web Sensor API: Raw and Uncut – Boris Smus writes “Sensors found in smartphones define the mobile experience … I’ve had to step away from the web as a development platform, in part because of the poor state of sensor APIs. In this post, I will describe some of the problems, take a look at sensor APIs on iOS and Android, and suggest a solution in the spirit of the extensible web manifesto.”
Google makes image recognition advance – “Scientists at Google have created artificial intelligence software that can describe the contents of photographs far more accurately than ever before.” Doesn’t mean you can get out of writing alt text, though!
After posting my old song Speed Of Light which contains the delicate phrase “fucking in the summer rain”, I remembered this poem that I wrote about the same incident, with slightly more genteel vocabulary.
It’s part of the same series of poems as It is a hot evening in July that I wrote to try to capture a precise moment in time or emotion.
Moments 3 (10.7.87)
The lethargy of evening
insects in the long grass
the langour and the language
I will not find a meaning
I will not bind my feeling
soft rain silvers cobwebs
on the stone for Stan and Ellen
that we lie upon all grassy
when the world gives up its whirling
for an instant small as insects
in the calmness after climax
in the stillness of the twilight
we are here