Favorite HTML 5 Links

Wednesday, March 6, 2013

Here are a few links I've collected over the last couple years to help work with the new web standards.

Can I use... – this site is invaluable for seeing which browsers support specific features. Type a feature name (like Web Sockets) or a description (like rounded) into the search box and the site updates instantly. The tabular output shows usable features for a given browser version in green, and if vendor prefixes are required.  Usage stats display what percentage of users should be able to use a given feature based on the current global browser usage.

HTML 5 differences from HTML 4 – as specification documents go, this page on the W3C is easy to follow and quickly gets to the heart of the matter. The document presents all of the new elements, attributes, and APIs for HTML 5 (as well as pointing out the obsolete and deprecated pieces).

The HTML 5 Test – hit this site with a web browser to see the features it supports. Chrome 25 scores 463/500. IE 10 scores 320/500.

HTML 5 Boilerplate and Initializr – these sites are template generators to give you a starting point for an HTML 5 application. Includes best practices for elements in the <head> of a document, as well as icons for Apple devices and a basic CSS reset. Optionally include libraries like Bootstrap, jQuery, and Modernizr.

HTML 5 Rocks – a great site for articles, tutorials, and the latest HTML 5 news.

CSS-Tricks.com – code snippets, a gallery of design ideas, loads of demos, and my favorite, the shapes of CSS (because drawing a space invader using only CSS is profound).

The HTML 5 Quiz – A fun diversion for HTML fans. You can also use this game to start random conversations with people in a pub.


Comments
gravatar Euro Micelli Wednesday, March 6, 2013
Scott, You missed entering the URL for "HTML 5 differences from HTML 4". I presume you intended to point to this: http://www.w3.org/TR/html5-diff/ (Great list. I wasn't aware of a couple of these sites. Thanks!)
gravatar Danny Jones Wednesday, March 6, 2013
I would suggest http://joshduck.com/periodic-table.html for a nice view of the new HTML5 elements but it appears to be down where I am. Hopefully it's not for long.
Kevin Kalitowski Wednesday, March 6, 2013
Scott, Please adjust the link for "HTML 5 differences from HTML 4". Right now the link is to "http://html5%20differences%20from%20html4/"
gravatar Scott Allen Wednesday, March 6, 2013
@Euro, @Kevin - yes apologies. Updating.
gravatar Scott Allen Wednesday, March 6, 2013
@Danny - sounds interesting. Not working for me yet, either. :(
gravatar Dan Kahler Wednesday, March 6, 2013
Good stuff. Your fellow Pluralsight author Michael Palermo has a similar list at http://www.palermo4.com/page/HTML5.aspx. IE10's HTML5 Test score is killing me, but at least it's better the IE7/8 browsers that still make up a disappointingly large share of my site visitors.
gravatar Ricardo Trujillo Rodriguez Thursday, March 7, 2013
Great!. Thanks a lot for sharing this information. I had in my bookmarks most of them. I would like to suggest these ones: http://html5doctor.com/ http://html5test.com/ http://www.apple.com/html5/ http://html5gallery.com/category/web-app/ http://www.html5laboratory.com/ http://developers.facebook.com/html5/ http://html5center.sourceforge.net/ http://www.css3maker.com http://html5games.com/ Regards from Spain.
Comments are now closed.
by K. Scott Allen K.Scott Allen
My Pluralsight Courses
The Podcast!