Paul Irish

Making the www great

Updates From All Around - Dec 2009

A lot of the work I’m doing doesn’t turn into new posts so here’s a summary of what’s been going on:

yayQuery

Since it was announced here, we’ve come a long way. We just put out our 7th episode (now in HD!). The show format has tightened up and we’re putting a lot of time into making it even better. Follow us on twitter or subscribe to catch all the goodness. We also put out an entire episode devoted to what’s coming in jQuery 1.4 (aka 1.MOAR), so peep it if you’re curious.

jQuery Singalong plugin

I was a finalist at Boston’s Music Hack Day with the jQuery Singalong plugin. It essentially allows you to add timed annotations to the HTML5 audio and video elements. (Also it was the first time I legitimately used javascript’s Infinity :) In addition, I put out the (very!) alpha jQuery Bouncing Ball plugin. Check out the demos to get a taste

Modernizr updates

Faruk and I pushed out Modernizr 1.1, which can now detect what audio/video formats your browser supports, all sorts of HTML5 forms goodness, and some other ones like localStorage and applicationCache. We’re delighted to be part of Mark Pilgrim’s Dive into HTML5 book and pumped to help push the edge of progressive enhancement.

@font-face and webfonts

It’s a rapidly changing landscape, so I’ve been keeping all my font-y posts up to date:

@font-face feature detection

I’ve updated the existing feature detection script to use a smaller file. (Thanks to the Font Squirrel for the help). You would use this script to detect if support is present or not; perhaps implement a Cufon fallback. These new improvements will make their way into Modernizr 1.2.

I’ve also added on a isFontFaceSupported browser sniffing alternative. The main benefit here is that you’re guaranteed accurate results synchronously. (The true feature detection can’t do that, though the new small size is much faster in Firefox.)

Other bits and bobs

The nice guys at that other jQuery Podcast had me on the show in November. I talked about, well.. basically all of the stuff above. :) It’s a good show.

I tweeted about a new quick approach to a for loop:

1
for (var i = -1, len = arr.length; ++i < len; ) // the cool guy loop

The fun part is that the counting expression (the third part) is empty. It’s faster than your standard loops, but reverse while() is still quicker. @jdalton beat me to this one, for the record.

Lastly, along with my writers, I’ve been keeping my mp3 blog Aurgasm fresh with new music you’ll love. I’ve got a lot more things in the pipeline, so right after my Christmas and New Years jaunt around Germany, Denmark, and Scotland, you’ll see them soon. Happy December ya’ll.

Memorable Hex Colors

Hopefully this will save you a trip back to Photoshop’s color picker.

  • #b00b00
  • #de1e7e
  • #e1e100
  • #BADA55
  • #F0FEAF
  • #ac1d1c
  • #facade

These ones are memorable, but not terribly color-appropriate:

  • #c0ffee
  • #defec8
  • #deface
  • #0ff1ce
  • #a55

Thx for the awesome suggestions: @mrspeaker, @8centsaday, @wilto, @lrbabe, @twalve If you have any good ones to add, holler in the comments!

I guess I have a thing for hex colors.. ;)

jan 13, 2011: Lots more hex color words here 2012.07.23: This is too awesome to not share…

hexu.al, the catalog of memorable hex colors.

also worth mentioning the fine work of lexadecimal.com

Announcing the Type Rendering Project

A short while ago, I pulled together some bright minds in the emerging web fonts scene: Tim Brown of Nice Web Type, Zoltan Hawryluk, and Ethan Dunham of Font Squirrel. I thought it would be wise to share notes and begin talking about cross-platform/browser type rendering (that lasagna of complexity), in order to clarify the entire process for ourselves and others and find ways to make web type look better.

Basically, I want @font-face text to look damn good.

Now we’ve set some goals and would like to open up the dialogue. We’ll need your participation, and lots of expert advice, to fulfill these intentions. Follow Type Rendering on Twitter.

Check out How to Detect Font-Smoothing Using JavaScript to learn about an algorithm Zoltan has developed for determining whether a visitor’s web browser uses font smoothing technology when rendering type.

If you want to see rich typography succeed, tell folks you care about how type looks on the web.

We’ll be exploring all the layers involved in making sure web fonts are implemented in the best possible way. We’ll need your help, too.