Why Open Web Standards are cool and will save the world. Or the Web, at least.

Why Open Web Standards arecool and will save the world. Orthe Web, at least.Bruce Lawson / Leeds University 5 May 2011

Web Evangelist at Opera

Opera – one browser on many devices

"Our goal is to take the one true Web and make it available to people on their terms." Jon S. von Tetzchner, Opera Co-founder"All I ask is access to the full Web, everywhere. And some more beer." Me

Executive Summary:Open Web Standards make the Web open forpeople with disabilities and people without access to the latest expensive hardware.

Executive Summary continued:Open Web Standards reduce reliance on any single vendor. Open Web Standards = profit!

Open StandardsNot the same thing as Open Source Made out in the open Royalty-free Not tied to one vendor

The most important program on your computer is your browser

http://www.koreatimes.co.kr/www/news/biz/2010/05/123_52401.html

Legal and Generals redesign www.brucelawson.co.uk/pas78

By-products of the redesign:● 30% increase in natural search-engine traffic● 75% reduction in page load time● No more browser-incompatibility problems● Accessible to mobile devices● Time spent to manage content “reduced from5 days to 0.5 days per job”

No money, no honey etc● Savings of £200,000 annually on sitemaintenance● 90% increase in online sales● 100% return on investment in less than 12months.

1. new web standards2. adaptive content3. browser as platform

HTML5<!DOCTYPE html>

HTML5 does not replace HTML 4.01

HTML5 has more bling!

HTML5 is umbrella term:markup elements and JavaScript APIs

Webforms – more powerful form elements

standardise commonly-usedrich form elements – without JavaScript

built-in validation (of course you should still validate on the server) <input type=email> <input type=url required> <input type=range min=10 max=100> <input type=date min=2010-01-01 max=2010-12-31><input pattern="[0-9][A-Z]{3}" placeholder="9AAA"> http://people.opera.com/brucel/demo/html5-forms-demo.html

<canvas>“scriptable images”

<video>

“...extending the language to better support Webapplications, since that is one of the directions the Web isgoing in and is one of the areas least well served by HTMLso far. This puts HTML in direct competition with othertechnologies intended for applications deployed over theWeb, in particular Flash and Silverlight.”Ian Hickson, Editor of HTML5http://lists.w3.org/Archives/Public/public-html/2009Jan/0215.html

<video src=pudding.ogv controls autoplay poster=poster.jpg width=320 height=240> <a href=video.ogv>Download movie</a></video>

video as native object...why is it important?● “play nice” with rest of the page● keyboard accessibility built-in● API for controls

video formats webM Ogg/ Theora mp4/ h264Opera yes yesChrome yes yes Nope (Chrome.soon)Firefox Yes (FF4) yesSafari yesIE9 Yes (if installed) yes

The politics of codecs

audio formats mp3 Ogg/ Vobis wavOpera yes yesChrome yes yesFirefox yes yesSafari yes yesIE9 yes yes

Towards a World-Wide Web1.6 billion people are online, yet more than 4billion people — two out of every three peopleon Earth — have a mobile phone or access toone.www.opera.com/smw/2009/10/

China“The proportion of [people] accessing theInternet by mobile increased enormously from39.5% in late 2008 to 46% in June 2009, whilethe proportion of using desktops and laptopsdecreased”. (close to 150 million people).Statistical Report on Internet Development in China, p25-26, July 2009, www.ccnic.cn

IndiaThere is one bank branch for every 14,000people, one ATM for every 5000 people but amobile for every 2.3 people in India.More people in India have access to a mobilephone than even a proper toilet.

“One Web means making, as far as is reasonable, thesame information and services available to usersirrespective of the device they are using. However, it doesnot mean that exactly the same information is available inexactly the same representation across all devices.”W3C Mobile Web Best Practices http://www.w3.org/TR/mobile-bp/#OneWeb

CSS 3 Media Queries:@media screen and (max-device-width: 480px) { // insert CSS rules here}http://www.w3.org/TR/css3-mediaqueries/Demonstration of Media Queries

“…the browser run-time isperfect…you’re out of writing forWindows Mobile, Android, S60,each of which require testing...wewant to abstract that.All the cool innovation ishappening inside the browser –you don’t need to write to thenative operating systemanymore.”Mobile Entertainment Market, June, 2009

W3C Widgets – application development filled with web standards goodness, using browser engine as platform

Anatomy of a widget

www.opera.com/developer bruce.lawson@opera.com twitter.com@brucel

Why Open Web Standards are cool and will save the world. Or the Web, at least.

by brucelawson

Accessibility

Upload Details

Usage Rights

1 Embed 43

Statistics