Pro Blog Design

Better Looking Blogs Grow Faster

First time? Start here.

What Sarah Said What Sarah Said is a personal blog, belonging to Sarah of course. It was picked out of a CSS gallery to be this week's review candidate; a high quality candidate!

What Has Been Done Well?

  • Color. No-one will argue that the color scheme here isn't unique. The unusual combination looks great, and works perfectly. Getting this right has instantly made WSS memorable.
  • Fluid width. Few blogs use a fluid width design, and there are often good reasons not to. However, it's nice to see it every once in a while, especially on a blog with as little sidebar content as this one.
  • Logo. At first, I was a little miffed at the amount of space wasted in the top left, but you can't help but like the cheek of the little pop-out face. Very memorably design.
  • Typography. Typography on a fluid design with an offbeat color scheme isn't easy, but it has been done really well on What Sarah Said. Take a look and see.

What Could Be Improved?

  • Link styles and color. There are a few different colors used on text within the content. It's hard to tell which ones are actually links. Perhaps an underline? Beyond that, some of the links don't have rollover effects, which is a shame.
  • Post titles. The posts are well spaced out on the home page. The problem here was that I found myself consistently reading the dates before the titles. Does the date font need to be so big?
  • Fluid bugs. There is the odd bug or 2 in the fluid layout still to be ironed out. The two I noticed were that at a large resolution, the sidebar loses it's shape slightly, and at 1024x768, part of the "Site Info" link is pushed to a second line. They're not crucial, but such a good design deserves flawless coding.
  • Navigation. I know that it's a personal blog, but a little more help with the navigation would be nice. The Archives link is buried down in the footer. Why not put it in the sidebar as well? Or add a "Recently Posted" widget to the sidebar? It would give more incentive to read around the blog.

All in all, What Sarah Said is a very memorably designed blog. The unique color scheme, layout and logo are fantastic, and more than enough to make any design great.

With that said though, even a gorgeously designed blog such as this can still fall down in usability. Had this not been a personal blog, things like the poor navigation would have been a much bigger problem.

What do you think of it?

Discussion on This Article

  1. Sara
    December 1st at 10:58 pm GMT
    Comment #1

    Thank you so much for featuring What Sarah Said, it was a huge surprise to me (and a fantastic one, of course).
    Your suggestions are very useful - I'll definitely take them into account (although I can't figure out the sidebar problem, I've tried to fix it numerous times but I obviously failed :P ).
    It's an honor to receive such a good review so thanks again :)

  2. milo
    December 2nd at 1:09 am GMT
    Comment #2

    I like those colours, unusual but yet eyecatching and fluid width with validation; but what about an h1 image replacement CSS instead of the header div image?
    Just a thought...;)

  3. Deron Sizemore
    December 2nd at 1:33 am GMT
    Comment #3

    Great Review Michael. I actually featured Sarah's design in NiceStylesheet this past week and it's categorized under "My Favorites." :)

    Good work Sarah

  4. Michael Martin
    December 2nd at 12:26 pm GMT
    Comment #4

    Sara - No problem. I'm glad you liked it!

    Milo - I didn't check the coding, but your way would definitely be better semantics. :)

    Deron - Nice Stylesheet is where I found it! I should have linked the mention of a gallery up there back to you.

  5. Deron Sizemore
    December 2nd at 3:06 pm GMT
    Comment #5

    Oh, hehe. I didn't even put two and two together. :)

    No problem Michael, don't worry about the mention.

    Thanks

  6. Lynda Lehmann
    December 2nd at 8:10 pm GMT
    Comment #6

    I like it. It's not cluttered, and all the negative space works well. I think it's strength is its minimalism!

    And I agree with you that the color scheme is unique.

  7. Brad Nay
    December 3rd at 3:08 pm GMT
    Comment #7

    I think it looks great, Its simple and easy to read.

  8. Danny Outlaw
    December 3rd at 10:29 pm GMT
    Comment #8

    I like the coloring and typography used in the post. So many designer over look them. I suppose something extra could be done for links.

  9. Michael Martin
    December 3rd at 10:58 pm GMT
    Comment #9

    Lynda - I agree. There is an ample amount of empty space here, which is great. You get to read the blog. You don't have to put up with all the usual junk. :)

    Brad - Thanks for sharing. :)

    Danny - The color is probably my favorite aspect. It's fantastic, isn't it? :D

  10. milo
    December 3rd at 11:35 pm GMT
    Comment #10

    Helpful article for CSS image replacement method by Roger Johansson.

  11. Tay - Super Blogging
    December 5th at 3:41 am GMT
    Comment #11

    I like it a lot! The design IS very colorful and that stands out. Normally I don't like fluid designs at all but it suits this blog well. Thanks for featuring it - was a fresh change. :)

  12. Michael Martin
    December 6th at 1:41 pm GMT
    Comment #12

    Tay - It was a nice change for me too, getting to review a really great looking blog. :)

  13. Sumesh
    December 9th at 10:43 am GMT
    Comment #13

    I say, that's a good bit of design, and she seems to be quite CSSed ;)

    Michael, I see many are having problems with IE bugs, (so do I). So, can you write a series of posts, perhaps one per week, to fix the commonly encountered bugs?

    (since you're a designer, you must be encountering several bugs)

    Just a thought.....

    And what does it take to be featured here in a review? Commenting, design or something else?

  14. Michael Martin
    December 9th at 3:44 pm GMT
    Comment #14

    Sumesh - Sure thing, that sounds like a good idea. I'll have to think about how to approach it though (I don't advocate running a series of hacks and patches in your coding really! xD ), and which bugs are most commonly found. :)

    As for being reviewed, it's not about comments or anything; I just choose blogs that I have something to say about and that my readers might learn something from (E.g. Some weeks I choose very "normal" looking blogs, wheras this week, I'd been asked to pick out a nicer looking design :) )

Leave a Reply