Bruce Lawson’s personal site

I’m a Web Evangelist for Opera, but this post does not represent the official Opera position.

It comes as no surprise that Google was working on its own browser. When your entire multi-billion dollar business is on the web, you’re inevitably going to want some control over the mechanism by which people view it.

I imagine that Chrome was built as a Google Docs viewer. Google owns search, so can serve up adverts when people are doing that. But most people spend a lot of the day typing into Word, Excel etcetera, and not looking at Google’s adverts. Similarly, most people don’t use the vast majority of the features of Microsoft Office, so don’t need to pay the large sum of money that the Office suite costs. If those people can be persuaded to use Google Docs, Google can simultaneously deprive Microsoft of some revenue while showing discreet ads in the document.

Google Chrome has Gears built in, so people can work on the document when they’re off the web, and save shortcuts to documents on their desktop, just like a traditional desktop application. It’s also why Chrome is relatively lacking in chrome and browser controls: it feels less like the web and more like the desktop.

It seems to me that Chrome is designed to compete with Microsoft Windows as an Operating System and Office as an application: Microsoft’s biggest revenue earners (as far as I know).

It surprised me that it didn’t choose Gecko (the engine that powers Firefox), having invested so much in making Firefox fly. But I guess it pays not to keep all your eggs in one basket. Certainly, it doesn’t want to kill Firefox; it still makes a lot of money from people searching through it. And browsers aren’t its prey.

Competition between browsers can only help a consumer, although it can hurt developers if it’s like the Microsoft/ Netscape browser wars. But Google chose Webkit, which powers Apple’s Safari, so it should be pretty standards-compliant and therefore be not too onerous to test, and therefore little of an overhead for businesses with websites or those who make them.

This competition will also help us at Opera. Firstly, on those services Google provides (like Maps, Docs and Analytics) we’ve had compatibility problems as Google didn’t test with Opera properly. Those days are over: it can’t be evil and deny entry to a competitor (which we are, in the browser market). Google now advocates testing across all browsers:

Internet users have an increasing number of choices for web browsers today, including Firefox, Safari, Opera, and now Google Chrome. Sometimes web pages look and work differently in each browser, so it’s important to test your site across all of them to ensure all your visitors can enjoy the experience you’ve designed. (My emphasis)

There are a lot of features of Chrome borrowed from other browsers. Google acknowledges the influence of Firefox and WebKit, but not all the things it borrowed from Opera, which is a shame, but we’re used to it: Ben Ward wrote on Jon Hicks’ blog

I think I’m just sour at their presentation of Opera’s features as their own. The whole comic reads like the speed dial and omnibar are ingenious ideas that Google thought up to revolutionise your web experience. Then whilst Mozilla and WebKit get special thanks in the final panel, Opera gets nothing.

I don’t even use Opera, but in an industry where we preach so much about attribution and respect for the work of others, I’m not happy at the way Google have just danced in like this.

I replied “if there’s one thing that my three months at Opera has taught me (apart from how to drink like a Norwegian) it’s that Opera is constantly overlooked when it comes to doling out the props for its innovations or initiatives.” (That could be why we’re even overlooked in the Chrome user agent string Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Chrome/0.X.Y.Z Safari/525.13, thereby identifying itself to web servers as 1) Mozilla 2) WebKit, 3) KHTML, 4) Gecko, 5) Safari and 6) itself.)

The best thing about Chrome to me is the exposure it’s getting. It was even on the TV news last night. Hopefully, people who always thought that the big blue “e” and the Internet were synonymous will now realise that there is choice in the browser market, and they will make that choice rather than go with the pre-installed browser. Some will choose Chrome, some will choose Firefox and some will choose Opera, and that’s how it should be.

What’s your take, dear chums?

August was miserable as far as the weather was concerned, and pretty intense as the wife and kids went away on hols so all I did 14 hour days most days to try to get up to speed with working for a web browser.

What was lovely about August was the opportunities to hang out with some really cool old mates. Firstly, my old colleague and fellow union rep Bill from MVS/ JCL programming days in the late eighties. We shared several beers in Birmingham and discovered that we remain godless lefties. Hurrah!

Then, my marvellously debauched mate Johnny came to visit from Osaka. Originally a colleague from Bangkok, Johnny looks no different now, ten years, 400 women and 9,000,000 pints later.

The bank holiday saw a family celebration for my kid brother’s 40th birthday.

And last weekend it was off to Cambridge to the home of Steph and her Algerian husband, George. Steph introduced me to my wife when we worked in Thailand and is a woman of great wisdom who can sing “Hotel California” in a seedy Soi Cowboy bar even when incoherently drunk.

George cooked a pre-Ramadan Algerian barbeque and we were joined by Masako, who’s visiting from Thailand with her 7 month baby bump and three year old daugher, Shalala (horrible post-sneeze photo).

Thanks all for such a cool set of reunions!

The American National Federation for the Blind brought a class action lawsuit against target.com for inaccessibility of its website (which is, interestingly, “powered by Amazon.com”).

After lots of to-and-fro, news came today that Target have settled, paying $6million into a fund from which those affected by its inaccessiiblity (blind people in California) can claim.

Presumably (I am not a lawyer, but am I gorgeous) this sets a precedent in the USA that many businesses will find unwelcome, but which will presumably lead to more accessible websites.

So why only two cheers?

Well, $6million is lots of money, but given that Target gives away $3million every week “to its local communities through grants and special programs”, it isn’t such a great investment by Target. The terms of the settlement also means that the only people being catered for by this settlement are blind screenreader users:

NFB will run an automated monitoring tool called Worldspace on Target.com every quarter…

Target shall ensure that the Target.com website meets the Target Online Assistive Technology Guidelines, attached as Exhibit C [not on website], and that blind guests using screen-reader software may acquire the same information and engage in the same transactions as are available to sighted guests with substantially equivalent ease of use.

Upon completion of the changes to Target.com pursuant to Section 6.2 herein, the NFB shall certify the Target.com website through its NFB Nonvisual Accessibility Certification program using the standard techniques and criteria of that program.

NFB will annually report to Target the results of user testing by 5 to 15 blind persons with varying skill levels and using JAWS…

Target shall ensure that complaints received from guests regarding the accessibility of Target.com by those using screen-reader technology are reported to a Target employee responsible for ensuring that Target.com is accessible.

Target shall provide to the NFB a quarterly summary of any complaints received from guests regarding the accessibility or usability of Target.com by those using screen-reader technology…

NFB Nonvisual Accessibility Certification. Upon completion of the changes to Target.com pursuant to Section 6.2 herein, the NFB shall certify the Target.com website through its NFB Nonvisual Accessibility Certification program using the standard techniques and criteria of that program.

I have no idea what the NFB Nonvisual Accessibility Certification program actually entails, but the NFB’s legitimate remit probably means it’s concerned only with screenreader access:

Working with members of the technology community, the National Federation of the Blind has developed a rigorous procedure by which Web sites and applications that have made special efforts to be accessible to the blind can be identified and recognized.

Accessibility is more than just blind people who use screenreaders. It’s a pity (but it’s understandable) that the NFB didn’t think of other groups with accessibility problems and require development to standards laid down in the internationally-recognised, open WCAG guidelines rather than their own proprietary process.

The danger is that corporations and developers will start developing for the assistive technologies and monitoring tools (machines) rather than people, and that would be a very retrograde step.

Comments on the Opera Developers Network blog, please (no registration required).

Recently, Opera sponsored Geek in The Park 2008 by picking up the tab for audio transcription of the talks. It’s one thing that often gets overlooked by conferences and it’s something that Opera takes very seriously. Equally, you can’t expect speakers and organisers of a grassroots event to pay for it when they’re giving their time for free.

The company I used is called Casting Words, and I want to recommend them to you. After cleaning up the audio, I uploaded it to their site and selected their six-day turnaround service at $1.50 per minute. Four days later the transcripts were returned, with very few errors, particularly when you consider the technical nature of the content. You get them returned as text, RTF and HTML, and the markup is not bad: it’s set out as blockquotes with speakers’ names in cite elements.

The only problem is that multiple paragraphs inside blockquotes are marked up with double br elements rather than wrapped in p elements, so I emailed their support to ask them if it would be possible to amend their publishing system accordingly. Rachel wrote back “Thanks for letting us know about this, we will make that change.”

Now that’s service.

And when a 45 minute conference talk only costs £30 to transcribe, it’s difficult to imagine why organisers of for-profit conferences wouldn’t provide a transcript of their events.

(The transcriptions are being checked by the speakers and will be published when they’re proofed.)

This is consumer-level printer which cost me £70.

It’s quite a nice machine, but the software that powers it is abominable. On a brand new Vista install, it regularly loses knowledge of the network and has to be reinstalled (a process which takes at least 15 minutes of whirring).

On a clean XP install, the software for one some unwanted Photo Gallery package regularly pops up an error message. The modules aren’t installed a separate programs, so I can’t just delete that module in Control Panel. So now I have to continually get the task manager to nuke the process that pops up this consumer-friendly error message:

System.NullReferenceException: Object reference not set to an instance
of an object.
at HP.CUE.Video.PlaybackControl.UpdateProgressBar()
at HP.CUE.Video.PlaybackControl._ProgressTimer_Tick(Object sender,
EventArgs e)
at System.Windows.Forms.Timer.OnTick(EventArgs e)
at System.Windows.Forms.Timer.Callback(IntPtr hWnd, Int32 msg,
IntPtr idEvent, IntPtr dwTime)

For all I know, every HP printer uses this software. Buyer beware.

Life’s too short for crap software—particularly dull utility software like printer drivers.

Yesterday, Microsoft gave me a free lunch. Not to say sorry about Vista, but because I went to Cambridge to observe the CSS working group’s face-to-face meeting. I was geekily excited to hear them discuss the topic “what is a br element”, and to meet fantasai, with whom I’d worked to gather web designers’ wishes for CSS 3 (and who promises faithfully that the feedback on those wishes is imminent).

The “what is a break” didn’t disappoint. Is it, as Håkon suggested, {content:'\A'; white-space:pre;}? But what about the fact that a single break has no height, but two (or multiple) breaks do? So should we add the rule br+br {content:'\A'; white-space:pre; height:1 em;}?

Someone else pointed out that the break element was more than just a presentational effect, and it has semantics - for example, when used to mark up poetry or code. So is it best described by defining a new value display:break;?

This idea was parked; whereas in CSS 3, a new value for the display property is theoretically possible (but hugely complex), but it can’t be done for CSS 2.1. As you might know, the CSS 2.1 spec is

a “snapshot” of CSS usage: it consists of all CSS features that are implemented interoperably at the date of publication of the Recommendation.

Amongst other things, the CSS 2.1 specification doesn’t allow an author or implementer to learn how an HTML br should be styled. For example, Microsoft and Mozilla both allow page-break-* to be set on the break element, and all the big four allow br style="clear:left;" to be specified. The problem is that the CSS 2 spec only allows these properties to be set on block level elements, and br is an inline element. (Or is it? There was some debate about whether it was its own kind of element).

It would be wrong to blame the browsers for all allowing clear to be set; the br element has been in the language since dinosaurs roamed the earth, and CSS 1 allowed clear on all elements, not just the block-levels:

Note. This property applied to all elements in CSS1. Implementations may therefore have supported this property on all elements. In CSS2 and CSS 2.1 the ‘clear’ property only applies to block-level elements. Therefore authors should only use this property on block-level elements. If an implementation does support clear on inline elements, rather than setting a clearance as explained above, the implementation should force a break and effectively insert one or more empty line boxes (or shifting the new line box downward as described in section 9.5) to move the top of the cleared inline’s line box to below the respective floating box(es).

CSS 2.1 definition of clear

There was no question whether the exceptional behaviour of br should be specified, only that of how. Anne wanted to make it a special case, by saying html:br may have page-break-* applied, but others objected because CSS is not just for styling HTML:

CSS is the Web’s primary style sheet language for specifying the rendering of text documents, in particular those expressed in HTML and XML-based formats. It can also be used to specify portions of the rendering of certain non-text formats, such as SMIL (multimedia) and SVG (vector graphics).

CSS Working Group charter

Eventually, consensus was reached, expressing it in a way that nobody liked but everyone can live with: page-break applies to block-level elements and may also be applied to “other elements”. Whether this means that I could develop my brand new Bruce-browser by reading the amended CSS 2.1 spec and interoperably implement br is doubtful (so I’ll abandon that plan and carry on with Opera, after all!).

The whole conversation is minuted on the IRC logs. One thing that that impressed me, and which doesn’t come over in the minutes, is how much the participants care about users, web authors and designers. On issues where there are several solutions and none is technically superior, the group asked Molly and Jason Cranford Teague (the designers in attendance that day) to make the call. My thanks to all of them for agreeing to my request to observe.

Fantasai is even groovier in real life than online. There are even photos to prove they’re all real people!

Comments on the Opera Developer Relations team blog, if you please (no registration required).

On 11 and 12 September in Amsterdam, I shall be delighting the crowned heads of Europe and other high class sophisticates by talking about accessibility and Search Engine Optimisation. Chris Mills will also be there from Opera. Also travelling from Blighty are Stuart Langridge, Andy Clarke, Dean Edwards and Christian Heilmann.

Why not come along?

It’s interesting that the Google map of the venue has a large area of pixellation. PPK informs me that it’s Navy wharf.

I’m disappointed. I thought it was Amsterdam’s pubic area, and Google were being all J-Porn on me.

After a question about image replacement on accessify forums, I began to explore the image replacement options that CSS 3 will offer us. There is a potentially a mechanism using the content property that requires no extra markup and which degrades well even with CSS on and images off, because it doesn’t hide the text it replaces.

I discuss it on the new Opera Developer Relations team blog (part of the forthcoming ODiN, the Opera Developers Network), so comments there please.

(You might consider subscribing to the ODiN blog, as it’s a group blog for the Developer Relations team to discuss all things Web; it’s not a place for pimping Opera and slagging off the opposition.)

CSS 3 image replacement

Since before the dawn of time, designers have wanted sexy fonts or images for headings, links and buttons on web pages. The adoption of @font-face for CSS to use any font a designer specifies will take away some of the use cases. The time-honoured method of using img in the source code, and using the alt attribute to as a text alternative still works, of course, and very nice it is too, but some designers prefer to use CSS to replace text with an image.

There is a variety of image replacement techniques, but they all add a background image and then hide the text, usually by moving off the screen. They all suffer from restrictions: they can only be used with opaque images, or against flat colour, or they need extra spans for style hooks. There’s also the problem of people who surf with images off, which is quite common for those using phones whose web use is metered. They don’t see the image, but don’t see the text either.

Using the content property

The CSS 3 content property is experimentally supported by Opera and Safari. Firefox supports the CSS 2.1 spec when used with the :before and :after pseudo-elements and there is rudimentary support (so far) by IE 8 beta.

It allows you to "insert" text or an image into an element, over-writing the HTML content of the element.

So, for example, this code snippet will replace my name in the h1 with my blog logo:

h1 { content: url(bruce-logo.jpg); }
<h1>Bruce Lawson’s gorgeous blog</h1>

You can see it in action on this image replacement test page.

It’s interesting to note how the browsers style this differently. To centre the logo, you need to style the h1 with text-align:center, as if Opera centres the real text and then replaces it with the image. Safari will only centre the logo with margins, as if it replaces the text with an virtual img tag, which is then impervious to text-align.

What should browsers do if the image can’t be shown?

I think, in any circumstance that a browser can’t show an image, it should show the content of the element in the natural position for that text. That would ensure that this CSS 3 image replacement technique degrades well when CSS and images are off.

This behaviour would be similar to iframe: “The information to be inserted inline is designated by the src attribute of this element. The contents of the iframe element, on the other hand, should only be displayed by user agents that do not support frames or are configured not to display frames.” In a similar way, html has a fallback mechanism for images and objects: when it can’t show the image, it shows the alternate text.

Here’s where the support for this image replacement mechanism gets experimental, even in the highly standards-compliant browsers. This is because the specification changed between CSS 2.1 and CSS 3.

CSS 2.1 said

If the user agent cannot display the resource it must either leave it out as if it were not specified or display some indication that the resource cannot be displayed. CSS2 spec

So the current "standard" says that it should either show the contents of the element (the actual text between the tags), which makes sense to me, or some sort of “image not found” icon, which seems to me to be the worst of all worlds. If a screenreader or a search robot gets the plain text, why not a user who has images switched off?

The CSS 3 spec allows you to set a series of fallbacks, much like when you set font-family. So here, the browser will try to replace the header with a movie, then an animated gif if it can’t find or display the movie, or a standard jpg if it can’t find or display that gif, and if it can’t render any of those, it will just show the contents of the element:

h1 {content: url(header.ogv), url(header.gif), url (header.jpg), contents; }

The spec says

If no alternatives exist, then ‘none’ is used as a final fallback…Thus to make an element fallback on its contents, you have to explicitly give ‘contents’ as a fallback. CSS 3 spec

To me, it’s odd that anyone should want to display nothing instead of the content, let alone make it the default, but at least the new specification allows you to unambiguously tell the browser to display the contents of the element: it’s not allowed to "choose" between the text and a "image not found" icon.

What do browsers do?

However, browser support is still experimental as the generated and replaced content module of CSS 3 is still susceptible to change. My no-images test page shows that Opera and Safari still have problems following the CSS 3 spec fully.

Conclusion

Once the CSS 3 spec is finalised and the browser support is solid, a foolproof way of doing image replacement will be available to us that is accessible to screenreaders and which degrades gracefully with CSS off and with images off.

Comments on the Opera Developer Relations team blog; no registration is required.

Although the weather made the picnic impossible, 40 alpha geeks and an 11 year old girl congregated in a Leamington Spa bar for 2008’s Geek in the Park. The talks were really good: Jon Hicks on icon design was fun, because it’s always fascinating to see people talking about stuff they’re passionate about. Drew Mclellan was inspiredly wierd when linking Brian Cant to microformats.

I thoroughly enjoyed meeting up with old chums and local heroes like Owen from fullcreammilk and Mark “fam fam fam” James. One Black Bear bought a round of drinks for everybody (yay!). The event was organised by Trovster. It’s totally free and 100% grass-roots. A brilliant job; I take my hat off to him.

I used four minutes to talk about Opera as we were sponsoring. A few people asked me for links to some of the things I said, so here they are and a rough record of what I remember saying.

The four-minute Opera pimp: test with Opera, please

Opera works best with good, valid code. If your boss tells you it’s not worth cleaning the code to allow Opera users in because they’re not numerous enough, point out that Opera on 135 million mobile phones. Most bosses are very interested in the mobile market—even ultra-conservative organisations like banks. (Barclays, for example, recommends Opera for mobile banking.)

Opera on a phone is the same as Opera on the desktop; we use the same core (called “Presto”) for all the browsers, so if your site works in Opera desktop (and it will, if the code is clean) then it’ll work on Opera phones. Should you need to test a phone application, our developer tool, Opera Dragonfly, allows you to remotely debug a phone from your desktop (typing in test data via a phone keyboard fast becomes tedious!).

I mentioned Web Standards: Opera is the most standards-compliant browser. Some people claim that Web Standards are now the norm. We wish it were so, but it isn’t. We’ve done some research (which we’ll publish in the next couple of weeks): on a large sample, only 0.71% validated in 2001. By 2006 that was up to 2.6%. By January 2008, that was a dizzying 4.13%. Of the Alexa top 500 6.6% validate. Amusingly, of sites that display a w3c “valid” badge, only 50% validate.

So we’re very active in Standards promotion. We help make them: our Head of Standards was involved in the Mobile Web Best Practices guidelines which became a w3c recommendation last month. We’re involved in HTML 5 and CSS (which was invented by our Chief Technology Officer).

We also educate people about Standards; we’ve produced the Web Standards Curriculum which is free, open and available to anyone. If you hire a new developer and you want a crash-course that will teach them the right way, give them that. We do university tours; a UK one is scheduled 13-16 October.

Elsewhere

• Owen Gregory’s write-up
• Flickr

Although I lived in East Asia for four years, I never visited China. Although I’d love to see it, my conscience won’t allow me to give a penny to its corrupt and immoral leadership, particularly after my experience with Tibetan refugees in India.

So I find myself in the slightly odd position of agreeing wholeheartedly with President Bush (!) when he said yesterday,

The United States believes the people of China deserve the fundamental liberty that is the natural right of all human beings. So America stands in firm opposition to China’s detention of political dissidents and human rights advocates and religious activists…

Ultimately, only China can decide what course it will follow. America and our partners are realistic, and we’re prepared for any possibility. I’m optimistic about China’s future. Young people who grow up with the freedom to trade goods will ultimately demand the freedom to trade ideas, especially on an unrestricted Internet. Change in China will arrive on its own terms and in keeping with its own history and its own traditions. Yet change will arrive. And it will be clear for all to see that those who aspire to speak their conscience and worship their God are no threat to the future of China.

As a member of Amnesty International, I entirely support this view, and applaud his speaking out.

In entirely unrelated news, another superpower has finally tried someone whom it imprisoned for five years with no habeas corpus. The jury disregarded the ruling regime’s request for a 30 year prison sentence, instead choosing to imprison him until early next year. The judge said, “I hope the day comes when you return to your wife and your daughters and your country.”

However, the regime has said that it will not release him when his sentence is finished, but will incarcerate him indefinitely in Guantanamo Bay.

I look forward to President Bush’s similar denunciation of this violation of human rights.