Your browser doesn't support the features required by impress.js, so you are presented with a simplified version of this presentation.

For the best experience please use the latest Chrome Safari or Firefox browser.

HTML5 and the Mobile Web Revolution

Claudio Riva

So, what is

HTML version 5 ?

1998 - W3C decided they will stop evolving HTML beyond version 4.01
2000 - W3C released XHTML 1.0 and force the world to use XML
2002 - W3C released first draft of XHTML 2.0, no backwards compatibility
2004 - WHATWG started working on HTML v5 (Opera, Mozilla and Apple)
2006 - W3C agrees to use WHATWG proposal for HTML5
2009 - W3C stops works on XHTML 2.0 and resources are diverted to HTML5

Philosophy of HTML v5

Specify undocumented features (e.g. XMLHttpRequest)

Browser behaviour with invalid markup

Support web applications

Define an open standard (opposed to Flash)

Don't break the Web

New Tags

section, header, footer, nav, ...


New Form Controls & Types

date, range, email, url, tel, ...


New Form Validation

by type, required, :valid, :invalid, :required

Offline Usage

Install a package on the device

online/offline events


Storage

Persistent and Session Storage

key/value (strings)

IndexDB and SQL storage

Multimedia

Audio and Video Tags

Javascript API & events

Some codecs supported

3D, Graphics and Effects

2D Canvas API

SVG support

WebGL

Device Access

Accelerometer / gyroscope / magnetometer

Orientation change

Touch events (touchstart, touchmove, touchend)

File API and File Reader

Media Capture API

CSS New Styling

    Rounded borders, shadows, opacity


CSS 2D & 3D transforms

    rotate, scale, skew, translate


CSS Transitions

    basic animations between 2 states

    keyframe animations

Communication

Web Sockets

Server-sent Events

Performance & Optimization

Notifications API

XMLHttpRequest 2

Web Workers

Does this stuff actually work ?
What about

mobile HTML5 ?

What's the

HTML5 promise

for mobile development ?
Mobile Platforms
Smartphone Platforms Shares
Smartphone Languages Shares
Smartphone Browser Shares
Smartphone HTML5 Shares
Is it really that easy ?
Web Browsers

Too many

Some are limited

Some are too innovative

Some are proxy based

Little debugging support

Various input methods (focus, cursor, touch, multi-touch)

API support

Adaptation

Optimization
Mobile usability
Touch vs Click

Viewport

Full screen

Pixel density

Data URI - inlining content

CSS3 is beta

Hybrid Apps
Mobile web is slow
Performance Optimization

No redirect

Semantic html5

Leverage CSS

Inline images

Reduce HTTP requests

Web Development is fun


Master HTML + JS + CSS

Some server programming language

HTML5 introduced new cool stuff

Thank You

www.aaltowebapps.com

Use a spacebar or arrow keys to navigate