Courses Archive Books

Get Free Access

HTML5 Media API

This is our second installment of training in the world of HTML5 Media. In this course we dig deeper into the Media API and complete the basics of Video, Audio and Media in HTML5.

Duration:

01:17:49

Created with

Ben Fhala

Ben Fhala is the creative force and founder behind 02geek, a pioneering platform dedicated to making web development accessible to everyone. With over 18 years of experience in the industry, Ben has a deep passion for teaching and a knack for breaking down complex concepts into easy-to-understand lessons.

HTML5 Media API Overview

What you'll learn

This is the third hour of our HTML5 Training. In this 3rd hour we continue to explore the Media API, while in our second course on the Video API we focused on the Video API in this one we continue and work within the Audio API and expand the skills we developed in the prevues course

By the end of this course you will know the ins and out of all media tags in HTML5, you will know how to create a buffer, create a custom on the fly player, understand the network states and the ready states of a media file and get a few tips on how to get your content to work the best on mobile devices.

The Audio Tag

Learn how to add audio into your HTML5 pages in this quick video tutorial.

Specifying the Audio Sources

There are two common supported audio formats in HTML5. In this video we will show you how to set them up and how to write the html code.

Creating the Audio object dynamically

Until now we created audio directly through our HTML5 new tags. In this video we will learn how to create the same audio object only this time totally dynamically via JavaScript.

Creating the Audio object dynamically : Round 2

In the last video we will created dynamically the audio object using the new HTML5 API for JavaScript while in this video we will show you an alternative way to do the same thing.

Jetting through the basic API controls

In this video we will be running through everything we learnt in the first course on Video in HTML5 only doing it really quickly as a recap.

Dealing with HTML5 Media Errors

What happens when a video can't load? When the server is down or when you try to load a video or sound track that the browser doesn't support. In this video we find out how to deal with this type of e

Understanding HTML5 media states with readyState

As a media files(such as a video or audio file) changes states it updates the readyState property. In this video we will explore the various states and through it understand how to create a buffer.

Working with the HTML5 network states

In the last video we explored the readyState in this one we will take a separate look at accessibility of data through the eye of the network. By the end of this video you will know how to deal with s

HTML5 Mobile Video and Audio Tips

AS the mobile world is leading the HTML5 revolution of the web its really important to note that a few small tricks can help you get your content up and running on all modern mobile devices.