HTML 5, CSS3 and ASP.NET Best Practices by Example
3 likes5,717 views
HTML5 is not a single feature, but a collection of individual features such as canvas, video, and geolocation. While older browsers may not support HTML5, you can detect support for specific features through JavaScript APIs and the Document Object Model (DOM). Modernizr is an open source JavaScript library that detects support for HTML5 and CSS3 features to help provide alternative functionality where needed.
More Related Content
What's hot (20)
Similar to HTML 5, CSS3 and ASP.NET Best Practices by Example (20)
Recently uploaded (20)
HTML 5, CSS3 and ASP.NET Best Practices by Example
- 1. 1 1
- 2. 2
- 3. 3
- 4. 4
- 5. 5
- 6. 6
- 7. 7
- 8. “How can I start using HTML5 if older browsers don’t support it?” But the question itself is misleading. HTML5 is not one big thing; it is a collection of individual features. 8
- 9. you can’t detect “HTML5 support,” because that doesn’t make any sense. But you can detect support for individual features, like canvas, video, or geolocation. 9
- 10. You may think of HTML as tags and angle brackets. That’s an important part of it, but it’s not the whole story. The HTML5 specification also defines how those angle brackets interact with JavaScript, through the Document Object Model (DOM). HTML5 doesn’t just define a <video> tag; there is also a corresponding DOM API for video objects in the DOM. You can use this API to detect support for different video formats, play a video, pause, mute audio, track how much of the video has been downloaded, and everything else you need to build a rich user experience around the <video> tag itself. 10
- 11. Unlike previous versions of HTML and XHTML, which are defined in terms of their syntax, HTML 5 is being defined in terms of the Document Object Model (DOM)—the tree representation used internally by browsers to represent the document. Every XML and HTML document in an HTML UA is represented by a Document object. The advantage of defining HTML 5 in terms of the DOM is that the language itself can be defined independently of the syntax. There are primarily two syntaxes that can be used to represent HTML documents: the HTML serialisation (known as HTML 5) and the XML serialisation (known as XHTML 5). 11
- 12. 12
- 13. 13
- 14. 14
- 15. 15
- 16. 16
- 17. 17
- 18. Map of HTML 5 18
- 19. 19
- 20. 20
- 21. <section> A section, or section of a chapter of text, or a book. <header> The page header. This is not the same as the <head> element. <footer> The footer of the page. Typically where all the legal crapola goes. <nav> Navigation links to other pages. You could put your websites navigation in this for example. <article> A blog article could be encapsulated by this for example. <aside>The aside tag can be used to provide extra information for a block of text. Much like sidebar material in books etc <figure>The <figure> element can be used to annotate your main text with diagrams, which aren’t necessarily imperative to the text. 21
- 22. 22
- 23. 23
- 24. 24
- 25. 25
- 26. 26
- 27. 27
- 28. 28
- 29. 29
- 31. Modernizr is an open source, MIT-licensed JavaScript library that detects support for many HTML5 and CSS3 features. At the time of writing, the latest version is 1.1. You should always use the latest version. To do so, include the following <script> element at the top of your page: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Dive into HTML5</title> <script src="modernizr.min.js"></script> </head> <body> ... </body> </html> 31
- 32. 32
- 33. 33
- 34. 34
- 35. 35
- 36. 36
- 37. 37
- 38. 38
- 39. 39