HTML 4 has been around for nearly a decade now, and much have happened since HTML 4 landed. The way we use the Internet have taken dramatic turns and the I think the most significant turn is the trend of desktop applications and games going online running in browsers. Many people don’t use email clients any more and simply use online services as gmail or hotmail. The average Internet user today expect seamless embedded media, flexibility, responsiveness, ease of use (usability), off line capabilities etc. in ways we couldn’t imagine 5-10 years ago. Keeping up with users demans isn’t always as easy as it should be and this is where HTML 5 is expected to kick in with a helping hand.
HTML 5 introduces many new interesting elements for example canvas that makes it possible to do new exciting things from javascript, that make it much easier to structure pages and new elements that significantly improve the use of video and autio. We are all excited about the possibilities going to offered in HTML 5 and to get hand on with some of them but there’s a lot to learn and HTML 5 is still in draft status. This means only a few of the new elements have been implemented in latest browsers and you need to be careful how to approach this. Knowing that HTML 5 will eventually hit us keeping track with the new goodies coming up and how HTML 5 develops can’t be waste of time – and even fun. According to W3C News Archive, XHTML 2 working group is expected to stop work end of 2009 and W3C is planning to increase resources on HTML 5 instead.
In this article tripwire magazine provides you with the resources you need to get overview of what HTML 5 is, to get started and to understand how you can benefit from it at this early point in time.
Spec, Reference and Implementation
HTML 5 – Working Draft Standard
This specification defines the 5th major revision of the core language of the World Wide Web: the Hypertext Markup Language (HTML). In this version, new features are introduced to help Web application authors, new elements are introduced based on research into prevailing authoring practices, and special attention has been given to defining clear conformance criteria for user agents in an effort to improve interoperability. This specification is also being produced by the WHATWG. The two specifications are identical from the table of contents onwards.
Wikipedia: HTML 5
A basic overview of HTML 5 from Wikipedia. You will get the basics settled here and you will find links to relevant resources that you can follow to keep learning.
When can I use…
Compatibility tables for features in HTML5, CSS3, SVG and other upcoming web technologies. While it is unclear how safe it is to use tables like this it is a great way to check if an idea is feasible or not now or when it will be.
Comparison of layout engines (HTML 5)
The tables you find here compare support of HTML 5 differences from HTML 4 for a number of layout engines (IE, Firefox etc.).
Implementations in Web browsers
This is a list of known implementations of HTML 5 in web browsers. Better safe than sorry so check it out before using new HTML 5 elements.
HTML 5 Cheat Sheets
HTML 5 Cheat Sheet
A great quick guide to HTML 5 as a printable PDF from Smashing Magazine
Screen Casts
HTML 5: Features you want desperately but still can’t use
Google I/O 2009 – Google’s HTML 5 Work: What’s Next?
Article and Showcases showing how to use HTML 5
The Power of HTML 5 and CSS 3
Goodbye <div> soup, hello semantic markup? This is a great article digging into new opportunities with HTML 5 combined with CSS 3 – the future of web development really.
Chrome Experiments
This is the ultimate showcase of what we may expect from HTML 5. Google and the community really experiment with HTML 5 and create thing you would never expect to be possible with HTML and Javasctipt only. Check it out it is awesome! I tried some of them in Firefox 3.5.2 and they worked fine too.
A Preview of HTML 5
This article is a great introduction to the new elements in HTML 5.
Yes, You Can Use HTML 5 Today!
A great beginning overview of HTML 5
HTML 5 Demos
A great set of html 5 demos. Just view the source to see how they work.
HTML 5 Drag and Drop + Microformats = a whole world of possibilities
An example of how to use Drag-n-Drop in HTML 5
HTML 5 Gallery
See what’s possible with HTML 5
HTML 5 Forms Demo
A powerful demo of how forms work in HTML 5
Bespin
A Mozilla Labs experiment on how to build an extensible Web code editor using HTML 5 technology.
Headers in HTM 5
A good article from HTML 5 Doctor on the Header element. HTML 5 Doctor is a general resource on HTML 5.
How to get HTML5 working in IE and Firefox 2
Another great article from HTML 5 Doctor
Video elements
A useful article from HTML 5 Doctor on the Video element
Designing a blog with html5
A tutorial on how to build a blog in HTML 5
An opinion piece from A List Apart
Thinking About HTML 5 canvas Accessibility
Some quick thoughts on accessibility problems with the Canvas element
HTML 5: nav ambiguity resolved
A post by Zeldman on the HTML 5 Nav element
A Selection of Supported Features in HTML5
A great list from Molly about which HTML 5 features are supported by which browsers
The WHATWG Blog
The Web Hypertext Application Technology Working Group – the folks working on the HTML 5 spec
HTML 5 canvas
A great in-depth tutorial on how the HTML 5 Canvas element works
Native Drag and Drop
A demo of how the Drag-n-Drop functionality works.
Related posts
- Get started with Closure – Googles Awesome New Javascript Library I posted the news yesterday about Googles new open...
- 16 Stunning Mootools scripts for enhancing your html forms Forms are one of the most important part of...
- 35+ Essential Web Design Resources on Best Practice, Tips and Techniques I have previously created large lists of tutorials on...
- 50+ Stunning CSS3 Articles, Cheat Sheets and Tutorials Collections CSS3 is introducing loads of new and exciting functions...
- 75+ Top jQuery Plugins to improve Your HTML Forms jQuery makes it easier and simpler to provide your...
Submit
More Links
August 22nd, 2009 at 12:25 pm
Thank you. There are some superb HTML 5 resources there…
August 22nd, 2009 at 6:59 pm
Great post, thanks for compiling all these resources.
August 22nd, 2009 at 9:58 pm
This is really handy. Thanks a million… I’m sharing this. Cheers!
August 23rd, 2009 at 7:50 am
You can also look at “70 Must-Have CSS3 and HTML5 Tutorials and Resources”
http://www.webappers.com/2009/08/10/70-must-have-css3-and-html5-tutorials-and-resources/
August 26th, 2009 at 12:55 pm
Great article and thanks for sharing will be sure to share with others
September 17th, 2009 at 5:16 pm
Nice article for a beginner to start learning the HTML. I like this post.. great work dude
February 4th, 2010 at 5:54 am
great post! thanks!