HTML5 Training Course – HTM500

This 2-day HTML5  training course introduces students that are familiar with writing HTML to the new elements and attributes of HTML5 before moving into the web application scripting APIs.  The course begins by introducing where HTML5 came from and what it is.  It discusses how to use the new elements and attributes as well as how to detect if the browser supports them.  HTML5 training class from Firebox TrainingThe course then moves into new form input types and attributes before covering the audio/video tags.  A deeper look into the Canvas element follows, and then the Geolocation API, new local data storage options that could make cookies obsolete, and finally new communications APIs that will greatly enhance online web applications.

In this hand-on HTML5 training, the concepts presented are quickly reinforced by informal practice during the lecture and the followed up by graduated lab exercises.  This HTML5 programming fundamentals course is a practical hand-on introduction to a working HTML5 programming language, not just an academic overview of syntax and grammar.   After completing this HTML5 class, student will immediately be able to apply their new found knowledge of HTML5 to complete tasks in the real world.


All our HTML5 training courses are taught by live instructors, not a video.   This gives our clients the question and answer time they need to quickly master HTML5.   We deliver all our HTML5 training courses as live, instructor-led online, onsite or classroom style training experiences.    We deliver more online HTML5 training courses for individuals and small groups of four students, because we can run HTML5 training classes more often, with students from around the globe.   We will send our instructors to your location as well for an onsite HTML5 training course.

HTML5 Training Course Schedule

HTML5 Training Get a Group Quote

This 2-day HTML5 training course introduces students that are familiar with writing HTML to the new elements and attributes of HTML5 before moving into the web application scripting APIs.

<h5>Multi-Enrollment Discounts Available at Check-Out</h5>


Location Instructor-Led Online

Not on public schedule. Request a class date

Course ID:   HTM500  Duration: 2 days

Audience:  Ideal for students that have a fundamental understanding of HTML programming, but are ready to learn the new elements and attributes of HTML5.

HTML5 Training Class Outline

  • HTML5 History/Timeline
  • HTML5 Design Principles
  • What is (and isn’t) HTML5
  • HTML Review
  • Doctype
  • Root Element
  • Element
  • Syntax

HTML5 Elements

  • Content Models
  • New Structural Elements
  • HTML4/HTML5 Comparison
  • Other New Elements
  • Redefined Elements
  • Obsolete Elements
  • HTML5 Outlines
  • When Can I Use It?
  • Feature Detection: Techniques
  • Feature Detection: Examples
  • Feature Detection: Modernizr
  • CSS Styling
  • Validating
  • Accessibility (WAI-ARIA)


  • HTML5 Forms Overview
  • New Input Types: Contact Info
  • New Input Types: Native Date Picking
  • Opera’s Rendering of Date Input Types
  • New Input Types: Number and Range
  • New Attributes
  • Detecting Support
  • Accessibility (WAI-ARIA)
  • Styling Form Elements
  • Avoiding Validation
  • The Constraint Validation API
  • Custom Validation Example

HTML5 Media

  • Audio and Video Overview
  • Using the Media Elements
  • Attributes
  • Formats
  • Serving Device-Specific Files
  • Accessibility
  • Backwards Compatibility
  • Media API
  • Rolling Custom Controls


  • Canvas Overview
  • The Canvas Element
  • The 2D Context
  • The Coordinate System
  • Rectangles
  • Paths
  • Paths; Drawing Methods
  • Curves and Arcs
  • Colors and Styles
  • Gradients
  • Patterns
  • Transformations: Scale, Translate
  • Transformations: Rotate
  • Drawing States
  • Image Drawing
  • Animations
  • Responding to User Events: Keyboard
  • Responding to User Events: Mouse
  • Compositing
  • Text
  • Pixel Manipulations
  • toDataURL()
  • Accessibility
  • Canvas and Internet Explorer

  • Geolocation Overview
  • Privacy Concerns
  • API Methods
  • API Attributes
  • Using the Geolocation API: Success Handlers
  • Using the Geolocation API: Error Handlers
  • Using the Geolocation API: The Third Argument
  • watchPosition() and clearWatch()
  • Fallback Support: Geo.js

Local Data Storage

  • Local Data Storage Overview
  • Web Storage Overview
  • Web Storage API
  • Data Types
  • JSON (JavaScript Object Notation)
  • Accessing Storage
  • The Storage Event
  • Database APIs
  • Web SQL Databases
  • Web Databases: Opening the DB, Creating Tables, and Inserting Data
  • Web Databases: Selecting, Using, and Deleting Data
  • IndexedDB

Web Messaging

  • Cross Document Messaging
  • Using the postMessage API
  • Server-Sent Events Overview
  • EventSource API
  • Using the EventSource API: Client-side
  • Event Stream Format: Server-side
  • Simple Implementation
  • XMLHttpRequest Level 2
  • Cross-Origin Requests
  • Making a Cross-Origin Request
  • Progress Events
  • Using Progress Events

Web Workers

  • Web Workers Overview
  • What Can You Do with a Worker?
  • Message Passing
  • Handling Errors
  • Stopping Workers
  • Loading and Executing External Scripts
  • Workers within Workers
  • Subworkers: An Example
  • Security Notes
  • Shared Workers: The Parent Page
  • Shared Workers: Within the Worker

Appendix A – Microdata

  • What Is It?
  • Why Use It?
  • Data Model
  • Typed Items
  • Using Microdata

Appendix B – Offline

  • Offline Web Applications Overview
  • Adding and Service a Cache Manifest
  • Cache Manifest Sections
  • Updating the Cache
  • The ApplicationCache Object: Methods and Status Values
  • The ApplicationCache Object: Events
  • Programmatically Updating the Cache
  • Detecting Connectivity

Appendix C – Web Sockets

  • Web Sockets Overview
  • Using the WebSockets API
  • WebSockets on the Server
  • Fallback Solutions