WHY HTML5

To enable developers to create apps and websites that requires, multimedia, filesystem, animation.

Make the browsers plugin free, and using the new native support for audio and video.

To have offline access to the Web using client-side storage and caching functionality.

It’s about rich Internet clients. Instead of building clients with plug-ins like Flash .

To enable developers to create apps having same experience as desktop applications.

WHAT is HTML5

HTML5 = Markup + JavaScript APIs + CSS

That is, we have markup to build the core structure of our pages, we have JavaScript along with all its APIs to add behavior and new functionality, and we have CSS to style our pages—and together. So HTML5 is not only about markup, it is a technology in itself that will push the web forward.

HTML5 is the ubiquitous platform for the web. Whether you’re a mobile web developer, an enterprise with specific business needs, or a serious game developer looking to explore the web as a new platform, HTML5 has something for you.

HTML5 Features:-

Native Audio/Video

Forms

Offline Web and Storage

Presentation

3D/Graphics

Local File Access

RealTime Communication and Server Push:-

How to start working on HTML5

Native Audio and Video:-

Instead of relying on a third-party plugin, audio and video can be built using web technologies now. HTML5 has improved embedding of audio and video by providing native support for many different filetypes.

How to build audio video into your web-app

Forms:-

In HTML5, new functionality for forms was introduced, including validation and new form fields. This makes it much simpler to build complicated forms because you don’t need to rely on custom Javascript functionality.

How to build features using forms in HTML5.

Offline Web and Storage:-

HTML5 and related specs introduce a number of features to make offline web apps a reality such as:-

Application cache, localStorage, sessionStorage, IndexedDB, File System and online and offline events enable apps to smoothly work with or without online connection.

HTML 5 provides a smarter solution for improving offline caching. While building the site, the developer can specify the files that the browser should cache. So, even if you refresh the page when you are offline, the page will still load correctly. This sort of caching has several advantages like offline browsing; files load much faster and reduced load on server.

Offline web apps enable users to continue interacting with web applications and documents even when their network connection is unavailable. The user can, for example, access email locally without to connect to internet or install an external client.

Practicle example on offline caching

Gmail client that works offline on Chrome is another enterprise level example.

For more on offline

For more on storage

How to make your application work offline:-

Presentation:-

With the introduction of CSS3 it has never been easier to create rich and beautiful sites and applications in HTML. There are many new technologies and extensions to CSS3 including: 2D Transformations, Transitions, 3D Transforms and WebFonts to name just a few

For more on presentations.

3D/Graphics:-

With the addition of technologies like canvas element, WebGL, SVG, 3D CSS transforms one can produce animations and visual effects and they dont have to rely it on plugins like Flash. Many mobile and desktop browser games are also coming with the help of canvas element.

More on graphics

Build your first game on Canvas

Local File Access:-

With the file system api we can have direct interaction between the web and local files and one can create apps for photo video editing, music mixers, media visualization tools that directly assess your music files, images videos.

HTML5 finally provides a standard way to interact with local files, via the File API specification.

File System API

More on local file access

RealTime Communication and Server Push:-

Websockets:- They provide full-duplex channels. Connections can both send data to the browser and receive data from the browser. A good example of an application that could use websockets is a chat application.

SSE connections can only push data to the browser. Online stock quotes, or twitters updating timeline or feed are good examples of an application that could benefit from SSE.

More on SSE

More on WebSockets

Predictions on HTML5 :-

Web browsers will look more like iPhones

More and more applications will just be built in HTML5

Browser manufacturers will get into the App Store business

Many more applications will use offline cache

HTML5 ads will become prevalent and overtake Flash.

JavaScript will get a lot faster with better memory management

Canvas will get hardware acceleration in more browsers

People will play popular HTML5 games on their mobile devices

Written By:-

Gaurav Gupta

Mobile Developer at