O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Advanced HTML5

Video Description

In this Advanced HTML5 training course, expert author John Ulliman takes you deep into the advanced techniques and functions that HTML5 has to offer you. This course is designed for students that have already completed the Beginners Learning HTML5 tutorial, or have solid experience in the basics of HTML5.
You will begin by exploring some Javascript basics - writing to an HTML page, using variables and functions, interacting with HTML, looping and drag and drop functions. You will contiue by exploring how to utilize and create custom media controls. John covers some of the more popular CSS3 features such as colours and backgrounds, gradients, borders and text effects. The video tutorial continues on to cover HTML5 canvas functions, more CSS3 techniques, Geolocation, and finally, HTML5 for Mobile Apps.
By the completion of this Advanced computer based training course for HTML5, you will have a deeper understanding of how to take advantage of the many new features and functions that HTML5 has to offer. Working files are included to allow you to work alongside the author as you progress through the training.

Table of Contents

  1. Introduction
    1. Series Intro 00:02:19
  2. JavaScript Basics
    1. Intro To The JavaScript Language 00:06:57
    2. Writing To Your HTML Page 00:07:21
    3. Using Variables 00:06:47
    4. Types Of Data 00:04:00
    5. Using Functions 00:06:03
    6. Responding To Events 00:04:33
    7. Lab - Adding An Alert 00:04:22
  3. A Little More JavaScript
    1. Interacting With HTML 00:09:53
    2. Conditional Statements 00:09:02
    3. Loop Structures 00:08:09
    4. Drag And Drop 00:10:59
    5. External JavaScript Files 00:12:54
    6. Lab - Add A Puzzle 00:14:01
  4. Custom Media Controls
    1. HTML5 Media Basics 00:06:46
    2. Customizing The Controls 00:04:50
    3. Tracking Playback 00:11:54
    4. Moving The Playback Position 00:04:57
    5. Volume Controls 00:08:53
    6. Lab - Adding Play/Pause 00:08:52
  5. CSS3
    1. Intro To CSS3 00:11:11
    2. Using Prefixes For Specific Browsers 00:08:43
    3. CSS3 Colours And Backgrounds 00:07:07
    4. CSS3 Gradients 00:08:54
    5. CSS3 Borders 00:06:05
    6. CSS3 Image Borders 00:04:44
    7. Text Effects 00:06:02
    8. Adding Your Own Web Fonts 00:05:08
    9. Lab - Adding New CSS3 Styles 00:08:12
  6. HTML5 Canvas
    1. HTML5 Canvas Graphics 00:09:51
    2. Fills And Strokes 00:07:39
    3. Creating Paths 00:09:11
    4. Rounded Corners 00:06:16
    5. Arcs And Circles 00:07:19
    6. Drawing Curves 00:08:08
    7. Gradients Fills 00:10:11
    8. Pattern Fills And Shadows 00:04:57
    9. Canvas Text 00:08:33
    10. Lab - Adding Canvas Graphics - Part 1 00:09:24
    11. Lab - Adding Canvas Graphics - Part 2 00:04:33
  7. Transforms And Animation
    1. CSS3 Transforms 00:08:00
    2. CSS3 Transitions 00:08:01
    3. CSS3 Animation 00:10:03
    4. Canvas Transforms 00:05:54
    5. Canvas Animations 00:09:47
    6. Lab - Create Photo Frames For Images 00:07:36
  8. Geolocation
    1. Geolocation Intro 00:06:14
    2. Displaying Location 00:06:30
    3. Error Handling 00:04:05
    4. Lab - Adding Geolocation 00:08:35
  9. Mobile Apps
    1. Mobile App Web Storage 00:05:37
    2. Web Storage With Numbers 00:08:50
    3. Media Queries 00:07:37
    4. JavaScript Arrays 00:10:13
    5. Lab - Add Places 00:10:44
    6. Lab - Show Places 00:11:52