

Ask HN: Any HTML5 dabblers? - mlLK

OK this site (http://mrdoob.com) has finally convinced me that I can have a pretty good time in HTML5. I've just now decided that now is a good time for me to start getting acquainted with what it (and JavaScript) can do.<p>Where did you start? I'm gonna assume here (http://dev.w3.org/html5/spec-author-view/, http://diveintohtml5.org/); suggestions, examples, blogs, resources, insights, blah, blah are appreciated as always.
======
techiferous
Reference

<http://www.w3schools.com/html5/default.asp>

<http://www.html5rocks.com/>

<http://simon.html5.org/dump/html5-canvas-cheat-sheet.html>

<http://diveintohtml5.org/peeks-pokes-and-pointers.html>

Tutorials

<http://diveintohtml5.org/>

<http://slides.html5rocks.com>

<http://www.html5rocks.com/tutorials/>

<https://developer.mozilla.org/en/Canvas_tutorial>

Demos

<http://html5demos.com/>

<http://studio.html5rocks.com/>

<http://lab.simurai.com/css/buttons/>

Sandboxes

<http://css3please.com/>

<http://playground.html5rocks.com/>

Tools

<http://www.modernizr.com/>

<http://www.contrast.ie/blog/speeding-up-with-modernizr/>

<http://css-tricks.com/examples/ButtonMaker/>

<http://labs.thecssninja.com/font_dragr/>

<http://www.fontsquirrel.com/fontface/generator>

[http://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-
brows...](http://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-
Polyfills)

Compatibility

<http://caniuse.com/>

<http://html5readiness.com/>

<http://www.quirksmode.org/compatibility.html>

Detecting HTML5 Support

<http://diveintohtml5.org/detect.html>

<http://www.modernizr.com/>

~~~
blaines
Great list! I laughed because many of those links are already marked as
visited.

I also like <http://jsfiddle.net/> as a sandbox.

------
tlrobinson
Learn the JavaScript language and browser/DOM programming first, then the
actual HTML5 stuff is a few simple additions. Dive Into HTML5 seems pretty
good.

* "JavaScript: The Good Parts" by Crockford

* "JavaScript: The Definitive Guide" by David Flanagan

* MDC's "A Re-introduction to JavaScript": [https://developer.mozilla.org/en/A_re-introduction_to_JavaSc...](https://developer.mozilla.org/en/A_re-introduction_to_JavaScript)

* Resig's "Learning Advanced JavaScript": <http://ejohn.org/apps/learn/>

* MDC: <https://developer.mozilla.org/en-US/>

* Crockford's website: <http://javascript.crockford.com/>

* YUI Theater (especially Crockford's JavaScript talks): <http://developer.yahoo.com/yui/theater/>

------
mikegreenberg
One of my first screen casts was an HTML5 primer
(<http://nobulb.com/2009/11/html-5-primer/>). I also found a really good
slideshow on what's new in HTML5 (<http://slides.html5rocks.com/>).

(Not certain that the quality of information in my screen cast is nearly on
par with the other info presented here, but it was a crowning achievement and
something I'm proud of. Let me know if this is bad form, I'll remove this
comment.)

------
babs474
Don't forget webGL. The best place is here <http://learningwebgl.com/blog/>

------
binx
Just start playing around, The last few weeks I have been browsing a load of
sites like <http://html5tutorial.net/> just mess around with bits and pieces
then consult Google and Stack Overflow if you get stuck. I recommend getting
stuck into some CSS3 first though, its surprising how much you can do in the
style sheet.

Also its worth checking <http://ie.microsoft.com/testdrive/> MS have some
interesting sandboxes you can play with there. Learn your way around.

------
joshuacc
I'd suggest checking out <http://html5doctor.com>

The authors do a pretty thorough job of reviewing the semantics of new (or
updated) HTML5 elements.

------
caryme
I helped develop <http://adbubbles.oneriot.com> as an IE9 Beta Launch demo,
with much inspiration from mrdoob. The site is now broken since OneRiot just
changed their business model away from real time search and shut off their
API. I worked a lot with canvas especially. diveintohtml5 was really helpful
as was the mozilla developer reference.

------
siedrix
To be fair, <http://mrdoob.com> has a lot of flash in the examples. You can
learn <http://processing.org/> and export to canvas if you want to do things
like the stuff on that page.

On the other hand, js rocks...

