The HTML5

Showdown (also known as PageDown) is a JavaScript parser for Markdown-formatted text. It’s used on this site to generate a formatted preview of your comment as you type it. Showdown is library-agnostic, but fortunately, using it with jQuery isn’t much of a problem.

One of the lesser known HTML5 JavaScript goodies is the document.head DOM tree accessor, which is a more efficient (and easier to type) alternative to document.getElementsByTagName('head')[0]. Native support for document.head is very easy to detect…

I was asked to give an introductory talk on HTML5 for the latest Adobe User Group Belgium Web SIG Event. The presentation I ended up with is entitled “HTML5: It goes to ELEVEN” and can be viewed on Slideshare. In this article, I’ll try to write down some of the things I talked about.

Yesterday, Mike Taylor raised a very interesting question on Twitter: “Anybody know what Safari 5 requires for a page to be Reader-ifiable?”

Every time you click that shiny little Reader button, Safari generates an HTML document and displays it as an overlay to the original document. Let’s have a look at the HTML and CSS used in this process, and find out how we can mess with it.

A while ago, I was wondering how exactly one triggers HTML5’s XML mode — let’s call it XHTML5 from now on. You know, just out of curiosity. I’ll always prefer HTML over XHTML because it’s much less verbose and I like to keep things simple.

One of the more subtle yet awesome changes that HTML5 brings, applies to the id attribute. I already tweeted about this a few months ago, but I think this is interesting enough to write about in more than 140 characters.

When writing CSS for markup with weird class or id attribute values, you need to consider some rules. For example, you can’t just use ## { color: #f00; } to target the element with id="#". Instead, you’ll have to escape the weird characters (in this case, the second #). Doing so will cancel the meaning of special CSS characters and allows you to refer to characters you cannot easily type out, like crazy Unicode symbols.

A few days ago, Martín Borthiry contacted me with a question. He had been using the optimized asynchronous Google Analytics snippet for a while, and noticed an additional speed gain when wrapping it inside a setTimeout() with a delay of 0 milliseconds. His tests made it pretty clear that this technique was indeed slightly faster, but Martín had no clue why.

Thomas Aylott has come up with a clever script that allows you to easily create Mac apps from shell scripts. Here’s how it works.

The following article was published on CSS-Tricks as a guest post.

The following article, written by John-David Dalton and yours truly, was published as part of the Performance Calendar series in 2010.

Dropbox organized a scavenger hunt named Dropquest the other day. The first 81 people to complete all steps won some nice prizes, but everyone participating in the quest can get 1 GB of extra Dropbox storage space.

As you may have heard, the upcoming iOS 4.3 will support AirPlay streaming in Mobile Safari. Previously video streaming was only available in Apple-controlled iOS applications like the YouTube and iPod/Video apps, but the new iOS 4.3 beta opens up AirPlay support to both third party App Store applications, as well as embedded web videos using either the Quicktime plugin () or the

“Touch icons” are the favicons of mobile devices and tablets. Adding them to your web page is relatively easy, but it gets more complicated as you target different devices and firmware versions. Let’s dive in!

HTML5 standardizes the oninput event handler, which should be used to detect user input in JavaScript. Sure, you could use onkeydown or onkeyup instead, but those were never really designed for this particular use case, and it shows.

I am writing this article because I noticed there’s a lot of misunderstanding on the subject of CSS hacks. How do you target Internet Explorer in your CSS? Do you use CSS hacks, conditional stylesheets or something else?

This is one of those posts I wrote just to be able to link back to it later. I see a lot of questions on the subject, and even though I don’t mind explaining the same thing over and over again, it’s probably easier to just write it down once.

According to HTML4, the first occurrence of the character sequence

By now, everyone knows how to detect and use localStorage. However, I’ve been using a seemingly unconventional (but slightly more efficient) technique to do so. Since I haven’t seen it documented anywhere else, here goes!

Recently, a popular new addition was made to the HTML spec: anchors may now have a download attribute. That’s not what this post is about though — instead, I’d like to go over some of the different notations people used to refer to this new element + attribute combo in tweets and blog posts.

As a follow-up to the post documenting a few popular HTML element + attribute notations, here’s a similar one about JavaScript.

In this post, we’ll take a closer look at what happens if there’s an unencoded ampersand that’s not part of a character reference in your HTML code. Is it valid? Is it invalid? And what do “ambiguous ampersands” have to do with all this?

I thought it would be fun to document the smallest possible valid HTML documents for each version, so here goes :)

Having recently written about character references in HTML, I figured it would be interesting to look into JavaScript character escapes as well.

Does JavaScript use UCS-2 or UTF-16 encoding? Since I couldn’t find a definitive answer to this question anywhere, I decided to look into it. The answer depends on what you’re referring to: the JavaScript engine, or JavaScript at the language level.

Did you know var π = Math.PI; is syntactically valid JavaScript? I thought this was pretty cool, so I decided to look into which Unicode glyphs are allowed in JavaScript variable names, or identifiers as the ECMAScript specification calls them.

Fun fact: var foo = { H̹̙̦̮͉̩̗̗ͧ̇̏̊̾Eͨ͆͒̆ͮ̃͏̷̮̣̫̤̣Cͯ̂͐͏̨̛͔̦̟͈̻O̜͎͍͙͚̬̝̣̽ͮ͐͗̀ͤ̍̀͢M̴̡̲̭͍͇̼̟̯̦̉̒͠Ḛ̛̙̞̪̗ͥͤͩ̾͑̔͐ͅṮ̴̷̷̗̼͍̿̿̓̽͐H̙̙̔̄͜: 42 }; is valid JavaScript. It may not be immediately obvious, but the real surprise here is that the Cthulhu-esque property name is not surrounded by quotes. Intrigued by this, and having written about the similar topic of JavaScript identifiers before, I decided to look into valid property names in JavaScript. When do they need to be quoted? When can the quotes be omitted? And in which cases can dot notation be used instead of bracket notation to get or set a property based on its name?

Are the quotes in font-family: 'Comic Sans MS' required, or not? If you thought the answer was yes, you may want to read on.

Are you a Dropbox user? By completing this year’s Dropquest, you can get 1 GB of extra Dropbox storage space, for free. Here’s how to do that as fast as possible.

Are you using MySQL’s utf8 charset in your databases? In this write-up I’ll explain why you should switch to utf8mb4 instead, and how to do it.

Looking for a list of all reserved words in JavaScript? You’ve come to the right place. I recently needed such a list myself, but ended up comparing the reserved keywords in all ECMAScript versions as well. The result is listed below, for future reference.

This post explains a hidden gem in the XMLHttpRequest standard that simplifies fetching and parsing JSON data through Ajax.

If Content Security Policy is enabled for protection against cross-site scripting attacks (i.e. the unsafe-inline option is not set), the use of inline