On January 30, 2006, A List Apart published In Search of The Holy Grail, Matthew Levine’s answer to the leanest, semantically correct, and bulletproof structure for a web-standards-based, 3 column layout with a liquid center—The Holy Grail.
Three columns. One fixed-width sidebar for your navigation, another for, say, your Google Ads or your Flickr photos—and, as in a fancy truffle, a liquid center for the real substance. Its wide applicability in this golden age of blogging, along with its considerable difficulty, is what has earned the layout the title of Holy Grail.
This article, and others like it, probably saved 1 million tons of lost hair among the web development community. You should read it if you haven’t already. But it’s not the end of the story.
Note the mention of blogging in the quote above. It think it’s safe to say blogging has been the trend-setter in web design for the past few years; even Jeffrey Zeldman says the Helvetica of web design is the blogger theme Minima. But blogging is a slapdash affair and that’s where the Grail slipped from our grasp.
Look again at the quotation above. We’ve got three columns, but for what? Stuff. Stuff that doesn’t matter, stuff that’s interchangeable, stuff to sit alongside our real content. Stuff to distract and stuff to interfere. We’ve got to look at this stuff.
Design is Putting The Right Stuff in the Right Spot
The Holy Grail is not a 3-column template to fill with stuff. The Holy Grail is what you need; nearly unattainable design perfection, the right stuff in the right spot, in other words. So how do we find the Holy Grail of Blog Design then? How do we go about finding the right spot for everything on a blog? There’s two places to begin.
Your Blog Design Should Look Good Naked
Everything should start out P.O.S.H. with Plain, Old, Semantic (X)HTML. Explain your blog to the text editor and set it with careful markup. Question every DIV and tag that stands between you and your content, or between you and the information. If I want to read your blog with the CSS turned off (I do this often) something is wrong.
Maybe there should be a Hippocratic Oath for web developers: Firstly, do no harm to the browser defaults.
Study Where Eyeballs Land
Look at Google Adsense ad charts and Useit.com eyeball tracking results. This is where content should go—not ads.
Google has produced a wonderful diagram of where to place your ads on a hideously overcomplicated web template. This is where Google AdSense ads perform best. Let’s take a look at it.
I believe Google when they say don’t be evil. I really do. But I’m not going to use this chart to determine ad placement on your blog. I’m going to use it to defend the two-column layout. Keep your content to the left, your titles bold, and nothing between your reader and what they want to read. Yes, surprisingly, readers want to read things. Weird.
No one likes to click ads. If people are clicking ads in these spots there must be something to it. Some relation between content placement and reading position (that is, besides Google’s suggestion of putting ads in places that will confuse your reader).
Let me draw some more (likely off-base) conclusions from studies I didn’t do. In August of 2007, Jakob Nielsen published Banner Blindness: Old and New findings. Nielsen was reluctant to publish this article, he says, because it revealed that unethical ad placement pays off. That is, Ads that look like content are more likely to be clicked.
Ads that look like content are more likely to be clicked. Dear blog designers everywhere, this is an alarm bell ringing. No one is looking at your header, your sidebar with twigs instead of tabs (and don’t get me started on tabs for navigation) or navigation that rolls down like a toilet-paper roll. They want to look at the words.
Entering The Conversation
I feel somewhat Nervous about even entering this conversation. I mean, some nerve, eh? I’m setting up all my future work as part of the quest, aren’t I? But good design, The Quest, is worth any public embarrassment or failure. This is how I judge myself. I’m not afraid to be judged on my journey.
… unless you have a really sharp stick or something. Then I might be afraid to be judged.