09. html5 & css3 furture of web
Download as PPT, PDF2 likes504 views
The document discusses HTML5 and CSS3, the future of web technologies. It provides an overview of what HTML5 and CSS3 are, who develops them, how developers and designers can start using them, and why they should transition to these new standards now despite still being works in progress. The document aims to introduce readers to HTML5 and CSS3 and encourage them to begin experimenting with and applying these new technologies in their own projects.
09. html5 & css3 furture of web
- 1. HTML5 & CSS3 The Future of Web Technologies by Dang Minh Tuan
- 2. HTML5 & CSS3 The TODAY of Web Technologies by Dang Minh Tuan
- 3. About me Fullname: Đặng Minh Tuấn http://www.facebook.com/dangminhtuan Nickname: ohisee http://twitter.com/ohisee Website: hoctudau.com Topics in Hà Nội PHP Day 2008: HTML & CSS Best Practices http://www.hoctudau.com/slides/html-css-best-practices 2009: HTML & CSS Trends http://www.hoctudau.com/slides/html-css-trends
- 4. What? When? Why? Who? How?
- 5. What?
- 6. What is HTML5 & CSS3?
- 7. HTML5 is (just a version of) HTML CSS3 is (just a version of) CSS
- 8. HTML5 is (just a version of) HTML CSS3 is (just a version of) CSS
- 9. HTML5 is (just a version of) HTML CSS3 is (just a version of) CSS
- 10. HTML5 is (just a version of) HTML CSS3 is (just a version of) CSS
- 11. New Version - remove some, add many HTML4 <div id="header"> <input type="text"> HTML5 <header> <input type="email"> CSS2 border CSS3 border-radius HTML5 references http://www.w3schools.com/html5/html5_reference.asp CSS3 references http://www.veign.com/downloads/guides/qrg0008.pdf
- 12. Who?
- 13. Who relates to HTML5 & CSS3? Who develops them? Who supports them? Who uses them? Who talks about them?
- 16. HTML5 Specifications WHATWG http://www.whatwg.org/specs/web-apps/current-work/ W3C http://dev.w3.org/html5/spec/Overview.html IETF (WebSocket specification) http://tools.ietf.org/html/draft-hixie-thewebsocketprotocol CSS 3 Specifications W3C http://www.w3.org/Style/CSS/current-work Who develops them?
- 17. Who supports them? http://www.findmebyip.com/litmus/#target-selector
- 18. Who uses them? Apple
- 19. Who talks about them? HTML5 ~ 80 links sitepoint: 4 smashingmagazine: 4 tutsplus: 3 html5rocks: 2 sixrevisions: 2 VN: 4 other: 65 CSS3 ~ 70 links smashingmagazine: 4 tutsplus: 3 marcofolio.net: 2 impressivewebs: 2 mikeplate: 2 css-tricks: 2 dev.opera: 2 VN: 1 other: 44 My personal bookmarks about HTML5 & CSS3
- 20. Who talks about them? HTML5 Link Collection http://www.youtube.com/user/hoctudau#p/u/12/hoiI8Dy1Lnw CSS3 Link Collection http://www.youtube.com/user/hoctudau#p/u/11/dLTmQG_kwJ4 My personal bookmarks about HTML5 & CSS3
- 21. Who talks about them? Ebooks most of them published in 2010
- 22. Who talks about them? Slides: http://www.slideshare.net/search/slideshow?q= HTML5 http://www.slideshare.net/search/slideshow?q= CSS3
- 23. How?
- 24. HOW TO? How HTML5 & CSS3 can do? How can you learn HTML5, CSS3?
- 25. Live Demo http://slides.html5rocks.com/ http://www.youtube.com/user/hoctudau#p/u/6/1sD4mf5JDS4 http://www.youtube.com/user/hoctudau#p/u/8/GGX5SfYSNHw
- 26. HTML5 for some Devices Do you have an iPhone?
- 27. How to learn HTML5, CSS3? Step 1: Learn some basic HTML, CSS. Step 2: Learn how to use HTML4, CSS2 in your daily works. Step 3: Learn how to apply HTML, CSS best practices . Step 4: " Playing make fun" with HTML5, CSS3 Step 5: " Practices make perfect" with HTML5, CSS3
- 28. When? Why?
- 29. Why & When? Why We Should Start Using CSS3 and HTML5 Today ?
- 30. Conceding to the idea that the project will not be able to look the same across various browsers, This means more developed and unfettered imaginative designs for our clients, This could lead to increased costs for clients as well, but with higher levels of innovation and Client’s visions for what they want will be less hindered by these limitations. For Our Clients
- 31. Potentially less disruptions of experience from one device to another and An overall improved user experience. For the Users
- 32. Conceding to the idea that the project will not be able to look the same across various browsers, A more open playing field for designers and developers all around; less restricted by this holding pattern, More exciting and innovative landscape to attract new clientele, Division of project audience into separate presentational approaches and Probably less work involved because we don’t need the many hacks and workarounds we’ve used before. For Designers/Developers
- 33. So What Are We Waiting For? Fear Factor Comfortable Factor Doubt Factor Faith Factor “ It’s Too Early” Factor Validation Factor
- 34. Who hires HTML5, CSS3 Ninja?
- 35. HTML5 vs Flash http://flashsucks.org/ http://html5vsflash.tumblr.com/ Note: HTML5 doesn't do anything. It's a spec ; one that isn't finished yet . Sure, many of its proposed features will allow developers to produce similar features as Flash, but it's up to the browser developers to implement said specification.
- 36. Start your own HTML5, CSS3 Project! Now!!! Q&A http://hoctudau.com/slides/reg Topics in Hà Nội PHP Day 2008: HTML & CSS Best Practices http://www.hoctudau.com/slides/html-css-best-practices 2009: HTML & CSS Trends http://www.hoctudau.com/slides/html-css-trends 2010: HTML5 & CSS3 The Future of Web Technologies http://www.hoctudau.com/slides/html5-css3