HTML5 cheat sheets and tutorials are useful guides if you want to know more about HTML5, and learn how it work. For this purpose, you can also check out some of the awesome HTML5 infographics available online.
HTML5 is still far from being a finished standard, but most will agree that it is here to stay, and that it will play an important role in web design going forward. Responsive web design templates are already being used to build mobile friendly websites in huge numbers. You can choose from a large variety of free and premium themes build with latest HTML5 technology.
In this article, we are sharing a collection of HTML5 cheat sheets and tutorials. Check them out, and please let us know what you think! Please write a comment and remember to share this article with your friends and co-workers.
The web is constantly evolving and HTML5 is not a new phenomenon any more. I think that few will argue that HTML5 is must know for a web designer, even though it is still a work in process. This resource gives you insight into HTML5.
Here you will find three cheat sheets with information about useful HTML5 tags, attributes and browser support.
HTML5test.com is an online app that allow you to test how well your browser supports new HTML5 features.
The HTML cheat sheet is a one-page A4 printable document, designed to provide a quick reference for HTML. A description of what is on the cheat sheet follows, or if you are impatient, you can go straight to the full size HTML cheat sheet.
This website has a collection of examples showing what HTML5 can do. You can filter the demo examples using tags.
Here you will get a detailed HTML5 browser compatibility overview.
Here you will find some very useful compatibility tables for features in HTML5, CSS3, SVG and other web technologies.
This is a graphical overview of the browser readiness for HTML5 and CSS3 features.
This is a site devoted to collecting HTML5 web site examples. Web designers can submit their site and tag it. It’s a good place to look for inspiration.
This is a cool HTML5 presentation build using HTML5. The website is very informative and gives you a easy to use overview HTML5 elements.
Handy printable HTML 5 Cheat Sheet that lists all currently supported tags, their descriptions, their attributes and their support in HTML 4.
A great quick reference for the transition from HTML 4 to HTML 5.
This tutorial show you how to build a blog step by step using HTML5.
In this tutorial you will be making a beautiful HTML5 portfolio powered by jQuery and the Quicksand plugin. You can use it to showcase your latest work and it is fully customizable, so potentially you could expand it to do much more.
This tutorial will teach you how to code the HTML and CSS involved when building a website. They also have a tutorial on how to design a clean homepage prototype using Adobe Fireworks.
In this tutorial you will create a fullscreen photo slideshow to illustrate a New York picture series. You will be able to add sounds with the HTML5 audio element in order to give life to the gallery and try to recreate the ambient of this vibrant city.
Not only one of the best technical specs available online for html5, but also a good html5 example in itself. It is responsive and makes use of HTML5 in various ways.
A comprehensive article from the technical library of IBM by IT Architect Dietmar Krueger. In this article, the author describes and explains how challenging it is to write application for operating systems and mobile platforms. Instead of relying on learning the platform specific languages like Objective-C with Cocoa (on iPhone), the author takes the open way of developing things through HTML5. A very clearly explained and in-depth article.
This tutorial show you how to build a news website in HTML5 and CSS3. Every line of code is explained for both HTML and CSS.
This tutorial show you how to create an offline HTML5 iPhone application. More specifically, it will walk you through the process of building a Tetris game.
In this tutorial we’ll get a taste of what’s to come by building a cool iPhone app website using a HTML5 structure, and visual styling with some CSS3 effects.
This website is a guide to HTML5 telling what it is and showing the new features, tags and so on.
In this article you can take a look at how to style a beautiful HTML5 form using some advanced CSS and latest CSS3 techniques. You will want to style your own forms after you’ve read this article.
This tutorial will go through the process of converting the design concept from PSD document right through to completed HTML and CSS mockup, complete with clean and valid code, a few touches of CSS3 and some quick fixes to help out old IE6.
Learn five macro-steps to build an effective website using brain, pencil, paper, Photoshop, HTML and CSS. But technology doesn’t stop, luckily, and we have other two great allies for the future to design better website: HTML 5 and CSS3.
There are some good HTML5 examples here.
See how to create a HTML5 web template, using some of the new features brought by CSS3 and jQuery, with the scrollTo plug-in.
Christopher Schmitt, author of CSS Cookbook and co-founder of Environments for Humans, explains how to use the HTML5 GeoLocation jQuery Plugin
Learn how to make a basic HTML5 game with this tutorial.
Learn how to make an HTML5 form types in this tutorial.
This is a run through of the basics of HTML5 and CSS3 while still paying attention to older browsers.
In this tutorial, you are going to learn how to build a blog page using next-generation techniques from HTML 5 and CSS 3. The tutorial aims to demonstrate how we will be building websites when the specifications are finalized and the browser vendors have implemented them. If you already know HTML and CSS, it should be easy to follow along.
Rob Hawkes explains how to use the canvas element, draw basic shapes and text, change the colour, erase the canvas and how to make it fill the browser window.
This tutorial will teach you how to create hyperlinks in HTML5 as well as anchor text.
In this tutorial, you are going to build a one-page template using some of the next-generation techniques from HTML5.
With the HTML5 specification, you can now create a new base template, why rewrite all this code every time you need to create new HTML documents? Included here are the elements that will get you up and running with an HTML5 base template.
This tutorial will teach the process of designing and creating the codes for a basic blog with HTML5 and CSS3.