Archive for August, 2012

Reading List

Trigger warning: web standards mentioned, other geeky stuff.

Mobile Web in Asia/ Pacific

  • 32% of Opera Mini users in APAC are on smartphones, up from 9% 1 year ago, so users are taking Mini with them when they upgrade to Smartphones.
  • Opera Mini sees 900% growth in user numbers in Burma and 500+ % growth in pageviews
  • The most popular sites are Facebook, Google and YouTube. In fact, this exact combination and order is repeated in most of the countries’ top three list of domains. 16 out of the 25 countries have local news or classified sites in the top 10 lists, in strong competition to international news sites.

From this month’s State of the Mobile Web report.

vendor prefixes in the wild

Responsive Web Design



Talking out of Their Arses Corner

This week, an “infograffik” on The History of HTML5 that “takes us through the story of how HTML5 became one of the most standard languages used on the Internet. It has come a long way from its more simplistic origins and now HTML 5 has taken the web by storm as a more efficient, modern way to develop webpages”.

It’s forgotten several key milestones, such as when I switched from HTML4 trousers to HTML5 trousers in March 2009, and the death of Brian Epstein.

On the publication of Editor’s draft of the <picture> element

On Tuesday, a w3C Editor’s Draft of a proposal for HTML Responsive Images Extension was published, edited by Matt Marquis and Microsoft’s Adrian Bateman:

This proposal adds new elements and attribute to [HTML5] to enable different sources of images based on browser and display characteristics. The proposal addresses multiple use cases such as images used in responsive web designs and different images needed for high density displays.

It’s a mash-up of the strawman <picture> element I proposed in December last year, and the Hixie-blessed srcset attribute on img proposed by Ted O’Connor of Apple. (See Responsive images: what’s the problem, and how do we fix it? for more background.)

Of course, the publication of an editor’s draft means nothing. There isn’t any indication that any browser manufacturer will implement it. Philip Jagenstadt of Opera (but speaking personally) has already commented

Personally, I don’t think it’s a good idea to reuse the syntax of <video> + <source>, since it invites people to think that they work the same when they in fact are very different. It could be made to work, but the algorithm needs a lot more detail. Disclaimer: This is neither a “yay” nor “nay” from Opera Software, just my POV from working on HTMLMediaElement.

Those eager to bash Hixie and the WHATWG are using the new spec as if it were a cudgel; “this is how you deal with Hixie and WHATWG” says Marc Drummond.

I don’t think that’s productive. What is productive is the debate that this publication will (hopefully) foster. Two different but connected issues need debating. Firstly, the technical debate needs to continue. There are problems with the <picture> element, such as Philip points out, and its verbosity and potential to be a maintainability nightmare, as pointed out by Matt Wilcox.

And we need to work out how all can play a role in specifying the Web. The W3C dropped the ball with XHTML 2 because it was a philosophically elegant, intellectually satisfying specification that bore absolutely no relevance to the real world.

WHATWG picked up that ball, and grew the Web, because they knew what developers wanted: Flash and Silverlight’s application capabilities. The browser manufacturers who made up the early WHATWG knew that if those capabilities weren’t added to browsers, they would die.

But the gatekeepers of WHATWG aren’t jobbing developers or designers. Nothing wrong in that: neither am I any more. But their inability or unwillingness to account for the art direction use case has caused them to drop the ball here.

We need to get everyone’s voices heard: — people like Philip with implementor’s experience, people like Hixie with his encyclopaedic understanding of how specs inter-relate, and also solicit and understand the needs of those who make websites but can’t express their requirements in the language of specs, algorithms and IDL.

I don’t know how we can do this. The CSS Working Group had designers attending as invited experts for a short while, but I’m told that wasn’t particularly useful for either group. A group of designers called the CSS Eleven hailed themselves as “an international group of visual web designers and developers who are committed to helping the W3C’s CSS Working Group to better deliver the tools that are needed to design tomorrow’s web” and then promptly disappeared.

So congratulations to Matt Marquis and the others in the Responsive Images Community Group who have had the staying power to produce a spec for discussion.

Hopefully, this strawman spec can be refined into something workable that gives developers a simple, declarative way to send different-sized, art directed images depending on bandwidth and device characteristics. This means organisations waste less bandwidth, and it’s a faster (and cheaper) Web for consumers — you know, the great unwashed that we make websites for.

Added 8 September: The road to responsive images – useful introduction to actually authoring it in your websites.

(Last Updated on 8 September 2012)

Reading list




Super-NSFW Corner

  • Fifty Shades Generator – Traditionally, print and web designers had to make use of placeholder text known as Lorem Ipsum. Now, creatives can excite clients in more ways than one with Fifty Shades of Grey-inspired filler text.”

Credit card, bank account numbers in HTML5 forms

It’s not appropriate to use input type="number" for strings of digits such as bank account numbers or credit card numbers.

input type="number" is really for quantities, or real numbers. It’s implemented by Opera, Chrome and Safari as a spinner field (see the “shoesize” field in my HTML5 Forms Demo) – which isn’t a terribly good way to input a 16 digit number.

Although credit card and bank account numbers are colloquially called “numbers”, they’re really strings of digits – unlike real numbers, leading zeros are significant, and you wouldn’t expect to perform any arithmetic operations on them.

Therefore, the correct way to mark up forms that expect credit card/ bank account details is with input type="text". If you want magical HTML5 client-side validation, add pattern="…", with the value of pattern being a regular expression that describes the string.

In The Future™ you’ll be able to restrict such fields to numeric-only input, as a hint to the user, with the newly-specified inputmode=”numeric” attribute:

Numeric input, including keys for the digits 0 to 9, the user’s preferred thousands separator character, and the character for indicating negative numbers. Intended for numeric codes, e.g. credit card numbers.

Also in The Future™, you can help the browser autofill such a field by telling it that you’re expecting a credit card number and, if it has one setup by the user, it can autocomplete using the newly-specified autocomplete=”cc-number”.

So a full credit card number would be <input type="text" pattern="…" inputmode="numeric" autocomplete="cc-number">

(Added 27 August 2012:) Perhaps not so far in the future: Mozilla have just added inputmode support, and Chrome implements autocomplete with a vendor prefix.

(The WHATWG wiki has a good explanation of the rationale behind autocomplete types, NB: this text is from the original proposal; I haven’t checked if everything it proposed actually made it into the spec.)

(Last Updated on 19 October 2012)

Hard-working Tory MPs on “lazy British workers”

According to the Daily Mirror, five Tory backbenchers have said in a book: “Too many people in Britain, we argue, prefer a lie-in to hard work … Once they enter the workplace, the British are among the worst idlers in the world … We work among the lowest hours, we retire early and our productivity is poor.

MP John Prescott wrote “The five Tory MPs calling British workers ‘lazy” have only ever been ex Tory advisors & Tory think tank wonks”.

That’s not quite true. Some of them have been employed in back-breaking, minimum wage roles like management, “advising”, press offices and consultancy.

The five are:

  • Kwasi Kwarteng, who lived the pitifully low-paid life of an analyst in financial services before becoming an MP
  • Dominic Raab started his career as an international lawyer at Linklaters, a law firm in the City, working on project finance, international litigation and competition law. He was then a civil servant, and finally an “adviser” before becoming an MP
  • Chris Skidmore worked for David Willetts and Michael Gove as an advisor, before being selected to fight his home seat of Kingswood seat in 2009.
  • Elizabeth Truss: “Prior to entering Parliament, Elizabeth was Deputy Director at the think-tank Reform, where she advocated more rigorous academic standards in schools, a greater focus on tackling serious and organised crime and urgent action to deal with Britain’s falling competitiveness. Elizabeth worked in the energy and telecommunications industry for ten years as a commercial manager and economics director and is a qualified management accountant.” Ten whole years of gruelling commercial management. Imagine!
  • Priti Patel who worked at Conservative Central Office, moving to Sir James Goldsmith’s Referendum Party, heading the press office. She then left politics and worked as a midwife, a nurse, then a careworker in a home for the elderly in a deprived area of Liverpool. Ha ha! I’m joking: she worked for Weber Shandwick, a public affairs consultancy, before becoming an MP.

UK workers work the third-longest hours in Europe.

The pre-requisites of a civilised society

I was musing about what criteria you’d need to fulfill to call a society truly civilised. Here’s my starter list.

Equality under the rule of law

This means guaranteeing rights for all, regardless of sex, race, sexual orientation, religion etc. But it’s not just about protecting the traditionally disadvantaged; it also means that those traditionally above the law are no longer unaccountable, so no more special privileges for the rich, the titled, the freemasons, friends of MPs etc.

Total separation of religion and state

Religion is a private matter and, of course, everyone should be absolutely free to privately follow whatever religion they want. No religion should be favoured or protected by the State. The State should not fund any religious schools. No-one should have any part in any legislative or judicial process simply because they have a role in a religious organisation (so, for example, Church of England bishops should no longer have an automatic right to a seat in the House of Lords). Religion should not be taught as fact in schools (understanding comparative religions is an important part of citizenship.)

Education and medical care should be free at the point of delivery

Because that’s obvious. Education empowers people, and that is the ultimate aim of a civilised society. It’s also a prudent economic investment for the future. I feel strongly about this; the only way I was able to go to University is because my tuition fees were paid by the taxpayers, and I had a full grant (of about £2000 annually, if I recall correctly) that helped me pay my living expenses. Because of my university education, I have a higher earning potential so I now pay more tax.

Denying someone medical care because they don’t have money is antithetical to civilised society.

Abolition of all hereditary titles and privileges

This includes all aristocratic titles, and monarchy.

1% of GDP reserved for foreign aid and overseas development

I’ve plucked the figure of 1% out of the air. This applies only to wealthy, developed countries, of course. For the less well-off countries like Pakistan and India, they should abolish stupid nuclear weapons programmes in order to feed all their citizens (and receive no outside aid until they do).

Abolition of the death penalty

Because “killing someone is so bad, if you do it, we’ll kill you” is a logical absurdity. It’s also immoral.

Penalties for corruption by public officials should be double that for public

A member of the police, a judge, or an MP who commits a crime connected with their office should receive double the punishment that a member of the public would receive. (Linda rightly points out that this seems incompatible with the earlier “Equality under the rule of law”, but it’s because the crime is greater when committed by someone in a heightened position of trust.)

Legal programs for assisted dying

With proper safeguards, of course. (I have no idea what those safeguards would be.)

Freedom of expression

Anyone should be allowed to say anything as long as it doesn’t incite violence. The law shouldn’t be able to censor someone just because they hurt someone else’s feelings (see my post Should My Tram Experience woman be arrested?). Freedom of the press is vital, with necessary safeguards for protecting privacy: if Dwayne Footballer is shagging Jordan Boobmodel, there is no justification for invading their privacy and running such a story. Just because some prurient anecdote might interest some of the public, it doesn’t mean it’s in the public interest to run the story.

The aim of government isn’t to “rule”; it is to competently and transparently administer a nation to ensure all citizens have equal opportunities by ensuring laws and regulation protect all citizens, and to redistribute wealth to ensure everyone has adequate food, medical care, shelter and education so they can participate in society.

What have I missed or got wrong? And does any society exist?

Reading List


Sublime Text 2

I haven’t actually enjoyed using an editor since VAX EDT in my old programming days, but Sublime Text 2 is an excellent program that not only doesn’t get in the way but has lots of utilities and features.


Dell Extends Ubuntu Retail into India – Unreported, of course, because it’s about FOREIGNERS, but Dell have been featuring Ubuntu on a wide range of Dell computers in China, starting at 220 stores and expanding to 350. They’re also expanding in to 850 stores across India.


Reading List


  • register*Handler and Web Intents. Hixie writes, “Having carefully studied the Mozilla Web Activities proposal, the Web Intents draft, the register*Handler APIs, and to a lesser extent the dispatch mechanisms in existing operating systems (desktop and mobile) and the piles of advocacy on teh subject on the Web, I’ve tried to come up with a concrete proposal for merging all of them into a coherent whole that addresses the limited use cases that are of most interest.” (Read following emails, too; not a done deal.)
  • Creeps and Weirdos in the CSS Spec – Louis Lazaris runs through a bunch of things from the CSS specifications that you might not have heard of yet: toggle() Values, Variables, Box Alignment Module, @viewport (Device Adaptation), Line Grid Module, Compositing and Blending and Conditional Rules with @supports and @document.
  • The Basics of the Shadow DOM
  • localStorage: Use it, Don’t Abuse It – good slidedeck by @pamelafox
  • Input modalities: the inputmode attribute – HTML forms add an inputmode attribute that seems to me to overlap considerably with the type attribute (or am I not thinking it through sufficiently? Comments below, markup-fans!). Loads of extra stuff on autocomplete, too.
  • Why you should use a UTF-8 declaration in your pages (If it’s not explicitly set, “Internet Explorer may incorrectly guess that the page is encoded in UTF-7. Suddenly, the otherwise harmless user input becomes active HTML and will execute”.)
  • Using ARIA in HTML – a draft spec from The Mighty Steve Faulkner. Feedback sought.


  • Opera mobile browser users cross 200 million mark – “a browser is more than a tool to browse the web’. Sometimes it’s a school when you can afford none, sometimes it’s the only line to an outside world shut off by an oppressive regime. Providing a service that reliably and cheaply delivers critical information to just about everyone with a phone is the reason Opera makes browsers. We want to make a difference in the world, not only on the web.
  • Introducing mobile browser automation – automating Opera Mobile Emulator with OperaDriver and Selenium


Lessons in website security anti-patterns by Tesco


Mr Joe’s useful list of Arabic web design resources

YAY! of the week

Thanks (but no thanks) – British Olympic athlete, Zoe Smith, responds to sexist tweets on her blog: “And here’s some food for thought maybe you should broaden your criteria for what you consider attractive’ anyway, because these perfect, feminine women you speak of probably have no interest in you either.”


Why “The Dark Knight Rises” scriptwriter should be shot

WARNING: may contain spoilers.

The kids wanted to see it, so I took them to see The Dark Knight Rises. Because it’s a film based on a comic and I’m over twelve years old, I wasn’t really expecting to like it, but there were some scriptwriting crimes so egregious that I list them here.

Firstly, the film was way too long. It didn’t help that Cineworld in Solihull decided that air conditioning in a packed cinema in the summer is a luxury that our28 entrance fee didn’t merit. But it was still 30 minutes too long.

On the plus side, the special effects were good (of course they were: it’s a summer blockbuster) and the babes were suitably babelicious, if Hollywood collagen pout is your thing (it isn’t mine).

But the script was terrible. Now, in a Hollywood blockbuster based on a kids’ comic, I don’t hope for emotional depth. But as the Bad Guy had mobilised thousands of normal people who were prepared to be blown up by a nuclear bomb he’d planted, it would be satisfying to be given even a cursory explanation of why they would. Or even, why Bad Guy and Bad Girl would. (“Because they’re bad” doesn’t work.)

Two can’t-be-arsed script devices were employed repeatedly. The lazy, lazy flashback-with-a-voiceover technique was used several times, as was clankingly clumsy Obvious Explication Dialogue:

“I want you to give me Clean Slate”.
“you mean, the computer program that lets you type in your name and erases you from databases?”

Imagine if people in real life spoke like that:

“Have you got the keys to the car, Bruce?”
“You mean, our blue Nissan Micra that I bought from my father when he upgraded to a Passat? The one I scratched when I reversed it into a wall outside Aldi last Wednesday?”

Then there is the mysteriously common movie trope whereby a character who doesn’t speak English suddenly learns it in time for them to utter the words that allow them to fulfill their plot function. I’m thinking of the bald guy in prison who needs translation until he whispers encouraging, motivational words to Batman. Imagine being that guy! All that time, unable to communicate with the Anglophone world and, just when the deus ex machina grants you fluent English so you can go to the pub and chat up girls, you disappear from the world as your bit of plot has finished. Bummer.

And don’t get me started on the unrequited homo-erotic thing between Michael Caine and Christian Bale. Any scriptwriter that requires Caine to cry should be drummed out of the scriptwriters’ guild. He’s spent 85 years being celebrated for not acting – he’s not going to start now.

More fool me for expecting anything other than cartoon characters, I suppose, but grown adults had promised it’s “dark” so I expected a Bergmanesque investigation of why a man would wear tights, with added “Pow!” overlays. Should’ve gone to see The Lorax instead.

(Last Updated on 18 October 2012)