HTML5 Tutorials
HTML5 Video Player Best Practices
Let's all be honest: when it comes to media and the early days of the internet, we definitely did it all wrong. We started with embedded video players like RealPlayer and Windows Media Player which required custom codecs and browser plugins, then moved on to Flash and...
Mozilla, Web Virtual Reality, and A-Frame
I was fortunate enough to make Game Developer Conference this year and the big story was virtual reality. Hell, you couldn't go five feet without seeing someone pitching their VR hardware, software, or likewise technology. They were all proprietary solutions, including Oculus, Epic Games, and so on. You...
ping Attribute
One of the attributes I somehow missed with the HTML5 revolution was the
ping
attribute; Other attributes were more popular,download
being one of them. Hell, I just stumbled upon theping
attribute while reading an old forum post. Theping
attribute of ana
element represents a...JavaScript Promise API
While synchronous code is easier to follow and debug, async is generally better for performance and flexibility. Why "hold up the show" when you can trigger numerous requests at once and then handle them when each is ready? Promises are becoming a big part of the JavaScript world...
Don’t Wait for ServiceWorker: Adding Offline Support with One-Line
The HTML5 Application Cache should make building offline-friendly web apps possible. In practice, its unforgiving nature makes it very challenging to use at all, giving it a uniquely negative reputation among front-end developers. It's expected that apps continue to work offline—most users don't won't care about...
File Input accept Attribute
The HTML5 revolution provided us several simple but important attributes like
download
,autofocus
,required
,novalidate
, andplaceholder
. There's another one you may want to know about:accept
. Theaccept
attribute is useful forinput[type=file]
elements. Let's have a look at it! The HTML I'll...Get HTML5 Camera and Video on iPhone
One of the questions I get asked most often via my contact form is how to get access to the camera and video recorder on the iPhone from within the browser. It's a valid question, one that I've not come across in the needs of...
fetch API
One of the worst kept secrets about AJAX on the web is that the underlying API for it,
XMLHttpRequest
, wasn't really made for what we've been using it for. We've done well to create elegant APIs around XHR but we know we can do better. Our effort to...File API
Working with file uploads, especially on the front end, was always a hassle. We didn't use to be able to drag and drop files, complete AJAX uploads, provide multiple files, and hell, we couldn't get any information about the file until it hit the server; you'd...
Get and Set HTML5 Video Current Time
Last week I explored how you could get the duration of a HTML5 video. It's an important technique, obviously, but one that may be a bit more important is managing the video's time setting. Both setting and getting the video's time is important when creating a chrome...