HTML5 Tutorial - Table of contents
- Introduction
Find out what you can expect to learn from this tutorial and how best to benefit from its lessons. - Part 1 - Lesson 1: What is HTML5?
Get to know HTML5 and learn about some of its cool features. - Lesson 2: Your HTML5 Bare Bones Template
Here, you build a minimal HTML5 template that will be the basis for your projects and start learning the new features right away. - Lesson 3: What about Older Browsers?
Learn how you can start using HTML5 today without dropping support for older browsers like Microsoft Internet Explorer (IE) prior to version 9. - Part 2 - Lesson 4: Meet Your Sample Web Document
You will start coding a sample web document based on the HTML5 template you built in lessons 2 and 3. It's a 1-page portfolio website that will give you the chance to use a great deal of the new semantic HTML5 elements. - Lesson 5: The Building Blocks of Your Sample Document
Armed with the goodness of HTML5 semantic elements, you will continue to section up your sample portfolio page. - Lesson 6: Diving Deeper into Your Document's Markup
In this lesson, you will complete your project of converting our mock design into semantic HTML5 code. - Lesson 7: Markup Validation and Document Outline
With your mock design almost converted into shiny HTML5 code, you will submit your markup to fantastic online tools to validate your code and preview the document structure. - Part 3 - Lesson 8: HTML Forms
HTML5 introduces attributes and features specific to forms that make coding forms definitely more interesting. Here we start with the new attributes available to form elements. - Lesson 9: New Input Elements
HTML5 offers 13 brand new input types for form elements in addition to the already existing ones. In this lesson you will find out more about them and how best to use them. - Lesson 10: Old Form Elements: Have They Changed?
A brief overview of further HTML5 changes in existing form controls wraps up the part of this tutorial dedicated to HTML forms. - Part 4 - Lesson 11: JavaScript and HTML5
In this part of our tutorial, we will explore the new JavaScript-related technologies that make HTML5 documents interactive and fun. - Lesson 12: Geolocation
This is the first JavaScript-driven technology that we'll have fun exploring. Although not part of the HTML5 specs, it's almost always associated with the lastest incarnation of the language of the web. With geolocation, your website visitors will be able to share their current location with the world. Read on to know how it's done. - Lesson 13: Web Storage
The web storage programming interface defines a standard on how we can save simple data locally on the user's computer. Let's find out a bit more about how it works by following this lesson. - Lesson 14: An HTML5 Video Player
HTML5 gives your markup native support for playing video and audio files in your document. With JavaScript you can also manipulate your HTML5 player. Follow this lesson to know more. - Lesson 15: Draw Shapes On Canvas
This lesson introduces you to one of the most popular features of the latest HTML5 group of technologies, the canvas element. Learn how to use JavaScript to draw shapes directly on the web page by following the simple steps outlined in this lesson. - Lesson 16: Draw Lines and Text On Canvas
Continuing on from the previous lesson, you will find out how to draw lines and write text images on an HTML5 canvas element. - Lesson 17: Load Images On Canvas
In this lesson, you will learn how to load an existing graphic inside the canvas and change its dimensions. - Lesson 18: Drag and Drop
HTML5 introduces native drag and drop functionality to your page elements. In this final lesson dedicated to HTML5 interactive capabilities, we are going to build a simple drag and drop application. - Lesson 19: The Final Tips
This is where we are going to recap some of our new additions to our developers' toolbox, and offer some good tips for your future HTML5-powered projects.