The Web is about communication. It connects many people who previously were isolated such as those with disabilities or those in oppressive regimes. It’s a World-Wide Web, not a Wealthy Western Web. If your super-clever site only works with a mouse and monitor, on the latest $2000 super-spec laptop, with a fat broadband connection, you’re missing the point.
The principles of universality of access irrespective of hardware or software platform, network infrastructure, language, culture, geographical location, or physical or mental impairment are core values in Web design.
One of the most worrying trends we see at the moment is the erosion of this idea. In a survey, Peter-Paul Koch asked "Do you hope that WebKit will become the only rendering engine, and that the others will gradually disappear?". Shockingly, 32% have replied “yes” (at time of writing). You read that correctly! 32% actively wish for a monoculture. Because, y’know, cross-browser development is hard – so let’s go shopping! Who cares about the users? Who cares about the future? We’ve been here before with IE6- the darling of developers at the time – and look how well that went.
It’s pretty obvious that this is a case of a group of developers that believes that everyone should be just like them and should use the same devices and browsers. After all, despite all their genuflecting to Safari on their iPhones, it appears from December’s mobile statisitics (as written up by PPK) that
Opera once more overtakes Safari. It’s clear now that Android’s untrammeled growth has ended, and that the race for first position will continue to be between Opera and Safari.
(If you’d like to start testing your sites in the number one mobile browser, there are plenty of Opera testing tools available. Note: Opera is my employer, but this is my personal opinion.)
we have to start building sites using solid, future friendly principles such as progressive enhancement…not just when it’s handy or simple, but all the time.
and goes on to show a Barack Obama re-election site in which it was impossible to navigate in many devices, even some new high-spec devices. In a news report about this, the journalist quotes my three incredibly ground-breaking, never-before-heard rules:
Code to standards, not to browsers
use progressive enhancement
remember that you are not your user.
Yes, I know! Utterly new concepts.
However, we’re approaching a monoculture on mobile. This is not the work of an evil organisation, but it’s developer-constructed. Few people are stupid enough to use Olde-Skool browser sniffing and blocking, but we’re seeing lots of people breaking cross-browser compatibility by neglect rather than design.
One way this happens is developers using only one vendor’s CSS vendor prefix even when other vendors support the same properties. Of course, for experimental things only implemented by one rendering engine, that’s fine. That’s what vendor prefixes are for.
The trouble comes about when people do something like -webkit-transition for widely-supported properties, without the corresponding -o- for Opera, -ms- for Microsoft and -moz- for Mozilla.
People never aim to create content that’s cross-browser compatible per se, with a tiny minority of exceptions. People aim to create content that reaches users. What that means is that right now people are busy authoring webkit-only websites on the open web because they think that webkit is the only UA that will ever matter on mobile. And if you point out this assumption to these people, they will tell you right to your face that it’s a perfectly justified assumption. The problem is bad enough that both Trident and Gecko have seriously considered implementing support for some subset of -webkit CSS properties.[my emphasis]
The rule should be this one: if the CSS parser encounters a prefixed property for another browser, honour that property as if it were prefixed for us UNLESS an unprefixed or prefixed for us valid declaration for that property was already set. That would drastically reduce the problems on the Web.
I believe vendor prefixes were a good idea, and remain so if used in a cross-browser, future-proof way. But because so many people only use the -webkit- one, I’m starting to wonder too if vendor prefixes should be considered harmful…
There have been a few stories lately for investors rather than techies that have a few inaccuracies, probably because they’re written by finance/ business journalists rather than tech journalists. (Nothing wrong in that; I know my HTML5 from my CSS but couldn’t tell a gilt-edged bond from a derivative.)
Here a few notes for analysts and journalists that might chance upon this blog.
By 2016, more than 2.1 billion mobile devices will have HTML5 browsers, up from just 109 million in 2010.
Before the expansion from “just” 109 million to “more than” 2.1 billion makes you rush out and leverage your portfolio, we need to know what our anonymous author means by the term “HTML5 browser”.
If you define an “HTML5 browser” as one that supports all features of HTML5 then there are precisely zero in existence. (You’d need to define “HTML5”, of course, but that’s anotherstory.)
If you define an “HTML5 browser” as one that can consume some HTML5 features, then all browsers are “HTML5 compliant”.
Please, dear analyst/ journalist friend, define what you’re talking about before giving precise figures and talking about accelerating adoption. (I’m always up for being contacted – email bruce at this domain – if you need to check something out, by the way.)
Our anonymous author quotes a Mark Beccue saying “I believe that Apple will be the key driver of HTML5”. Mr Beccue is, of course, at liberty to believe what he wants. Until my nephew was three, he believed that there was a creature that lived in the toilet called The Poozilla (I’d like to apologise to him publicly here). Believing it doesn’t make it true.
There are many claims to be the “driver” of HTML5. Opera began it, of course; Ian Hickson edits the spec and works for Google so you could argue that Google is a driver. As you like, and whatever gets you a better headline.
The truth is that browser manufacturers are driving it collaboratively because if browsers don’t render HTML interoperably, developers will use some proprietary technology instead. (This doesn’t have to be a prosaic truth: the fact that all browsers are working together on HTM5, if not on other technology, is quite a story.)
Consumers benefit from interoperable webpages: most people use multiple devices and browsers; it’s stupid if you can use your bank website on your work machine, but not your Linux netbook or phone. There are significant advantages to HTML5 over HTML 4 for developers.
Mr Beccue (or the anonymous author channelling Mr Beccue, as we are denied any link to Mr Beccue’s full analysis) believes that Flash will imminently disappear:
One important HTML5 feature, video, is making a play to challenge the popular Adobe Flash Player plugin software…“I think the disappearance of Flash is closer than people think”
There are numerous reasons why Flash may be a more appropriate way to deliver your video content. Perhaps you need DRM, or adaptive bitrate streaming, for example.
Also, dear journalist/ analyst, it’s fair to point out that there are numerous problems with multimedia on Apple’s iOS:
However, he gives a list of “facts” asserting “These are not interpretations or opinions. These are facts.”
As it’s just possible that another journalist or analyst might be impressed by Forbes’ vehemence and quote these “facts” without question, let’s give them some critical examination.
You do not build a web site in Flash. The only way to build a website is to use HTML pages, and then to embed Flash elements in them.
This supports the author’s thesis that talk of all-Flash websites is an impossibility. Well, yes, technically. But Flash can be embedded using two lines of HTML, neither of which has any visual manifestation (see Blankety-Blank example) so this doesn’t mean much.
Less than half of installed browsers are HTML5 compliant, with different levels of compliance.
As our wikipedia chums would say “Citation needed”. And, please dear Analyst, see above for the absolute necessity to define “HTML5 browser” or “HTML5-compliant”.
The video element in HTML5 is perfect for basic video players, but Flash and Silverlight are much more suitable for advanced video feature (streaming, caption, interactive features and miscellaneous video effects)
Really? I very much like the text-based synchronised subtitles available on things like Playr or mediaelement.js, which are HTML5.
Streaming is also completely possible with HTML5 video. “Miscelleaneous video effects” needs definition before you can claim that HTML5 can’t do them. (It’s been possible to do things like edge-detection, blend, greyscaling for a couple of years with SVG + native video – see http://www.dahlström.net/svg/filters/video/video-filter.svg in Opera, for example).
The iPony Club
Finally, Business Insider has a video in which “Facebook Investor” Roger McNamee exhibits the kind of breathless anticipation about “HTML5” that is more commonly found in the minds of the prepubescent heroines of a specific genre of children’s fiction as they describe the prospect of riding Misty Mane, their new pony, for the first time. (From 8’58” onwards.)
I address the paraphrases, as they’re what get quoted and picked up:
HTML5 is going to change everything. “In HTML5, an ad is an app, a tweet is an app, everything is an app.” “It’s a blank sheet of paper, and creativity rules again.”
I’m not sure how “a tweet is an app” makes any kind of technical sense. And, much as I like HTML5, this isn’t the Renaissance – we’re not seeing some massive resurgence of human creativity because of a new DOCTYPE.
In HTML5, you don’t need to have display ads: Amazon can have a section of its store as an ad. So if you’re reading a book review, you can buy the book right from the page.
As you’ve been able to do for 10 years.
Because HTML5 can make sites rich and interactive, engagement on a site can go from seconds to minutes.
Flash can make sites rich and interactive. So can HTML 4. The key here is “rich and interactive”, not a particular DOCTYPE.
The iPad is the training wheels for HTML5.
Seriously, have a lie down.
(Added January 2012: the offending video by McNamee:)
ParentPay is, according to its Twitter profile “the market leading online payment & dinner money management solution for schools and caterers, used by hundreds of thousands of parents each week.”
It’s quite a good idea – I load up the account by credit card and, as my daughter buys lunch, the account reduces and I get an itemised bill so I can ensure she’s getting her five a day.
The school are supposed to tell her when her account drops below £5, and she’s supposed to inform me. Somewhere in this chain that involves a computer system, harassed dinnerladies and the legendary communication skills of a twelve year old girl, the system breaks down. Therefore, I rarely find out that funds are low until I receive an accusing text at 8.30 am, or on her arrival home when she tasmanian-devils through the family food supplies because she couldn’t afford lunch.
This morning I had just such an SOS text so went to the website. As usual, I’d forgotten my login details (I really want to use my email address instead of choose a username so it’s less to remember). The password reset showed me a splendidly helpful error message:
Showing techy error messages saying “server errors in ‘/AUTH’ application” and a handy snippet of XML is unlikely to assist a user. However, showing error messages that can identify a specific server technology is of tremendous use to hackers – they know which server and potentially which version number to target.
After 20 minutes trying different username and password combos, I got into the system and made my payment – puzzlingly, to an organisation called “Alliance in Partnership”, on a website called “ParentPay”. Eh? Alliance in Partnership sounds like some barking rightwing thinktank. But I persevere.
I want to like ParentPay. I think it’s a good idea and I hope they succeed. But they need to think more about their customers’ experience. Here’s one tip that would make my life slightly easier.
I know that such a thing is currently beyond human ingenuity and no technology exists that could power such a marvel, but perhaps ParentPay may consider a system that emails me automatically when the account drops below a certain threshold, thereby guaranteeing an uninterrupted supply of bratfuel?
Someone from ParentPay contacted me and said, with admirable politeness, that there actually is such an alert facility but only available at some schools and, once checking that my daughter’s school does offer such a facility, showed me how to set it up.
It’s not easy to find (on the page that tells your balance there is the opportunity to sign up for paid SMS alerts, but no option for emails so I assumed it doesn’t exist), but after verifying my email address I am now signed up.
So I beg ParentPay’s pardon is assuming there isn’t such a system, but suggest that they make it more obvious – I think I’m pretty web savvy and couldn’t find it.
And, in answer to other queries I’ve received, once topped up with money, their system has been flawless over the last 10 months.
Naturally, because he’s caring-and-sharing, he only has those people’s best interests at heart:
My concern about it is it prevents those people from being given the opportunity to get the first rung on the employment ladder.
But he’s not just caring-and-sharing. He’s also a True Blue Tory who lives in The Real World of laisez-faire economics:
The point is that if an employer is considering two candidates, one who has disabilities and one who does not, and if they have to pay them both the same rate, which is the employer more likely to take on? Whether that is right or wrong and whether my hon. Friend would or would not do that, that is to me the real world in which we operate.
Rather stupidly, I had assumed that the role of Members of Parliament was to enact legislation that protected the vulnerable by promoting equality, redistributing wealth from the very rich to the disadvantaged and ensure that people aren’t exploited in the workplace.
I realise now that, because inequality and exploitation exists in the real world, we should accept it and encourage it by exempting groups of people from laws designed to protect them.
So let’s have an army of ultra-low paid people doing menial tasks without legal protection of any sort. In the capitalist real world, there is no need to price those people out of the market with statutory maximum working hours, or the requirement for safety equipment as they go down mines or up chimneys.
The disabed are analagous to former prisoners, says Mr Davis:
The only way the former prisoner would be given a chance by the employer is if the employer was able to say, “I’ll give you a smaller amount for a certain period of time and we’ll see how it goes. If you prove yourself, I’ll move you up.”
From his voting record, I see that Mr Davis voted against equal gay rights, presumably so we can have minimum wage-exempt homosexuals staffing up hairdressing salons or kd lang tribute acts. I’m surprised that he voted for a stricter asylum system, given the opportunity it gives us to import squadrons of highly-trained professionals from war-torn areas of the world who could work as doctors for £3 an hour in the cash-strapped NHS.
I’m not hysterical at all. In fact, if Mr Davis would care to attend my kickboxing class next Saturday, I will kick his arse for 60 minutes and not invoice him £5.93 for that hour at all. As someone with a disability (multiple sclerosis), I’ll happily do it for free. To prove myself.
Made by someone commenting in Haavard Moen’s post about the announcement of "native HTML5", this video does NOT represent Opera’s official position, but it did make me laugh. Personally, I like "native HTML5". It’s important that it not be tainted with our "modern ways", but preserved for diversity reasons (thx @stommepoes!).
We live in economically uncertain times. The Keynsian nonsense of the State ensuring crade-to-the-grave social care for its citizens, providing and maintaining an infrastructure so the country can function, and other socialist claptrap is discredited.
The way to economic prosperity is for entrepreneurs – like you! – to start up businesses, make a fortune and trickle down all over everyone else.
Fortunately, for the self-starter – like you! -who can’t be arsed to get up and do some research, there is a new website startupbritain.org to help you on your path. Like the cartoon God in Monty Python and the Holy Grail, David Cameron’s disembodied head gazes down at you from his celestial home, squinting inspiration at you. And as if that were not energising enough, there’s a picture of Richard Branson doing his best double-thumbs-up orgasm face.
This fabulous resource is
Designed to celebrate, inspire and accelerate enterprise in the UK, it has the full backing of the Prime Minister, the Chancellor and HM Government. This is a response from the private sector to the Government’s call for an ‘enterprise-led’ recovery. We believe that many of the important functions and services necessary to foster and champion new enterprise can be open-sourced, instead of provided by government directly.
Hopefully you are by now inspired and accelerated?
There are, sadly, defeatists who cling to the old politics of envy and deface such rallying cries:
Kettle them all. They’ll be moaning about the Royal Wedding next.
As we’ve seen from the £585 icon fiasco, in which Reading Room charged the Information Commissioner’s Office a large sum for a 32-by-32 pixel favicon, the public sector is a credulous and top-heavy environment in which to develop websites. (Disclosure: I once had to maintain some code by that agency.)
In the public sector, many websites sit in parts of the organisation that are managed by people who don’t really understand the Web. They may be Marcomms folks, used to traditional media, or IT Directors who are comfortable with Service Level Agreements, purchasing Enterprise-level software. But both breeds of manager are fair game to be frightened witless by the requirements to have accessible web sites.
There is a website monitoring and compliance tool that’s very popular with local government and public sector managers, as it does a battery of automated tests, marks websites as passing or failing. (See Gez Lemon’s old-but-gold Testing Invalid Content with Accessibility Validators to see why this might be more of a box-ticking exercise than a useful approach.)
The monitoring tool is less popular with the web people who actually do the work as the compliance reports and league tables that the vendor produces often require coding for the tool rather than for accessibility or best practices.
A correspondent writes that the tool didn’t properly score her HTML5 pages and had the following email exchange with the tool vendor.
The issue seems to be because we are using the HTML5 doctype on our site. All of the checks being performed seem to be trying to validate us as HTML4 – which is wrong.
HTML 5, as a ratified standard, does not yet exist so there is only the initial draft proposal to work to, so as yet we have not started work on testing HTML 5. (See answer below about timings on using HTML 5.)
The HTML5 syntax is much more relaxed and allows for a combination of HTML4 and XHTML standards. So errors being produced for things such as wrongly using self-closing tags are false.
We do not believe this to be correct, even for HTML 5.
HTML5 is new – but the doctype is fully supported and recognised by all browsers.
This is incorrect. HTML 5 does not yet have a “doctype” (as a method of signifying the document type). No browsers at all implement the HTML 5 document parsing method as far as we are aware.
Developers are being encouraged to use HTML5 as the best way to ensure your pages will last a ‘long, long time’.
We are not aware of anyone that is encouraging people to use it, but if it is true that someone is then they are misguided and mistaken.
And in terms of ensuring pages last a long time HTML 5 parsers are backwards compatible with HTML 4 in any event, so documents written today in HTML 4 will last at least as long as HTML 5 documents, with the added advantage that they are actually supported by existing browsers.
For these reasons we do not currently support HTML 5 and have no plans to do so in the immediate future.
So if you would like to use any of the new HTML5 elements, canvas or multimedia or ARIA to aid accessibility, just make sure that your boss doesn’t pay money for Snakeoil Monthly report.
“CSS 2.1 suffers from severe interoperability problems”, said an excitable person. “If you set the height of a box, older browsers will nevertheless allow that box to grow to the height of its contents. This is disastrous to the credibility of these so-called ‘Stylish sheets'”.
“There is absolutely no way that CSS 2.1 can be used in production,” thundered a woman from behind a FrontPage CD. “There’s not even reliable cross-browser support for list-style-type: armenian!” (Test).
“It’s a scandal!” said a journalist who once saw a mildly pornographic image on a computer. “It shows that social networking, when combined with CSS, causes cancer and moral decline.”
Shares in office furniture manufacturing firms rocketed as IT Directors spontaneously and simultaneously evacuated themselves on learning that CSS 2.1 is still in development and not yet a full standard.
“The CSS 2.1 spec may not be finished until next Thursday, or even later” a bewildered-looking man with spectacles said breathlessly, clutching newly-purchased trousers tightly to his chest.
“We’ll have to go back to tables and spacer GIFs until further notice!” he continued while wheeling a chair out of Ikea and putting on a tinfoil hat.
Trying out my new Ranting Hat, a present from Japan from Nedjma. Please note that rants are just that, and not necessarily eloquent or factual. (And I know that Eric Meyer and Jeffrey Zeldman are not the only two social liberals in the USA; I’ve actually met the other three.)
Oh, and do I have to say that this is a joke, is personal and nothing to do with my lovely employers at Opera? Unfortunately, I probably do.
Here’s a quick tutorial (actually, rant) that came out of an aside I mentioned when doing my talk for Future of Web Design two weeks ago.
It came about when I was using the IE9 preview to test some sites. I noticed that a site that boasts rounded corners didn’t appear to have them in IE9, even though IE9 allegedly has border-radius support.
“Silly IE9”, I thought.
Wrong. Silly developer.
The difference between a pro developer and a wannabe is that the pro developer makes sites that are cross-browser and, as far as possible, future-proof. By contrast, the wannabe assumes that everyone is the same as him and therefore if the site works on the browsers he uses, that’s enough.
By using only vendor prefixes, the wannabe developer ensures that this nice part of the design will only work on those browsers.
A pro, however, cares about his client so doesn’t leave them with a site that will need changing later. A pro cares enough about his site’s users to give the design to their browser and let it do with it as it will.
Simply by adding the non-prefixed cross-browser version of the property, he can add border-radius support for IE9 now, Opera now and any new browser that comes along in the future:
In the above example, border-radius is pretty mature, so IE and Opera jumped straight to using the standard prefix-less property, but other fancy CSS 3 properties are implemented only with vendor prefixes at the moment. Note I said “at the moment”; in two years’ time, a new browser may consider that feature stable enough to implement without a vendor prefix and, because you’re a pro rather than a wannabe, you want to ensure your code works in 2 years time as well as today.
For maximum compatibility, I advise adding all vendor prefixes (I do it in alphabetical order to help me remember) plus the non-prefixed version.
So here’s a version that future-proofs and cross-browserifies™ CSS3 transforms:
If, for example, IE adds support for the prefixless version, or uses the -webkit- version, you have one line—27 bytes—of redundancy. So what? And now your code works everywhere that has support, today and tomorrow.
And that’s how it should be.