HTML5 Tutorials
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...
HTML5 Form novalidate
I've been very skeptical when it comes to HTML5 form validation. It's a nice addition, don't get me wrong, but let's be honest -- it's not very powerful and it could get in the way of the JavaScript validation you have in place. If you want HTML5 form validation to...
From Webcam to Animated GIF: the Secret Behind chat.meatspac.es!
My team mate Edna Piranha is not only an awesome hacker; she's also a fantastic philosopher! Communication and online interactions is a subject that has kept her mind busy for a long time, and it has also resulted in a bunch of interesting experimental projects...
The Difference Between Anchors, Inputs and Buttons
One of the things I love about CSS is how easy it is to make one element look like another. In the example above, the first element is an anchor, the second is a button and the third is an input. I've overridden the...
HTML5 Input Types Alternative
As you may know, HTML5 has introduced several new input types: number, date, color, range, etc. The question is: should you start using these controls or not? As much as I want to say "Yes", I think they are not yet ready for any real life...
8 HTML Elements You’re Not Using (and Should Be)
In today's web, the word semantic gets thrown around a lot. But what does semantic mean? Why is it important? Semantic HTML expresses the meaning of the document. It's less about how the text looks and more about what it is. Good semantic markup helps both people...
RTL and Punctuation
Working on a website that supports RTL (right-to-left) really opens your eyes to some problem in modern web development. Despite websites being read in RTL since, well, LTR, it's amazing that we don't have more widely supported
-start
and-end
properties and values in CSS. The side...Meatspaces Chat is Amazing
My Mozilla colleague Edna Piranha is crazy smart and creative. She's also just crazy, but that's beside the point. Her past projects include NoodleApp, the best App.Net client available, as well as numerous Mozilla projects. Her latest project is her best: Meatspaces chat. Meatspaces chat is...