Tuesday, April 14, 2009

Home Page Critique: The Princess Planet

This article seems to fit well with the two previous on Zone and Page Webcomic Design, and it gives us a chance to talk about a nice Page Design style. Any confusion will, I hope, will be resolved by visiting the two prior articles.

A series critiquing home page* design will rely on you to link yourself on over to the actual sites, as they won't fit well in this size space.

You'll do best if you read Pages Vs. Zones first. It's where I talk about two approaches to home page design, and why many comics are suited better by one than the other.

#1. The Princess Planet , by Brian McLachlan

I welcome another classy use of the WordPress/ComicPress platform; it's recognizable but not intrusive.

I love Brian's palette for the comic, and want to protect it. This has me thinking about backing the text below the comic down an inch. Some of the feed and related buttons are not great colors, and create imbalance. Alternately, different colored, even custom made, buttons could be used. Googling "Web 2.0 Icons" brings a landslide of choices of pre-made buttons.

Obviously Brian doesn't want the Previous and Archive buttons to stray too far. A test is called for: do they look good staying in place if everything else drops a bit?

Up higher, the concentration of different fonts is technically in violation of best practices, but rules are made to be broken. The clashing typefaces are also odd colors, probably inspired by the title. Could we do better? We usually can, but sometimes we rest at satisfied, and that decision is up to the creator. If he's feeling kind of stuck, like I am, about options, Pug is a whiz kid typography designer, and I know a few others. Basic advice is always free, or should be.

One general idea is to shift the navigation buttons to white, at the price of reducing the prominence of the back button. Because I don't have this as a graphics file, I can't easily try these ideas, and they might be bad. My strategy here is to try removing an odd color, and allow neutrality of tone to increase as we work near what is already a subdued coloring for the comic.

We've got a lot of rectangles up top as well. Keeping in mind that I don't know how challenging certain moves are in WordPress, I wonder about some Web 2.0 corner rounding, or possibly continuing the white around the top of the frame and letting the buttons be text links. Another solution is the all-in-one button offered by AddThis.com (see mine in the high end of the right column on this very page. Pug and I haven't custom designed an image for the blog, but we will be for our comics.

The header art is great, but I feel they should all be fully in the scene, not cut off. It gives the impression that this is art that came from a previous site and is being made to fit. The different background color may no longer be alterable, but to my eye this is not a great match with the other background.

This is a great comic home page to critique, and I thank Brian MacLachlan in advance for his forbearance. This is a comic I intend to read, and I'll probably learn why certain decisions in the page design came about, for reasons that are not obvious to me now. It's a highly professional job, at a stage where perfection seems just a few tweeks away. It's also a great example of a page-based comic design, and a veery useful example at that.


*At this writing, Pug and I are not finished with out new sites, currently being comprehensively redesigned, and since our existing sites are basic efforts made while we figured out what we want, I would not suggest you look to them for inspiration. An interesting spin-off of this series will be reader opinion about how well we follow the guidance we offer to others, as we finish our redesigns and make them public. Thanks for your faith in us while we catch up.