After The Great Vendor Prefix Hullaballoo of April 2012 comes The Great Responsive Images Brouhaha of May 2012. We look at the main competing formats for adding adaptive images to HTML – the <picture> element, and the <img srcset=""> attribute.
HTML5 adaptive images: end of round one
HTML5 Audio — The State of Play
Guest doctor Mark Boas returns with a follow up to his 2009 article Native Audio in the Browser, which covers the basics of HTML5 audio. Read the original if you want to get a feel for the <audio> element and associated API. If not, get comfortable and dive deep to learn about the current state of play for HTML5 audio.
Let’s Talk about Semantics
It’s time we had “the talk”. I could get you a book or recommend some sites from Dr Mike’s special bookmarks folder, but the best way to make sure you get the right idea is to do it myself. I’m talking about HTML semantics. Understanding the thinking behind the naming of elements will help your markup shine.
The ol Element and Related Attributes: type, start, value, and reversed
The <ol> element has a new attribute reversed in HTML5. In addition, a couple of related attributes purged in HTML 4 have made a return, namely start and type for <ol>, and value for <li>. Making things more interesting, the returning attributes were removed from HTML 4 for being presentational. So why are they back? Let’s investigate…
It’s Curtains for Marital Strife Thanks to getUserMedia
HTML5 (or now, the WebRTC spec) gives us getUserMedia, a way for JavaScript to access streams from a device’s camera and microphone. Find out how to use it and normalise the syntax differences between Opera and Chrome with the gUMshield.
The output element
Across the web, you’ll see a range of sites that feature calculators for working out things like loan repayments, mortgage rates, tax, insurance, and more. Until now, we’ve had no way of semantically marking up the result of those calculations. Enter: the <output> element! In this article, we’ll show you <output> and some related JavaScript tricks. Let’s get cracking.
Video Subtitling and WebVTT
We’ve been able to play video in the browser without a plugin for a couple of years now, and whilst there are still some codec annoyances, things appear to have settled down on the video front. The next step is adding resources to the video to make it more accessible and provide more options to the viewer.
Goodbye time, datetime, and pubdate. Hello data and value.
While HTML5 is stable and being implemented we’re still not past losing (or gaining) an element, as demonstrated by the removal of <time> and the addition of <data>. Rather than jumping into the ensuing brouhaha, we’ve spent some time figuring out what this really means. In short? Well… it’s complicated.
The return of the u element
The <u> element was deprecated in HTML 4 and non-conforming in HTML5, but a couple of use cases have seen it return from the dead. Are the use cases enough to persuade you that it’s a phoenix not a zombie?
The details and summary elements
How often have you had to write some JavaScript to create an interactive widget that shows and hides some content? You might’ve even downloaded a whole JavaScript library to achieve such an effect. Well, it’s time to rejoice! HTML5 provides a way to create this toggle feature with just a few lines of HTML and no JavaScript in sight. And so we introduce to you the details element.
