Building Web Applications with HTML5

What is HTML5?HTML5 is the new standard of markup language for structuring and presenting content for the World Wide Web.

It includes detailed processing models to encourage more interoperable implementations; it extends, improves and rationalises the markup available for documents, and introduces markup and application programming interfaces (APIs) for complex web applications.

HTML5 is also a potential candidate for cross-platform mobile applications

World Wide Web Consortium Web Hypertext Application Technology Working Group

(WHATWG).

History of HTML

1991 HTML 1.01995 HTML 2.01997 HTML 3.21999 HTML 4.012000 XHTML 1.02008 HTML5 (First Draft)

HTML5 Roadmap

2011 Last Call2012 Candidate RecommendationIn July 2012, WHATWG and W3C decided on a degree of separation. W3C will continue the HTML5 specification work, focusing on a single definitive standard, which is considered as a "snapshot" by WHATWG. The WHATWG organization will continue its work with HTML5 as a "Living Standard". The concept of a living standard is that it is never complete and is always being updated and improved. New features can be added but functionality will not be removed

2014 Stable Release2016 HTML 5.12022 Rumoured Completion

HTML5 Test

http://html5test.com

HTML5 Feature Areas

• Border Radius• Gradients• Web Fonts• Media Queries• Transitions & Transformations• Web Fonts• Opacity• Shadow

• Browsers cache data in an Application Cache

• HTML5 allows online and offline detection

• Cross Document messaging• XMLHttpRequest Level 2• Server-sent Events• Web Sockets• CORS

Connectivity Features

• New W3C API and IETF protocol for low latency real-time, bi-directional connections

• Easily add social networking components (Chat, etc.) and real-time data to static pages

Web Sockets

Developing with HTML5

JS Frameworks CSS Frameworks

Persistence Layer

Development Stack Transition

UI

UI Framework

Messaging Layer

Backend Framework

Persistence Framework

Why Change?• UI Limitations & Bugs• Flexibility in layout, content manipulation, design• Rapid Development

o Faster application deploymento Reduce coding timeo Inbuilt debugging tools

• Ride on HTML5 advancementso Performanceo Interactivity

• Improve users efficiencyo Better UI componentso Push-notifications / feedbackso Form auto-complete, History, Bookmarks

• Adopting the latest Technology