Latest TweetsWordPress and the Blank Target Vulnerability (aka rel noopener + noreferrer): perishablepress.com/wordpress-… #WordPress #security #html
Perishable Press

Thinking About a Redesign and Trying to Get Unstuck

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.

Jeff Starr
About the Author Jeff Starr = Fullstack Developer. Book Author. Teacher. Human Being.
Archives
22 responses
  1. 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! :)

  2. 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 either of these:

    https://perishablepress.com/tag/clearfix/ https://perishablepress.com/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 like:

    keyword site:https://perishablepress.com/

    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 personal 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 approach is the big friendly typography, and lack of visual pollution when reading a post. Now to be honest, I think your current approach 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.

  3. Focus on readability. I think it is rather hard to read long articles in this design.

  4. 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!).

  5. dan butcher August 31, 2008 @ 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.

  6. 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.

  7. 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.

  8. Jeff Starr

    @Ryan: Two great points that I am beginning to agree with: the giant pile of links at the bottom of the page — the “super-footer”, if you will — is probably doing the exact opposite of what I originally had intended. In fact, it probably frightens many visitors away! Not good. And secondly, as much as I wanted to avoid using them, sidebars do provide much needed usability relief, helping visitors to cherry pick key content intuitively. The trick is, as you say, implementing a sidebar in such a way as to maintain a clean and organized look throughout the site. (Easier said than done, imho!)

  9. Jeff Starr

    @Louis: Thanks for the breakdown. You have always been a valuable resource for ideas, suggestions, and criticisms when it comes to the site and I appreciate it.

    One big (huge) item on my list will be a complete redesign of the comments area. I am fortunate enough to receive a lot of great comments on this site, and want to make the process as easy as possible for everyone. Look for a post focusing on this topic soon.

    Tags are another great idea. They should be emphasized much more than they are now (which is arguably not at all). This idea alone inspires many possibilities.

    Another good idea is showcasing the key content, as mentioned in my previous comment. Unfortunately, I have a lot of helpful content that I would like to share. I am currently working on a way to do this, and hopefully JavaScript will help out (for those that have it).

    And of course the Archives. Yuck, what a mess. Needless to say, a lot of time will be spent on retooling the Archives page.

    As for the design typography, I do like Mark Pilgrim’s presentation and may try something similar. I know that readability will be much better in the next iteration: larger fonts, better contrast, etc. I will be sticking with the dark background, but the contrast will definitely be improved.

    So many great ideas, Louis! Thank you for sharing them — I will definitely be referring back to this post for inspiration from everyone.

  10. Jeff Starr

    @Tim Sewell: The jQuery site stole my design! “Dog’s breakfast” may be a little harsh, but I would never go for anything like that around here ;)

    Thanks for sharing your thoughts; you are absolutely correct about usability being an important part of minimalist designs. What I am trying to do with the next design is break away from minimalism altogether. For me, it’s not easy (I still secretly enjoy the current design), but there are so many ways to improve upon things — especially where usability is concerned — that it simply must be done!

  11. Jeff Starr

    @dan butcher: Thanks for the input, Dan. I have done the same thing with tweaking the CSS rules for font color and size. In fact, you can see the results of one these experiments by clicking the sun icon in the lower right-hand corner of the screen. This was done to help with usability, but there is really no way to let people know about the feature without adding some aesthetically obtrusive dialogue somewhere that says, “if the low-contrast design kills your eyes, try clicking the little icon..” or something like that. In any case, the alternate stylesheet is a step in the right direction, but after some additional tweaking of the different text and background properties, the original design “vision” (for lack of a better word) begins to lose its flavor, leaving nothing but mutated (yet more usable) remnants of the original design. At some point along the way, wrestling with this trade-off, I finally mustered up the nerve to cut the umbilical cord and start fresh..

  12. Jeff Starr

    @Will: You bring up another interesting point; something I have recently been considering is switching from full feeds to partial feeds. I know that many of readers are simply “keeping and eye” on my content and really have no reason to drop in say hello. Would serving partial feeds change any of that? How many people would unsubscribe if they had to click through to read any posts that they were interested in? Hmmm.. I would love to get more comments and interaction, but since I am not advertising or making any money from the site, I really have nothing else to gain from more page views.

    Btw, I did try exactly what you suggest: floating the giant footer menu to the top and modifying the text to make it all gel.. You’re right, it didn’t look all that bad! ;)

[ Comments are closed for this post ]