★★★★⋆ 30 Reviews Add a review

Learn HTML5

8h 35m
March 2011

What you'll learn

  • How HTML5 is similar to, and differs from HTML 4 and XHTML 1
  • The various features of HTML5, which ones are ready for use now, and which are more experimental
  • New semantic and structural markup elements and attributes
  • Extending HTML5 accessibility and semantics using the ARIA role attribute
  • Native audio and video in HTML
  • Drawing with the canvas element
  • Dealing with shortcomings in browser support
  • Quality assurance techniques for HTML5
  • Beginner
  • Closed captions available

Join SitePoint Premium for instant access

Mastering a language like HTML5 can be intimidating. It doesn’t have to be!

Mastering a language like HTML5 can be intimidating. It doesn’t have to be!

Under the expert guidance of John Allsopp, you’ll find the combination of digestible audio, video and mini-articles with a supportive forum of classmates to be so much fun, you won’t even realize how much you’ve learned by the time you’re done.

Course seemed very complete. John Allsopp clearly knows his way around this stuff. The 4 live sessions are over 4 extra hours of talking about things and answering questions. Definitely a lot of material and study and some exercises as well. Material can get out of date quickly and there were a few points he cleared up later on, but I would recommend this course for not only beginner, but also intermediate web designers. It is well rounded.
Zack Wallace

Lesson 1: What Exactly is HTML5?
Free HTML5 Live Overview 7:46
Free Lesson 1 Outline 3:07
Free What Exactly is HTML5?
Free Can I Really Use HTML5 Right Now?
HTML5 Showcase 6:52
Join a Discussion: Introduce Yourself!
Lesson 2: Markup (Part I)
Lesson 2 Outline 1:49
The HTML5 doctype
Declaring Character Encodings in HTML5
Common Page Layout Patterns 6:25
Exercise 1 - Marking up a Blog
Plaintext to download and markup
Solution to Exercise 1 (Part I) 9:22
Solution to Exercise 1 (Part II) 9:56
Join a Discussion: Introduce Yourself!
Lesson 3: Markup (Part II)
Lesson 3 Outline 1:47
Sectioning in HTML5
Outline algorithms in HTML 4 and HTML5 (Part 1) 7:15
Outline algorithms in HTML 4 and HTML5 (Part 2) 7:10
Marking Up Dates and Times With HTML5
Marking Up Captions for Figures in HTML5
A short note on the two flavors of HTML5 - XHTML and HTML
Exercise - Completing the HTML5 Document from Lesson 2
Completed Exercise (Part I) 8:35
Completed Exercise (Part II) 9:48
Download my Worked Example
Lesson 4: ARIA
Lesson 4 Outline 2:39
Using the Role Attribute
Exercise 4.1 - Mark up a document using ARIA role attributes
Marking up the aforementioned document 9:45
Download my Finished Example
HTML 5 Form Elements
Exercise 4.2 - Creating Forms with HTML5
Download the Associated File
Answer to today's exercise 9:08
Download my Finished Example
Lesson 5: Recorded Webinar/Q&A Session
View Session A 1:15:24
View Session B 1:13:26
Lesson 6: Native Audio and Video
Lesson 6 Outline 1:32
The Video Element
The Audio Element
Complete an exercise: marking up an audio element
Download the ogg file
Download the mp3 file
Creating the Audio Element 6:13
Download my Finished Version
Backwards Compatibility
Complete an exercise: marking up a video element, with fallback content
Download the mp4 video file
Download the ogv video file
Download the swf video file
Creating the Video Element 9:38
Download my finished version of the video
Video and Audio Codecs
A Note on Accessibility
Lesson 7: Drawing With the Canvas Element
Lesson 7 Outline 1:32
canvas Console
Intro to canvas Console 3:28
Introducing the canvas element & Creating Fallback Content 9:16
The canvas coordinate system and sizing the canvas 5:41
Drawing with Canvas
Drawing with canvas, including filling, stroking and erasing rectangles 6:54
Drawing lines and other paths in canvas, including circles 7:37
Drawing text with canvas 4:22
Shadows and other Advanced canvas 7:53
Download the 'No Parking' sign
Download the 'Warning' sign
Lesson 8: Quality Assurance for HTML5
Lesson 8 Outline 1:39
Canvas Solutions (Part 1) - Solution to Lesson 7 Canvas Challenge 9:53
Canvas Solutions (Part 2) 8:27
Dealing with Browser Support (Part 1) 6:40
Dealing with Browser Support (Part 2) 5:06
Dealing with Browser Support (Part 3) 5:36
Dealing with Browser Support (Part 4) 5:54
Validating HTML5 7:44
Preparing for Lesson 9
Lesson 9: Bringing it all Together
Now it's your Turn
Download a page from a site
Download a zip file of all the page elements
Lesson 10: Recorded Webinar and Q&A Session
View Session A 1:08:58
View Session B 1:21:26
Lesson 11: Bonuses

John Allsopp

Successful software developer, long standing web development speaker, writer, evangelist and expert, John has spent the last 15 years working with and developing for the web.


Our algorithm thinks you'll like

Jump Start HTML5: Basics

Tiffany Brown

Learn the basics of HTML5 in a weekend!