Web 2.0 Expo: HTML5 (Now)

In his HTML5 (Now) talk at Web 2.0 Expo in New York, Tantek Çelik described what is currently usable in HTML5 now and what cane be experimented with for future use. Here’s my notes from his talk:

•We’re in a unique era of the Web. It’s the first time leaders of major companies have stood up and expressed support for a Web standard: Apple, Microsoft, Google, etc. HTML5 even has it’s own brand.

HTML5 is a markup & DOM specification. There are a number of other specifications that work well with HTML5: CSS3, Web Workers, APIs, etc. but these are not parts of HTML5.

You can start using HTML5 today. Some parts are practical now, others are roughly usable, others are available for early experimentation.

Practical now: article, header, footer, and aside elements can be used. Apps that understand these semantics can adjust display and interactions accordingly.

Practical now: If your site has an audio or video, you need to use audio and video tags to make things work on mobile devices. You need the H.264 format to make your videos work on iOS mobile devices. Video.js provides tools that help you manage video formats across different browsers.

Practical now: Geolocation API is the only “Web API” that is ready for candidate recommendation. Already in most mobile web browsers. It provides context for mobile –so you can usually make your app better if you use it.

Roughly Usable: History APIs. #! URLs break the web because they depend on Javascript to work. History APIs update the current URL so the back button works & URLs can be shared. Facebook & Flickr use this. IE will support this in IE10. Give browsers that don’t support History API a fallback of full page loads.

Web App experiments are drafts –they can change at any time and break what you are doing. For example, the Web SQL database API has been abandoned.

Modernizer will detect API support. HTML5 shims keeps track of Javscript libraries that mimic the functionality of modern APIs in older Web browsers.

Web Apps need to adapt. Use progressive enhancement to build pages that still work when any layers fail.

Use HTML5 offline applications to detect when an app is offline, then synch up with server later.