Tiffany B. Brown

Posts tagged: html5

Subtitles and captions with WebVTT
One drawback of HTML5 multimedia is accessibility. For hearing impaired users, audio and video content is nearly-useless without an alternative. This is where the track element and WebVTT come in handy. What WebVTT looks like when combined with @font-face. WebVTT, short for Web Video Text Tracks, can be used to provide timed subtitles and/or captions […] [14 Dec 2013]
Date input in HTML5: Restricting dates, and a thought for working around limitations
You probably know that HTML5 introduced a date input type, which constrains the value to a valid date string. <input type=”date”> largely eliminates the need for JavaScript-based date pickers such as the one found in jQuery UI. In browsers that support the type, we can pick a date using the browser’s native widget. Below is […] [24 Oct 2013]
Use IDL attributes to test <input type=""> support
HTML5 input control types still have a ways to go before every type is supported in every browser. In the meantime, you may still find that you need to feature-test whether a particular type is supported. Do this by checking the value of the type IDL attribute. IDL attributes are defined by the HTML5 specification […] [23 Oct 2013]
SitePoint HTML5 Experts chat transcript
Being called an expert still makes me O.o. Frankly, I don’t think I’ll ever be comfortable with the label, even though I’ve been doing this for awhile, and kind of know what I’m doing. That said, when SitePoint invited me to do an HTML5 experts chat last week, I said “Hey, why not?” and agreed. […] [9 Sep 2013]
Meet the datalist element
UPDATE: Browsers vary a bit in how they render datalists based on the type of form input. Eiji Kitamura has a demo that illustrates how they all work. One of my favorite parts of HTML5 forms is the datalist element. Opera added support in version 9.0. Support in Firefox and Internet Explorer followed. Today, datalist […] [8 Nov 2012]
input type="range" and Android’s stock browser.
Android’s stock browser supports the range input type, but in versions 3.x4.x and below (not sure about Android 4.x), it doesn’t actually display the UI. It does, however, support parts of the Shadow DOM. That means we can style this element, and give our users a visible control. The image below shows a rather garish […] [7 Feb 2012]
input type="url", validation and user interfaces
Recently a friend messaged me about the url input type, and how to prevent Opera from automatically prepending http:// to the value of a URL input field if it is missing. I think I’ve found a workaround, but first, I want to discuss the url input type, and how different browsers handle it. HTML5 introduces […] [3 Jan 2012]
What is HTML5?
My super-short post that attempts to answer this question as completely and accurately as possible in three presentation-friendly bullet points. HTML5 … re-imagines HTML as an API with objects, events, interfaces, and methods or a collection of interfaces. defines an algorithm for generating a consistent, cross-browser friendly DOM tree, regardless of the quality of the […] [26 Oct 2011]
Looping video in browsers that don’t yet support the loop attribute
To date, Firefox does not yet support the loop attribute of the <video> element. This snippet is a simple work-around. Once the video’s ended event is fired, it calls the play method. For more, consult the media events section of the HTML5 specification. [4 Oct 2011]
Quick PHP Tip: Uploading multiple files in HTML5
One of the neat things about HTML5 is that it allows for multiple file uploads in one file upload field. Of course, you have to have a browser that supports such a feature. Currently Opera 11.10 does. So do Firefox 4, the latest version of Chrome, and Safari 5.0.4. (Internet Explorer 9 does not.) Now […] [29 Mar 2011]