Data URIs

By  on  

We're all familiar with traditional URI protocols like https, http, ftp, and file, but data URIs have become a large part of our online strategy. We can use them to display images, the Mac camera and webcams, and more. But what if we simply want to use a data URI to convey basic data?

Typing a data URI shouldn't be difficult, and it isn't. As someone that works on the Firefox DevTools Debugger, I'm often typing out data URIs to illustrate problems. The format is:

data:text/html,<body class="blah"></body>

We're all so ingrained to use protocol://subdomain.domain.tld addresses that data URIs look foreign...but they require the least amount of resources to express content!

Recent Features

  • By
    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...

  • By
    Write Better JavaScript with Promises

    You've probably heard the talk around the water cooler about how promises are the future. All of the cool kids are using them, but you don't see what makes them so special. Can't you just use a callback? What's the big deal? In this article, we'll...

Incredible Demos

Discussion

    Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!