11. o HTML5 includes the 5th
revision of the HTML markup
language, CSS3, and a series
of JavaScript APIs.
o Not owned by any particular
company or a specific browser.
o Developed by a consortium
of companies like Mozilla,
Opera, Apple, Google and
many other â WHATWG &
W3C
13. But .. Why HTML5?
âąREACH
âą PORTABILITY
âą FREEDOM
âą RICH Graphics
âą PERFORMANCE
âą SEMANTICS
âą INTERACTIVITY
âą OFFLINE ACCESS
âą REAL-TIME
âą Security
âą And a whole bunch more of features âŠâŠ
14. Making Web
Beautiful
âą Demo of FLUID
Canvas, WebGL & JS
â https://developer.mozilla.org/en-US/demos/detail/fluid
15. Making Web Beautiful
âą HTML5 is a full-fledged platform for graphic
based applications
â 3D Rendering
â Shadows & Lighting
â Vectors and much more.
âą Making browser your CANVAS
â Canvas element provides an API for 2D drawing
â Support for Mobile Devices
â Ball Code Example
âą WebGL
â Web Graphics Library
â JS Library to render 3D/2D Graphics without any
plugins
â Can directly communicate with GPU
18. Web Freedom
âą Problems with Proprietary Plug-ins
â Control transfer from browser to 3rd party
application
â âAnother Pieceâ for the users to find
â Major cause of browser instability and security
issue
â Mostly closed-source and paid
19. âą Old school <embed>
<object width=â425â height=â344â>
<param name=âmovieâ
value=âhttp://www.youtube.com/9sEI1AUFJKw&h
l=en_GB&fs=1&â></param>
...
<embed
src=âhttp://www.youtube.com/v/9sEI1AUFJKw&h
l=en_GB&fs=1&â type=âapplication/x-
shockwave-flashâ allowscriptaccess=âalwaysâ
allowfullscreen=âtrueâ width=â425â
height=â344â></embed>
</object>
HTML5 Video & Audio
20. âą HTML 5 way of doing it :
<video>
<source src=âMyVideo.ogv" type='video/ogg;
codecs="theora, vorbis"'>
</video>
âą Fully integrated with all other aspects of the
document â CSS/JS/Canvas etc
âą Demo
HTML5 Video & Audio
22. HTML5 Forms
âą Faster and better forms.
âą âContent-Awareâ
âą Many new input types:
â Email,phone,url
â Date,time
â range
âą Browser Validation without any extra code!
âą Demo
29. Much More to HTML5
âą Cleaner & Semantic Code
âą Data Storage & Offline data access
âą Web Workers
âą Drag & Drop and File System Access
âą Direct Hardware Support
âą Geolocation Capabilities
âą Notifications
âą Much more!