Archive for the ‘Design’ Category

A New Look

Wednesday, February 16th, 2011

A pine squirrel eating a nut 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.

Dribbble Invite Giveaway Contest: AEA Squirrel Remix

Tuesday, March 23rd, 2010

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.

Designers and Code

Wednesday, October 14th, 2009

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?

Testing Accessibility Feature: aria-describedby

Saturday, September 5th, 2009

As I discussed on Monday, I’m working towards making this site more accessible. I’m starting with creating access to the comic for visually-impaired visitors, although I know that’s likely the tip of the iceberg when it comes to making something truly accessible.

Today I finally set up a system for linking a transcript of the comic via an aria-describedby attribute on the comic’s image tag. As I learned, making a transcript is a time-consuming process. So far, only the most recent comic has a transcript, and it took me well over a half hour to do with little outside distraction. I can understand, then, one major barrier to accessibility being more common on the Internet: laziness.

It’s easy enough for me to consider that my comic has a very small cross-section of people that it’s targeting: web designers and developers. Of that demographic, even less have accessibility issues significant enough to prohibit them from enjoying the comic (or in some cases like deafness, the comic doesn’t have any feature that they’d be missing out on without added support). But the fact is, if even one person is interested in my work, and they can’t experience it because of a barrier that I should be trying to help overcome, then I’m doing something wrong.

Over the next few days or weeks (depending on how much free time I have for the project) I’ll continue to make transcripts for the past comics. All future CSSquirrel comics going forward will have a transcript created when it is first made.

If you’re a person who makes use of screen readers, can you take a chance to examine comic #34 (Squirrel in the Dark) and tell me if the feature is working correctly, or if there’s any other work I should make to enhance it? I’d appreciate that very much.

Comic Update: Behold Leviathan, Confused

Monday, August 3rd, 2009

Sooner or later HTML5 will not be the most interesting topic to wax poetic about. This is not that day.

I’m usually in sync with the web-related posts written by Jeremy Keith over at his personal site, Adactio. He’s usually saying something I’m thinking (albeit with more eloquence than I could muster), or spouts some gem of wisdom that I wish I’d thought of first. As such, it is safe to say that I respect him and, normally, his opinion.

This weekend, however, he wrote firmly on the topic of HTML5 and its process, in The HTML5 Equilibrium. In doing so, he made a sort of sandwich. The opening and closing of his post were two delicious, carefully toasted buns of high quality. But firmly settled in between them was a rank egg salad segment where he detailed his view on the W3C/WHAT WG “split personality”, ruining my appetite for his creation.

I’ve never been able to stomach egg salad sandwiches.

My reaction was spawned by his discussion of the status of Ian “Hixie” Hickson as the dictator-for-life of HTML5, sitting astride a position of absolute power in how the spec is edited. As readers probably know by now, there’s been plenty of friction lately between the HTML5 efforts and every other W3C group known to man as Ian’s been refuting their expert advice in exchange for his own pseudo-expert opinion on a wide range of topics.

Keith comes to Hixie’s defense by stating that although an unelected autocrat is horrible, it can work quite well. He evokes the power of dictatorship by referencing Thomas Hobbes’ Leviathan and quoting Shakespeare’s Henry V. Specifically, he states that by doing so we transfer “moral responsibility” from the populace to the dictator, then goes on to say that Ian has taken this mantle and used it evenhandedly and fairly.

In short, Jeremy uncouples the means from the ends. Leviathan, written in the 17th century, is a text that firmly opposes Separation of Powers and refutes the Right of Rebellion, claims the sovereign’s acts are incapable of being considered unjust, and makes it unjust for the populace to attempt to unseat the sovereign.

In short, do what you’d like, Hixie. It won’t be our fault, because we’ve given you all the power, and from here on out we’re blameless. But at the same time, should we disagree with you, tough for us. It’s all your show now.

And really, that’s what it’s become. The Hixie Show. The amount of “not invented here” mentality that evades the modern HTML5 spec is odious. Accessibility in HTML5 isn’t being decided by experts. Process, when challenged through W3C guidelines, is defended as being “not like the old ways”, in essence slapping the W3C in the face. Ian’s made it clear he won’t play by the rules. When well-meaning experts carefully announce their opposing positions and desire for some form of closing the gaps, Ian and the inner circle constantly express how they don’t understand. This understanding issue has reached a comedic point. When Sam Ruby pressed them on the subject during an objection by John Foliot (as noted here), Ian’s response is a glib “I don’t understand John’s concerns. He hasn’t explained them. He has just made unsubstantiated demands.

This phrase (“I don’t understand”) is used by Ian so frequently that I’m genuinely concerned. He’s ostensibly a bright man. The usual objections and positions by other parties in the HTML5 dialogue are incredibly well documented at this point, in staggering detail. To claim the inability to understand exhibits one of two traits: Either Ian is a simpleton, or he is deliberately “misunderstanding”.

I don’t think it’s the former. Ian has clearly demonstrated his phenomenal intelligence. Yet, the latter option is part of Ian’s well documented deny, delay, too late methodology for handling people. Engaging in this sort of behavior is disrespectful of his community of peers, and more than discouraging when its coming from our empowered Leviathan.

We must accept this, though. Because it’s the results that matter, right? If we get a HTML5 spec, any HTML5 spec, we should be happy about it. Despite all the assurances to the contrary, I can’t really believe that it’s acceptable to consider a product’s method of construction to be independent from its quality. If so, I should be paying far less for my garments, right?

There’s a thought process here that is so far removed from the 21st century as to be terrifying.

In today’s comic, Jeremy Keith reveals the Leviathan to the Squirrel. Things go badly. But remember, it’s only the Leviathan’s fault, because we’ve absolved ourselves of both power and responsibility.

Right?