Best CSS (and Image) Cache Control


Have you ever updated the markup and CSS for a website but when you load it in your browser it renders incorrectly because of the browser's cache? Have you ever told a co-worker or client that they need to "refresh" or "force refresh?" Chances are then that other visitors to your site are running into this problem, too.

Busy sites like Twitter, Digg, Boing Boing and others use methods to avoid browser cache issues. They find it important for their sites to always display correctly. You too can ensure visitors to your website will always get exactly the version of your style sheets and related image files that you want them to get.

I wrote an article for SitePoint covering solutions to browser cache problems titled "Overcome Your Caching Conundrums".

In the article I cover popular ways to deal with JavaScript and CSS file cache control, as well as a trick-of-the-trade method that will also help you manage your image caching. Hint: Have you ever wished that url() for your background images was relative to the styled-document's location instead of being relative to the stylesheet file's location? I used to feel that way, and it wasn't too long ago that I saw Eric Meyer tweet a similar desire. But now I am actually quite glad that url() works the way it does, and that has to do entirely with CSS cache controlling.

Now go and read the article on SitePoint. I hope you will find it interesting!

My Zombie Video Commercial


In the spirit of Halloween, I wanted to post this zombie-themed video commercial for the Gopher Express convenience store. I did much of the writing, directing, and editing for the video with a lot of help from some very talented people. I was definitely making a deliberate nod at director Edgar Wright's work on Shaun of the Dead. I think it shows.

My zombie vide is titled, "Luuuuuuuunch." Watch it now!

I was extremely honored when this video won a Communicators Forum Maroon Award in the "electronic media, video" category in 2008. The video was also submitted this year to the Zombie Short Film Festival in Toronto. With some luck, my co-creators and I will be able to add a "double award-winning film" to our resumes.

[Fingers crossed.]

Equip > Pants, a "Bare" Minimum RPG


Play the full Legend of Equip > Pants Game!

The Legend of Equip Pants: Adventure RPG

Original Post:

I've been tracking the Experimental Gameplay Project blog since its return earlier this year. I decided to enter the competition this month when I saw the August theme, "bare minimum," which they suggested could be anything including "graphics, sound, gameplay — some have even been so crass as to suggest clothing!"

My idea was to create an extremely basic RPG with gameplay throwbacks to NES titles like Dragon Warrior and Final Fantasy, but with even simpler graphics. The graphics concept I came up with was basically that anything in the game would be represented with giant square pixels of color. And then playing off the theme's implication of bare-as-in-naked, I came up with the game title: Equip > Pants. Here's a very brief review:

Having perhaps the highest hilarious: number of pixels ratio, equip > pants follows the exploits of a pantless hero who must don pants. -Experimental Gameplay Project

In the spirit of the Experimental Gameplay Project competition rules, I spent just seven days developing this game. I put in less than 40 hour of development time total.

The game is written in JavaScript, and should run fine in most browsers. Play it now. Click START below.

And after you've finished, check out the other games from the August theme. Just to give a few more technical details about the game: I used the DOM to draw the graphics instead of a canvas tag. Those of you with Safari, Chrome, or Firefox 3.5 should see a beautiful pixel font in the game thanks to an @font-face rule.

Oh, and don't mind the ABOUT / CREDITS link... that just goes to this blog entry. (Some places have linked to the game directly rather than this post.)

Where Is the Web Revolution Taking Us?


Today I read an article on titled "HTML 5 - The Revolution will not be Televised." It reminded me of some of the concerns I've been having lately with developments in the web industry. They are concerns I spoke about briefly at the end of my presentation on Web Human Interface Guidelines at MinneWebCon 2009, and now feels like a pretty good time to dust the subject off and say some more about it.

Specifically, I did not share the happyworm article's optimism about these points:

"It seems that it's not so much about the corporations anymore, more about the community."

"...a seismic shift in power towards the community and away from the browser vendors, the consequences of which cannot be underestimated."

First, let me start by saying I'm assuming by "community" the author meant web developers. It is important to note that Apple, and even more so Google, were heavily involved in the HTML5 spec and thus, if only by association, the demise of XHTML2. I ask if maybe the power has moved away from browser vendors towards content-provider corporations, and not towards the community? (It is worth noting that this is a very common trend now in America for decades.) The W3C ceding some control strikes me as perhaps further evidence that the community may actually be losing ground. Google entering the browser vendor market only serves to muddy the waters.

Some fraction of the web developer community was very excited by Google pushing HTML5. Some fraction was very disappointed. Can the community have the power if the community is divided? Maybe Google and Apple are listening only while it is convenient for them and their bottom line. Maybe the HTML5 supporters think they have power because Google's use of power just happens to line up with some of the web development community for the time being.

Personally, I'm very much a supporter of community-based web standards. I'm glad for now that we have Google and Apple blazing ahead with roughly standards-based HTML5, CSS3, and JavaScript. I certainly don't think we should give Microsoft the keys to the car. They've already shown us where they would drive it, if not deliberately then by incompetence or lack of vision. And I think we also must give credit to Opera and Mozilla. They seem to embrace community driven development. I think they've got our backs.

I do think we probably have little to fear on the CSS and HTML fronts. I think the illusion of community derived standards will continue, with the corporations that actually make the decisions acting mostly benevolently. Occasionally they may err on the side of progress over standardization, but the benefits of that will probably outweigh the problems.

I am much more concerned about JavaScript (JS), especially with how Google is positioning itself. We (web developers) enjoy fairly standardized JavaScript language for the moment, with a lush pasture of JS libraries, user interface (UI) toolkits, etc to choose from. Google has entered the browser market and is fully intending to create a browser-based operating system. I'm not so sure we can trust Google to act in the web development community's interests over its own corporate money-making interests in regards to web applications, specifically client-side JavaScript applications and web applications UI. I think there is a real possibility that Google may create a proprietary JavaScript web applications platform and lure many developers in via a "web standards" carrot, custom (read: proprietary) application toolkits with pre-built functionality, a captive audience, and a clear path to individual app monetization. I think this could create some real fractures in the JavaScript language and potentially even web development as we know it.

I will give a simpler example for my concerns for the future of community driven decisions in the realm of JavaScript and Web Applications UI. There has been some talk of incorporating jQuery as part of HTML5/JavaScript. If you are a Dojo, YUI, or Mootools fan, how would you feel about jQuery being selected as an early winner? What are the chances people will want to use some other JS framework, or Web App UI widgets built for some other JS framework, when jQuery would perform dramatically better because it is actually built into the browser?

It is far from certain, but we may soon find ourselves with far fewer choices as web developers than we have now. Or, maybe Google will "do no evil" and blow all of our minds with great stuff while having a ear in the web development community. I, for one, am watching carefully.

jQuery Patch: Animate CSS Rotation and Scale


I have created a monkey patch for jQuery (tested through 1.6) which enables you to independently set and/or animate both the scale and rotation of any HTML content with jQuery. This code uses the scale() and rotate() CSS transformations that are only supported by Webkit, Safari, Chrome, Firefox 3.5+, IE9, and some versions of Opera at this time.

As an example I have some spinning HTML content. You can click the content to increase its scale while it continues to spin.

Read the full post to see the example and download the patch.