envato free trialCreative Assets & Unlimited Downloads on Envato Elements Get 7 Days Free

10 Essential Guides, Resources and Tools for Getting Started with HTML5

on CSS & Web Design

HTML5 is an effective language for web developers and designers to use to structure and present content on the web. It’s increasingly used more and more, whether to make websites more functional and user-friendly, deliver video faster, or build desktop-level web apps.

No doubt you want to jump in and join the fun. But where to start, you might ask? Or you could be looking for some resources and tools while developing and designing with HTML5, perhaps? Well, today’s your lucky day. Here are 10 essential HTML5 getting started guides, resources and tools:

HTML5 Getting Started Guides

Getting Started with HTML5 Tutorial by Dave Woods

A simple tutorial for getting started with HTML5. It holds your hand through starting using HTML5 for your website and web app. It goes through adding the HTML5 doctype, the head and body sections, the header and nav elements, the article, section and hgroup elements, the aside element, and the footer element. Code snippets are included.

Getting Started with HTML5 Tutorial by Devlounge

Another tutorial for getting started with HTML5 – a simple and useful 3-part tutorial. It provides you with code snippets while holding your hand through through adding and using the HTML5 elements: doctype, script, style, header, nav, article, section, aside, and footer. Includes explanations for all of the elements.

Getting Started with HTML5 Video

A Think Vitamin tutorial that answers the question of why use HTML5 video—especially when Flash video is so prominent—and then gets into how to use HTML5 video on your website. It gives you code snippets for you to insert to make the job easier.

Fun with HTML5 Forms

A Think Vitamin tutorial that shows you how to build useful and sexy web forms step-by-step. It uses an email opt-in form as an example, illustrates every step, and gives you sample code. After showing how to create functional side, it then dives in and shows you how to make your forms pretty.

HTML5 Resources

Web Developer’s Guide to HTML5

The official W3C (World Wide Web Consortium – the fancy-sounding organization) guide to HTML5. More specifically, it shows how to write simple and practical HTML5 documents and web applications. It also offers in-depth information for the advanced folks out there who are into that kind of stuff.

Vocabulary and Associated APIs for HTML5

The official W3C HTML5 spec webpage. Definitely not for reading, but if you need anything and everything for looking up the particulars of HTML5, some aspect of it, how to use it, and so forth, this the really long better-use-that-web-browser-search-engine guide for you.

HTML5 on Wikipedia

Ol’ Wikipedia gathers up handy info for quick HTML5 reference, including what the new markup is, what the new APIs are, the differences between HTML5 and HTML 4 and XHTML, and information on error handling.

HTML5 Tools


Initializr is an HTML5 templates generator that helps you get started with your HTML5 project. It does that by generating a clean customizable template with just what you need to start. Initializr is based on the HTML5 Boilerplate template.


SproutCore is an HTML5 application framework which lets you simply create desktop-level applications for modern web browsers. Plus you don’t have to rely on any plugins when building your web applicaton using SproutCore.


Modernizr lets you target specific browser functionality in your stylesheet by adding classes to your element. What’s easy is you don’t need to actually write any Javascript code to use this.

Over to You

What other essential HTML5 getting started guides, resources and tools have you found useful? Share your favorite ones in the comments section below.