Thinking About a Redesign and Trying to Get Unstuck
Published Sunday, August 31, 2008 @ 6:49 am • 23 Responses
I want to redesign Perishable Press. The current design was released around a year ago, and has received numerous compliments and criticisms. Compliments tend to focus on the theme’s minimalist sensibilities, while criticism is generally directed at the design’s poor usability. Personally, I find the “grey-on-black” color scheme to be very inspiring. Others, however, have difficulties reading the content, and that’s not good.
So, throughout the course of the past year, the notion of yet another redesign has been slowly building momentum. Part of me could continue using the current theme for several more years with no complaints; yet another part of me is constantly dissatisfied with the status quo and established routine. These two parts have been doing battle, and on several occasions recently, some new design ideas have tried their best to spring forth, only to be shot down by the overwhelming critic within that sharply says, “no, that sucks — nowhere near as good as the current design..”
This process has made me realize one of the subtle downsides to a minimalist design: it’s difficult to go back to anything more complex. In producing this “dark” theme, my goal was to eliminate fluff, eradicate hype, and consolidate features. Thus the following page structure:
- Title
- Content
- Menu
No subtitle, no sidebar clutter, no advertisements, no party badges — just good, clean minimalist design. Which is great until you try to improve upon it. And that’s precisely where I kept getting stuck. Rather than wiping the slate clean and completely forgetting about the single-column sentinel, I kept trying to improve upon it. Like, you know, trying to modify the width of the column, adding a sidebar, changing colors, text, and so on. But I kept getting stuck. The desire to redesign has been great, but apparently not great enough to do what is required in order to proceed.
At this point, I have put a lot of time and energy into thinking about how to improve the site. I have sketched countless design ideas, examined hundreds of inspiring sites, and even reached out to my Twitter followers for help. Doing these things were useful in that they eventually lead me to the inevitable realization that sacrifice is required to move forward. To get past my current state of design apathy, I have to break my attachment to the current design.
For the past several days, I have been dismantling my appreciation and fondness for the site’s current manifestation. It hasn’t been easy: denial, withdrawal, admission, acceptance — I feel like a recovering heroin addict or something. As I critique my own work, I have embraced observations such as the following:
- Insufficient contrast between text and background
- Insufficient search-engine optimization of site structure
- More functionality needed in the comment area
- Search results practically useless
- Too difficult to find key content
- Current design is boring, tedious
- Site Archives are useless
- Design is not welcoming
..and on and on. It’s like total design sacrifice — I am getting to where I actually hate the current design and can’t wait to change it. Without going into the psychology of it all, suffice it say that the experience itself is quite rewarding: “out with the old, in with the new,” as they say, somewhere, I’m sure. In other words, by giving up what you think is best for you (or your site), you are actually opening the doors to change and making way for something completely new and, hopefully, better.
Thus, after all that drama, I have finally arrived at a place where a fresh design for the site is possible, even anticipated. Behind the scenes, I am working diligently — even feverishly — on the next evolution of Perishable Press. At this point, all I can tell you is that it’s a complete detachment from the current “darker-and-more-minimal-than-thou” Perishable Theme. In subsequent articles, I will be sharing some of the ideas and methods involved with the planning and production of the new design, and look forward to hearing some of your thoughts on the art and science of redesign as well.
Dialogue
23 Responses Jump to comment form
August 31, 2008 at 9:37 am
You should consider using HTML5. I’ve decided to reproduce the same design my blog is currently wearing, with HTML5, and once it has been done — one hour later — I must say that this has given me back my love for the HTML/CSS couple. The code is also much, much more beautiful.
Now, about your own criticisms :
Insufficient contrast between text and background
I’m young, so I don’t have any problems with that, but the constrast is indeed very low.
Insufficient search-engine optimization of site structure
I think you exagerate this point.
More functionality needed in the comment area
That’s definitely true. I’ve been complaining about this one for a while :p
Search results practically useless
I’ve never used the search form on this website. I wish you used tags in a heavy way, because tags are what I think is the best way to handle content. If I come to get a page on the clearfix hack for example, I’d like to go directly in the url and type http://perishablepress.com/press/tag/clearfix/ or http://perishablepress.com/press/tag/hack/.
I love guessing URL. I do it on the Apple website, and on mine. It’s a great feature.
Too difficult to find key content
Yes, I think you should use your analytics stats to figure out which posts are the most read, and showcase them on a list somewhere on the frontpage.
Current design is boring, tedious
I don’t find it boring. I may find it a little sad.
Site Archives are useless
Like I’ve said, I have some difficulties when I’m searching for a certain post on your blog. I even often use Google “keywork site:http://perishablepress.com/press/” :/
Design is not welcoming
I don’t know about this one. I’m used to it now, and I like this place quite a lot.
On a more personnal plan, I think you should go in the direction of Mark Pilgrim’s blog. Take this post on Atom ID for example; isn’t it wonderful to read? His design and yours are very similar, even though you seem to be his “dark side”. What I think is interesting in his approch is the big friendly typography, and lack of visual pollution when reading a post. Now to be honnest, I think your current approch is better is many ways.
Finally, I think that your biggest problem is with the “Tools & Resources” at the bottom of the page. There’s way too much information there, and more importantly, informations that are irrelevant to the post the reader has just finished to read when he arrive at this level. Also, at the top, the navigation menu is too discrete. I think a menu is important : once again, see what I did on my blog, or what Apple did; big, but simple to understand menu at the top. The reader should be able to go somewhere quickly, without having to scan a block of text (Tools & Resources) to find the relevant hyperlink he needs.
I hope this helps! Also, sorry if I’m not as clear as I would like sometime.
August 31, 2008 at 10:58 am
Focus on readability. I think it is rather hard to read long articles in this design.
August 31, 2008 at 12:57 pm
Hi
As a relatively new user I agree with the first commentator. The content of the site, ie. the posts, is excellent but reading it is a chore - the contrast and the font size being the main issues.
As to the tools at the bottom of the page - I have to confess that I didn’t even realise they were there before reading this post. Minimal is good - a paradigm I choose to follow with my own site, but an essential component of minimalism is usability - that uncluttered nature should promote rather than inhibit ease of use.
I look forward to seeing your next iteration (just please, please, don’t emulate the dog’s breakfast recently created at jQuery!).
August 31, 2008 at 1:53 pm
I don’t have a problem with the basic structure (extra stuff in the footer, no sidebar); but I do have big problems with the lack of contrast between the grey of the type and black background. I think you can achieve your goal of keeping minimalist design while still improving reader experience.
I just played with the css of your site in CSSEdit, and just changing the color of the type to white made a huge difference. But I would also like to see the font size increased.
I look forward to seeing what you do with the redesign.
August 31, 2008 at 7:52 pm
Gotta admit, I forgot what the site “looked” like, as have many of your other RSS followers, I bet.
Clicked to look at it after reading this post. Love the articles and insight, but would say Google Reader is, if anything, “more minimalist” in its presentation of your content, and its basic black-on-white text and 30% or so larger font make PP much more readable (at least without my ’specs).
And hell man, float that sidebar content up to the top! Make the font smaller than the main content, and the (sidebar) colors soft, and the whole package will still look neat and clean. And we lazy butts would likely click and explore more just from stuff in the sidebar(s) catching our attention.
Cheers, and keep up the wonderful work.
September 1, 2008 at 7:50 am
Louis, what are the advantages of using HTML 5 at the moment? As far as I’m aware browser support is sketchy at best, and the specification itself isn’t even out of the draft phase yet.
I guess as a personal exercise it could be fun and preparatory, but it doesn’t seem remotely fit for production use in any sense of the term.
Not that I’m trying to snipe you or anything with this comment — I’m genuinely curious about your reasoning behind this.
September 1, 2008 at 11:05 am
I wouldn’t go with partial results, even though its irrelevant to me as I always click through to sites anyway.
In reality, not everyone uses RSS — far from it. Those that do are doing it specifically because they either want to read stuff in their RSS reader and centralise their reading material, or because they simply want updatenotification.
I’d imagine that if someone likes to centralise their reading material in one feed reader, preventing them from doing that will accomplish one thing: pissing them off. At the end of the day, RSS is a service designed to allow people to digest your content as they prefer. If you start trying to control it can only end badly.
Besides, if people really want to comment then they will — having to click one link to do so isn’t going to put them off much. Just look at the response to this post. The reason your other posts might get less comments is because people just don’t feel they have much to add — that’s the real problem.
You might want to add the comment widget to Feedburner to aid the process, of course. Last time I looked it lets you embed the current number of comments any given post has in the feed.
September 1, 2008 at 12:29 pm
@Ryan & Jeff: HTML5 is nicely displayed on Safari, Firefox, and also Opera I think. HTLM5 is a modern language, therefore it will be displayed on modern browsers.
Cons:
no support in IE (I haven’t tested, but who will bet the contrary?)
still a draft, so some the implementation of some tags or attributes may be unclear/unconsistent (though, I haven’t had any problem so far)
Pros:
markup is gorgeous; for example, here’s the integral HTML5 code that reproduce the esthetic of my blog
a child can maintain the code
ready for the futur! (video/audio tags, native events, new browsers features)
I think that writing a personnal blog should be a pleasure before everything. Jeff, you don’t make any money out of this place; the only satisfactions you get from writting here are the act of writting itself — I hope ;) — and the conversations that grow from there. Why would you forbid yourself to take pleasure coding your new design in glorious HTML5? This place should be for your enjoyment first.
—
About some of the things that have been said now.
Higher contrast?
You’re all scarying me. Dan says:
I just played with the css of your site in CSSEdit, and just changing the color of the type to white made a huge difference.
Are you serious? White font on black background, and that feels better on your eyes than the actual contrast? you have to be kidding me :p
The worst here is that you actualy convinced Jeff to make the fonts lighter! You may want to lighter the background color, but if you do that to the fonts, there won’t be much time before your last reader is at the hospital because his eyes have bled.
I’m interested at the moment in easy-on-the-eyes design, and I’ve come to the conclusion that you can’t achieve something like that with a very dark background. I may be wrong, but I think that there’s no just middle between too low and too high constrats, with dark designs. Also, every image you post here has to be treated not to “flash” when put in context. You wouldn’t had to deal with this on a lighter background design.
But I understand your attachment to this idea, and I think I won’t make you change your mind on this one. I don’t think I had you on HTML5 either by the way :p
A freaking sidebar!!?
Ok I’m already dead.
Partial feed
Why would you do that? If a user is not interested a lot, if he’s skimming through his RSS feeds like he watches TV, you won’t make him come here, and suddently be interested and interesting; you will make him unsubscribe in the worst case, and in the better case you will have him continue his routine without even noticing that your feed is now truncated.
As for your interested readers, you will frustrate some, like Will, who always use their RSS reader for reading your posts, and you won’t change anything for readers like me, who enjoy the current design, and always press enter in their RSS reader to come see the whole thing here.
I can’t any good here.
Overall thoughts
The main problems have been underlined by everyone I think: low constrast, and your “super footer”.
I don’t have any advice on how the avoid low constrast without touching the dark background. Though, you may be interested to look at what I’ve come for my homemade blog engine admin page (screenshot). Of course that’s far from the darker spirit you maintain here :)
Though, for the footer, I see, if not a solution, a good starting point: eliminate the unrelated. When I’m on a post page, I don’t need the same tools as when I’m on the homepage. In my opinion, on an entry page, we should be able to: rapidly go to major sections of the website (archives, themes, contact, search, etc); get more related content (related posts, tags, maybe popular posts)
—
That has to be my longest comment ever, but I wanted to say some things, and more importantly, as you said :
In other words, by giving up what you think is best for you (or your site), you are actually opening the doors to change and making way for something completely new and, hopefully, better.
I tried to picture this place with a sidebar, a white font on black background, and as this revolting vision was printing in my head, I knew I couldn’t let this happen.
Now on a technical note, I think that “realign” would be more hype and would fit better than redesign, because you want to change things, but without losing the current spirit.
I don’t want to lose it either.
September 3, 2008 at 12:46 pm
Hey, Jeff! I’m looking forward to seeing that new pink and green layout design!
LOL! I could tell you to enlarge the font or change the colors, but the fact remains that in most cases… you have to redesign a site for you. There are plenty of bloggers out there who have designed a website that has a kajillion visitors, but because the design was built for them as opposed to for the blogger, they have to visit. I’m not saying discount the visitor, but I am saying at the end of the day you should feel comfortable doing what you want to do with your website. So, I’ll just say that I patiently await whatever you come up with and if you do something crazy like 6px font, I’ll just stick to the feed. LOL.
If you want any help or anything, just ask. :)
September 4, 2008 at 10:44 am
I’m 46 and hopelessly farsighted, so I find the color scheme and lack of contrast to be nearly impossible. On the other hand, I appreciate the minimalistic look. Added functionality doesn’t have to mean clutter. There is nothing inherently cluttered looking about sidebars. They only look bad when people fill them up with useless junk. Think very carefully about the most important information you want to present to your readers, and then devise a way to make it as easy as possible for them to find it. Eliminate everything that doesn’t serve that purpose.
September 4, 2008 at 3:23 pm
Hi, Jeff!
I’ve been reading for a while now; learning of updates via RSS and clicking over because I like to actually experience the sites I read.
I’ll throw in: I always change the theme to the dark background and increase font at least 3x. Folks have already covered these aspects, though!
The super footer is another much-mentioned area for change; I’ve never used it because I don’t want to sort through it all.
Also, the links to previous/next posts is not very intuitive, being placed at the end of the article in with the other metadata. What about moving it to the top as well, and/or below the comments. Better navigation, I think.
I’m extremely interested in reading your coming thoughts on redesign (or “realign”) and seeing how the current design evolves!
September 5, 2008 at 12:15 am
Your current design serves it’s purpose. I wouldn’t change anything. It’s simple, effective and actually quite inspiring. Then again, some of your readers seem to think otherwise.
Whatever you decide to do, one thing’s for certain. You wouldn’t lose your audience. It’s all about content and I think we’d all agree that yours is just plain great.
Good luck.
Trackbacks / Pingbacks
Share your thoughts..
← Previous post • Next post →
« Flashforward: Exclusive Interview with Aaron Wall • Multiple Loops and Multiple Columns with WordPress, (X)HTML and CSS »
1 • Ryan Williams
August 31, 2008 at 9:25 am
Just to throw this out there, I think the current structure of this site is the complete opposite of simple and usable. The font size is straining, the contract amplifies that, and it’s difficult to do anything except read a single post.
The way that all the non-content functionality and content is effectively thrown into a huge pile at the bottom really isn’t intuitive, with no real direction for the eye when you’re looking for something specific.
The only thing preventing the implementation of a sidebar that organises that stuff better without compromising the clean nature of the design is the design itself. A sidebar does not implicitly equate to ‘clutter’, and I heartily encourage you to embrace this! :)