Html 5 a step towards semantic web
1 like895 views
This document discusses HTML5 and the progress towards a semantic web. It provides an overview of new HTML5 features like headers, navbars, sections and articles to structure web pages semantically. It also covers other HTML5 technologies like web workers, web storage, CSS3 and forms. The document encourages developers to get involved with standards bodies to help advance the semantic web. It provides examples of using new HTML5 features and technologies like web storage, web workers and CSS3 properties.
Html 5 a step towards semantic web
- 1. HTML 5 - A step towards semantic webSachinKhoslaFounder, digimantra
- 2. What’s coming ?HTML – Show me what is it ?Latest in the WEBWeb WorkersWEB storage APICSS3Semantic WEBDEMOS
- 3. HTML5What ? When ? How ?W3C & WHATWGWeb Hypertext Application Technology Working Group Logo
- 4. HTML5 structured page<header><h1>Hello</h1></header> <nav><p>Menu</p></nav> <section> <p>Section</p> <article><p>article 1</p></article> <article><p>article 2</p></article> </section> <footer><p>The footer</p></footer>
- 5. Image credits – Sitepoint.com
- 6. What else ?FormsRequired fieldAutofocusDateSliderAudio & VideoCanvas (dynamic scriptable rendering of 2D bitmap images)Auto-complete using datalist
- 7. RIAAdobe FlashMicrosoft SilverlightApache Pivot Sun JavaFX
- 8. Get involved ?http://www.whatwg.org/news/startMailing listTwitter accountIRC
- 9. Web Workers – what is it ?
- 10. Spawning a workervarmyWorker = new Worker('my_worker.js');myWorker.onmessage = function(event) { //event has the data or the return values alert("Called back by the worker!\n");};
- 11. Web StorageWhy do we require this ?How do we do it ?CookieHidden form valuesQuery stringhttp://dev.w3.org/html5/webstorage/
- 12. Why not cookie ? Low size
- 13. Bad taste (multiple tabs)
- 14. Cross site scriptingWhat’s better then ?You know what’s better for you
- 15. The cakeIt isn't a cake – its Web StorageSession StorageLocal Storage
- 16. RecipeSession Storage RecipesessionStorage.setItem(key,value);Local Storage RecipelocalStorage.setItem(key,value);
- 17. What good is CSS3 Transparencyrgba(255, 0, 0, 0.2);Web Fonts@font-face { src: url("gargi.ttf"); font-family: "gargi"; }Text shadow text-shadow: 2px 2px2px #000;
- 19. THANKSWeb – http://digimantra.comTwitter - @realinFacebook – http://facebook.com/sachinkhosla