HTML5 Templates
Papa bear: HTML5 Boilerplate Mama bear: HTML5 Reset Baby bear: HTML5 site template ... More
Ajax Help
BetterSource for Safari 5
One of the major bummers about Safari is that the “View Source” view is totally lackluster. No code highlighting, no live links, no line numbers, no refresh. Boooo. The BetterSource extension solves every one of those problems. I do wish ... More
Linkage Returns
Way back when I used to do “Links of Interest” style posts. I’m happy to announce now that 1) There is a new design of this site coming within the next few weeks and 2) Linkage is coming back. I’m going to do it like it’ ... More
Cross-Browser HTML5 Video and Audio
MediaElement.js is a jQuery-based package for allowing us to:Use the HTML5 elements <video> and <audio> and have them work cross-browser (including mobile WebKit)Deliver a consistent UI for controlsUsing only a single formatI’ll be using ... More
Performance of CSS Selectors
The idea here was to compare different styles of writing CSS and see how they affect the page rendering. So using all ID’s, using all classes, using OOCSS techniques, etc. I gave some best practices advice on this a little while ago, but had no ... More
Double Click in CSS
With the recent proliferation of touch devices, the web designers of the world are losing our beloved mouse pointer. There has been some interesting talk about how we essentially lose the :hover pseudo class in CSS as well as mouseenter, mouseleave, ... More
Wufoo API Contest
We’re giving away a friggin’ Battle Axe (and ,000) to the winner of the Wufoo API contest. Cash prizes and Wufoo accounts for life to the second and third place winners as well. Developers, you have until the end of this month! Check out ... More
CSS Sprites Workflow
When you are coding up a brand new site, I think this is a pretty efficient workflow for how to handle CSS Sprites.Ignore sprites entirely. Make every background image its own separate image and reference them as such in the CSS.When you are reasonab ... More
Fix Inserted HTML5 Content with HTML5 innerShiv
When working with HTML5 today, many of you know that you’ll need to include the “HTML5 shiv” to ensure that CSS will recognize and be able to style those elements in browsers that aren’t yet hip to HTML5.<!--[if IE]> & ... More
CSS Run-in Display Value
CSS has a value for the display attribute called run-in. It’s like this:h3 { display: run-in; }The point is to allow a header to run into text below it, without sacrificing semantics or running into the problems you might run into trying to f ... More
Guest on jQuery Podcast
I had the honor of being on the jQuery Podcast #30 with Ralph Whitbeck and Doug Neiner. We talk about some of the different parts of CSS-Tricks, the jQuery conference, and the difference between designer and developers. We also talk about my new job ... More
Guidelines for URI Design
This is a guest post by Jacob Gillespie who started an interesting thread on Forrst about this topic. I invited him to post it here, to which is graciously accepted.Over the past several years, I have taken an interest in usability and web design. O ... More
Inset Border Effect jQuery Plugin
This is a guest post by Robin Thrift who wrote to me with some demo code for creating this effect. Together we turned it into a jQuery plugin. Enjoy!I was browsing through a few Flash templates on ActiveDen when I came across an effect I see very oft ... More
Understanding border-image
The new CSS3 property border-image is a little tricky, but it can allow you to create flexible boxes with custom borders (or drop shadows, if that’s your thing) with a single div and a single image. In this article I explain how the border-imag ... More
New Screencast: Simple TextMate Tips
TextMate is a mac-only code editor. Sorry to all the PC users this time around. If you’ve been watching these screencasts for a long time, you know I used to mostly use Coda. Since I’ve been working a lot more locally, I’ve been using much more ... More
Dude, you browse with JavaScript on?
Dude, you browse with JavaScript on?Uhm, yeah, why wouldn’t I?It’s totally insecure. Hackers could destroy your computer.Hackers? What is this 1995? And, no they can’t.They can definitely steal information about you without you know ... More
Interviewed on Unmatched Style Podcast
The crew from Unmatched Style are the folks that run ConvergeSE which I was lucky enough to attend this year. They are really great folks! While I was down there, I was interviewed by Gene for their podcast.Thanks to Gene for having me! I really reco ... More
Local Previews of Images from File Inputs (fail)
A little while back there was a guest post about Ajax image previews. It’s a nice technique but it left myself and a few other commenters thinking: wouldn’t it be cool if you didn’t have to upload the image at all to preview it? Aft ... More
A jQuery UI Combobox: Under the hood
The jQuery UI 1.8 release brings along the new autocomplete widget. An autocomplete adds a list of suggestions to an input field, displayed and filtered while the user is typing. This could be attached to a search field, suggesting either search term ... More
iPhone “slide to unlock” Text in WebKit/CSS3
There are a couple of WebKit specific properties that make giving text a gradient background possible:-webkit-background-clip: text; -webkit-text-fill-color: transparent;Those will allow the background of the parent element to become the background o ... More