With the release of the iPad, HTML5 technology has recently come into the spotlight. The format that will likely kill Adobe’s Flash is a lot of fun to use, but we’ve not seen much of it yet.
The good news is that you don’t have to wait until the iPad is in your hands to see what HTML5 can do. If you have a compatible browser, there are already a wealth of sites that show off the capabilities.
First, make sure that you have a browser that is capable of rendering HTML5 content. At the moment, Google’s Chrome is king in this department. So for the sake of argument, grab a copy and get to clicking.
1 – HTML5 Demos
To get a really good idea of how HTML5 is changing the landscape, you have to know what it’s capable of doing. HTML5 Demos offers a great look and has lots of toys to play with as well.
2 – Canvas Paint
It’s MS Paint! Fully functional and in a browser! If HTML5 did nothing else, I’d love it just for this.
3 – HTML5 Gallery
This is a great collection of sites that are currently coded in HTML5. Not a lot of toys to play with here, but rather just a solid collection of sites, categorized by type.
4 – HTML5 Tutorial
Showing some love to our programmer friends, I have to include this site. It’s well-written, and breaks down HTMl5 into digestible chunks. Though the site itself doesn’t include much interactive content, it does link to many that do.
5 – YouTube!
Yes, YouTube. Did you know that YouTube offers an HTML5 beta program? Neither did I, until tonight. Now you will have to opt in, and have a compatable browser. Also, not all videos are in HTML5, but that is all discussed on the site. It is great, however, to see that some content has already been transcoded.
What are you waiting for? Go play! There’s a world of new stuff right around the corner, and I for one am incredibly excited to see what the developers push to next. Make sure to comment, and let us know about any other HTMl5 sites that you’ve found and think are fun.



















So sweet code!
Great examples, but I still think HTML5 is not practical for everyday use:
- the tools are not as mature compared to flash
- developing complex animations in HTML5 is beyond the competence of many web developers, compare the established flash community.
- canvas doesn't have the inbuilt levels of abstraction as Flash, which means its much more labour intensive for complex work.
- if you take the trouble to develop an animation/game in HTML5 it won't work on IE browsers, and this will remain the case until the current version has only a negligible audience. So to make something that the whole internet can use, thanks to Apple, the same game/animation would have to be done in HTML5 AND flash.
Developing complex animation using HTML5 has been described as building a house out of popsicle sticks – possible but not desirable. http://bit.ly/c6CFb6
A more practical system, assuming they have got it right, would be to create the project in flash and then export it as an App, using flash cs5. Might even make a bit of money on it, for those on iPad/iPhone, if you charge for the app.
Dont forget HTML5 Laboratory! http://www.html5laboratory.com!
:-)
afasdfadsfadsfadsfadfasdddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
Thanks for the good read. I extremely enjoyed it! I don’t usually comment on blogs but this one really was interesting. I will bookmark for later.
Beautiful
MMB,
You make a valid point, but note its still early wrt canvas and html5 tools. We are at the start of a multi-year movement with html5. Adobe’s designer tools now output html5-friendly code in addition to flash. html5 is the direction for Google, Opera, Mozilla, Microsoft, HP/Palm, etc. Its not just Apple.
There are many developers working on html5 UX and graphics frameworks as we speak. Look at ChromeExperiments.com to see some early html5 graphics examples.
Btw, flash is disabled for many browsers at large corporations. Also there are serious issues with the Adobe network stack when it comes to firewalls and proxies. Would you trust a multimedia company with carrier grade network software?
[full disclosure. I work for a html5-centric company]
Perfect page. Thank you.
Are you kidding me? can HTML 5 create this: http://www.2advanced.com – Not a chance. You are basically saying you are content going back to using paint, horrible graphics and mediocre animation – which every single one of those examples display. It’s as if they just discovered animation.
Take creative thinking and any possible concept which can be brought to life easily with Flash and resort to antique capabilities and BS coding? Missing the boat again with how far back HTML5 really is! and for what? Better question – for Who? Apple. Unbelievably a joke.
I can make any thing fly, drag, rotate, expand, fade and compute – on any type of canvas I can dream up – that can be displayed on ANY browser with Flash. Oh sorry – accept for your nifty touch-screen Apple devices because you think they are cute.
What developers really need is someone who is educated and understands that everything is already possible with Flash. Why the heck would I want my website to look like some antique animated garbage from 5-8 years ago.
This isn’t cool man, these are crap animations and crap display.
And then some moron will respond that flash is a video player again.
Don’t drink the Apple-flavored punch!
Cool? You have got to be joking me.
Sincerely,
A Fact.
i got mcq type question with option and their explanation which i would like to use in ipad. Can you pls send me a sample coding.
Hey!
Sweet blog. I’ve been wanting to find a good tutorial to HTML5, and I think this one does the trick for me. Do you have any other tutorials like that one? I soooo want to get good at HTML5, but it’s really different to HTML4.
Great blog!
I want a snazzy and smooth flash like animation on my site, but n html5. What’s my best bet, flash export to html5 or some other html5 animation editor?
Thanks
Note that you can still get the real classic paint working on Win7. They failed miserably to bring the features we love most about classic to the new version, so I use it all the time!
Great Post!
You can also check http://www.html5arena.com/
a creative way to share html5 based webiste.
Thanks, cool info.
Have you tried Hippo Animator?
http://www.hippostudios.co.uk
HTML5 that works in IE 6 and iPhone.
bes dofa
http://html5based.com a gallery for HTML5 websites and offer do-follow links, submit your website and spread the word.