I’ve been coding for over twenty years now, and I still hate math. With responsive designs, you end up with a lot of awkward numbers. Thankfully, Elliot Jay Stocks has provided a handy little PSD for designing for responsive grids in Photoshop.

Compare that to a container that has a width of 1000px. 1000 is a nice, easy, round number. Dividing by 1000 results in clean percentages and better still, dividing by 1000 is something we can do in our heads: just remove the zero. A 140px column inside a 1000px container is 14%. A 500px column in a 1000px container is 50%. 320px is 32%. Easy!

Check it out.

I’m not at An Event Apart: Atlanta. Which is a shame because by all accounts I missed some wicked banjo playing by Dan Cederholm. And I love listening to some good banjo.

However, I am following along via Twitter, and saw this announcement by Jeffrey Zeldman, web design godfather and co-founder of An Event Apart:

.@simplebits just unveiled Pears pea.rs, an open source web design pattern library/WP theme. #aea

Pea.rs looks like a convenient little tool for web designers to bookmark, a library of sorts where commonly needed HTML/CSS patterns for common page elements like navigation, lists and such can be quickly grabbed and used. I’m sure you’re all so amazing that you don’t need it for your markup, but I also think for prototyping some page elements this might be a good resource to go-to to quickly grab and paste. You might also find a few new ideas on how to arrange your markup or CSS, too.

Check it out.

Last weekend I’d decided that I’d had enough with my site’s old design. Although fairly young as all things Internet go (the site dates back to 2008, the design from only 2010), it felt cluttered, occasionally ill-considered, and entirely too much in places like a default WordPress installation.

There was also a Moby Dick quote about a cannibal floating in the sidebar that had gone past its expiration date.

So I had two choices: Turn the site into something for the cannibal whaler community, or open a text editor and get cracking at some new CSS and markup.

About fifteen minutes after sketching some prototypes for blubberandlongpig.com I decided I’d made the wrong choice and went for the redesign option.

I had three basic goals:

1. Reduce the site’s clutter, making it as minimal of a design as I could feasibly manage while preparing for future site features.

2. Make it feel a little more grown-up than the last version. Which is admittedly a funny thing to want from a website featuring a comic squirrel.

3. Make it easy and pleasant to read.

In the end, I’d like to think I’ve managed to capture that. At Mindfly my position involves more coding than pixel-pushing, with the designs I’m working on coming from very talented designer co-workers (my design philosophy seems to be “use the color green” which has its limits). As such, I don’t usually “design” often. In the end, if you were to ask me why I made any choice here, I’d say “Because it looked nice to me.”

There’s still some work that needs to be done. The about page hasn’t been restyled entirely yet (and its content is bound to see some major changes) and comments are a work in progress. I’m planning to replace the old captcha with something less invasive like a honeypot.

Still, I’m rather proud of it. It’s not a responsive or flexible design, but it loads decently in the iPhone and seems to fit well for most monitors. I’m planning on doing some testing to see if I need to add some better support for other small screens and devices (in which case media queries would definitely come in handy.)

I hope you like it.

If any Herman Melville enthusiasts think I missed the boat by passing on that Queequeg fan site, feel free to let me know. For the rest of you, I’d love it if you share any opinions you may have about the new look.

Ladies and gentlemen, I have three Dribbble invites to give away. I’m sure some of you have seen the various tweets, blog posts and comments about this community of sharing shots of what you’re working on (I know I’ve done my share of such messages). It is, in a word, a great place to share creative juices and get feedback from fellow web designers and other creative types.

I love it.

And I want to share.

To that end, I’ve devised a contest. One of the features of Dribbble is the “rebound”, using a basketball metaphor to describe making a shot (aka, image) that is a remix or inspired by a previous shot. There’s been a few really neat contests inside Dribbble to test this feature, with awesome results. In that spirit, I’ve created an incomplete comic that you can download here. Take this comic, mix it up and complete it. Alter it however you see fit, within the following guidelines:

1. Some of the original art must be present.

2. The three panels must still exist (aka, it fits the standard CSSquirrel strip frame).

3. The comic must involve An Event Apart: Seattle in some way. I’m heading to this awesome event soon, so the Squirrel should get his moment to enjoy the experience.

4. The Squirrel must be in the final product.

That’s it. Those are the only rules. Add in characters, alter backgrounds, create speech bubbles, do interpretive dance, whatever. Go, mix it up, then post it online somewhere (where I can get to it) and send a tweet to @cssquirrel or leave a comment to the post that links to the image. On Monday morning, I’ll review the submissions (along perhaps with fellow Mindfly peeps) and choose the top three comics. All three will receive Dribbble invites, and the #1 comic will appear as CSSquirrel #59! The top three will also appear in an April comic. I know, I know, I’m too generous.

Now, off you go! Your deadline is 8:00 am (PST) Monday, March 29.

I wasn’t at An Event Apart: Chicago 2009. But along with other desk jockeys, I followed along via A Feed Apart. One comment that got re-tweeted about seventy million times during the conference was the following quote by one Jeffrey Zeldman:

“Real web designers write code. Always have, always will.”

When I made a comment about the amount of retweets occurring on this post, I got a reply from Molly Holzschlag (who I respect, but am incapable of pronouncing the last name of):

“Bless my pals at AEA but the entire comment is bait or a very misguided statement to make on the brink of 2010.”

When two people who helped define the industry as it is today have a difference of opinion, I’m left on the sidelines wondering which to agree with. One the one hand, I agree with the concept that design needs to occur more in the browser and less in Photoshop, but on the flip side I suspect Molly has some insights that I’m simply not taking into account.

So I’ll throw it to the web at large. What’s your opinion on this topic? Do designers need to start doing more design in (X)HTML and CSS, or are we coders going too far in expecting the to put Photoshop aside in the early design phase?