Downloaded 34 times
Uploaded bySanthosh Kumar Srinivasan
HTML 5 - A developers perspective
HTML5 is the next major revision of the HTML standard currently under development by the WHATWG and W3C. It introduces many new features including new semantic elements, canvas element for 2D graphics, video and audio elements, local storage, and geographic location. CSS3 also introduces many new features such as rounded corners, box shadows, gradients, transitions and 2D/3D transforms allowing developers to create richer designs. Together, HTML5 and CSS3 make web development easier by handling more tasks like drag and drop and client side storage, allowing developers to focus on the core functionality of their applications.
More Related Content
Similar to HTML 5 - A developers perspective
![Coded Agents – with UiPath SDK + LangGraph [Virtual Hands-on Workshop]](https://cdn.slidesharecdn.com/ss_thumbnails/codedagentsdeck-251215155422-5497c599-thumbnail.jpg?width=640&height=640&fit=bounds)
HTML 5 - A developers perspective
- 1. A Developers PerspectiveintroducingHTML5 & CSS 3S.Santhosh Kumar9941497246, @santhotechsanthosh@systeminsights.com
- 2. HTML5 is the nextmajor revision of the HTML standard, currently under development. Like its immediate predecessors, HTML 4.01 and XHTML 1.1, HTML5 is a standard for structuring and presenting content on the World Wide Web. The Web Hypertext Application Technology Working Group (WHATWG) began work on the new standard in 2004. It all starts with<!DOCTYPE HTML>Keep Updating!!!!Everything Starts with a WIKI…HTML 4.01 ?!?!
- 3. In 2004, whenthe World Wide Web Consortium (W3C) was focusing future developments on XHTML 2.0, and HTML 4.01 had not been updated since 2000In 2009, the W3C allowed the XHTML 2.0 Working Group's charter to expire, and decided not to renew it. W3C and WHATWG are currently working together on the development of HTML5.A great gateway for the developers to lessen their workWhat about the previous version?
- 4. Important Features ofHTML 5132Graphics and Multimedia made EasyNew and Advanced Controls, Sockets and Communication capabilities.Better hardware usage and advanced OS integrationMake the browser work for you not the other way around
- 5. New and AdvancedControls, Advanced Communication CapabilitiesMore flexibility from the browsers. Does most of the work.1
- 6. New controls thathas been AddedSliders
- 7.
- 8.
- 9.
- 10.
- 11.
- 12. Progress BarCommonly neededControlsFeaturesNo more manual client side validations
- 13. No customized controlneeded
- 14. Browser takes careof stuff
- 15. Makes developers lifea lot easierSelectors & Semantic TagsDesign easily with new layout tags like <header>, <footer>, <nav>, <aside> etcNew Layout TagsGet the skeleton designed in no time at all.
- 16. CommunicationEstablish two waycommunications effectively with web sockets in your client browser.Run extremely long scripts without eating away your performance using web workers.
- 17. 2Better Hardware Usageand OS integrationMake maximum use of your client’s local resources.
- 18. Client Side DataStores, Local StorageData Persistence
- 19. Local Data StorageLocal Storage available with the browsers are extremely helpful for preserving the dataHelps for securing data in case of network failure with server.Local storage can be effectively used side by side with your actual storage whileMaintaining the data effectively without any loss due to network problems.
- 20. GEO LOCATIONFind yourvisitors location:With GEOLOCATION you can detect your client browsers location.Pinpoint location are services near to your clients browser is detected easily.
- 21. Native Drag andDrop SupportDrag and Drop is no longer a task by special Libraries.Use the inbuilt API support to perform drag and Drop operations in your applications.document.addEventListener('dragstart', function(event) { event.dataTransfer.setData('text', 'Customized text'); event.dataTransfer.effectAllowed = 'copy';}, false);
- 22. Speech Recognition MadeEasy Use the browser’s in-built ability to identify speech patternsTake direct speech inputs from your client.Forget about the speech recognition and concentrate only on usability of the data.Leave the hard work to browser.Special Speech Control Under Dev...
- 23. Excellent Device Compatibility…SpecialSupport for Mobile phones and IPADS.Just develop one app and use the same for web and mob.
- 24. 3Multimedia and GraphicsThisis where it gets interesting!!!
- 25. CanvasThe canvas element is part of HTML5 andallows for dynamic, scriptable rendering of 2D shapes and bitmap images. It is a low level, procedural model that updates a bit map and does not have a built in scene graph.
- 26. It lets youdraw directly to your browser
- 27. Make wonderful effectswith ease
- 28. Manipulate your PICSany way you want
- 29. Your imagination isthe only limit
- 30. Fully compatible withDOMMake ‘em MoveBROWSER ANIMATION Create wonderful browser animations and games which is fully compatible with the Outlying DOM elementsSay no to FLASH. Lets Welcome HTML 5.
- 31. SCALABLE VECTOR GRAPHICSSVGin short is another great added advantage to HTML 5 arsenal.What is SVG?Scalable Vector Graphics (SVG) is a family of specifications of an XML-based file format for describing two-dimensional vector graphics, both static and dynamic (i.e. interactive or animated).-wiki No more Pixelation Scale with SVG
- 32. ?CSS 3The DeclarativeDevil… New added advantages in CSS 3 lets designers create cool stuff…
- 33.
- 34.
- 35.
- 36.
- 37.
- 38.
- 39.
- 40.
- 41. TransitionsCSS3 Special FeaturesTrendystyles with CSS 3You’re just gonna love it!The best changes ever made in cssIt is totally wicked!!!!!!!!
- 42. HTML 5 ADEVELOPER’S PERSPECTIVEAny Questions?Thank you.S.Santhosh Kumar9941497246, @santhotechsanthosh@systeminsights.com