Sometimes I Design Blogs.

Over the weekend I put the finishing touches on Heather's {from The Life Unexpected} blog design.  And hesitantly, I sent her the test-site and to my surprise she gave me the thumbs up to install it live.  Phew!

But - let's back up a second.  Why am I designing someones blog?  Well do you remember back in April when Lauren from Our Crazy Ever After was giving away a free blog makeover?  A free blog makeover from yours truly?  Well Heather was one of two winners.  {The other blog I made over was The Dashboard Diary}

When Heather and I first started corresponding over e-mail, she stated "I am not afraid of colour!" My first initial thought was probably some sort of profanity.  That looks a like this 'F@&#' You see - I AM afraid of colour.  I do like colour - but I don't know how to design with it.  I like to stick to simple.  To easy.  So I instantly doubted that I would be able to pull something together that she would love.  The colour scheme she requested was yellow, grey and black.  OH NO - the dreaded yellow!!  How do you make yellow look subtle - but pop at the same time?  I definitely had my work cut out for me.  And with three revisions from my original mock up later - I came up with this colour and font scheme.

Why did I use two similar cursive fonts?  Well simple - I couldn't find a free web safe version of the Contribute font I used in the header {if you know where to locate one I will thank you in mini eggs}.  So I searched Google Web Fonts in hopes to find one that was similar.  I think I did a pretty good job with matching it with the Rochester font.  Agree with me please!  Thank you. 

For the colour scheme I borrowed one called 'You Are My Sunshine' that I found on The Perfect Palette. {Side note - I used to live on that site when I was in the early stages of planning our wedding} but I added in some black and lightened the greys a bit.   

And here is how the  final design turned out. {click the image to go visit Heather's blog to see it in full force}.

I am not going to lie - I am kind of proud of this design.  Not only because I think I did an alright job with the design  and the COLOUR- but because of all the hard work that is behind the graphics and layout.  Yes it's true - I coded my little nerd heart out.  I even stayed up to 4:30 a.m. on a Friday - nose deep in CSS.  If this isn't nerd status - I don't know what is.  At least I know Katie would hang out with me.

Here are some of the elements that I am proud about from this design.

1. The squiggly line.  The squiggly line my husband repeatedly told me to take out.  I am glad I didn't.  It adds some flair to the header filling up some of the white space - yet still leaving it open enough to not look too cluttered.  Oh - and I embraced my Illustrator pen tool. So I sort of felt as attached to it as the letter D.

2. The background Flower Burst.  It's fixed. And since Heather wanted colour and I have such a hard time with backgrounds - I coded the background to scroll with the page.  This way the flower comes with you.  Adding that little burst of colour anywhere you are. 

3.  The Navigation Bar.  I really like it's location.  I also like that it's simple - home, about, and contact.  No fuss no muss.  {I said that to my husband the other day and he thinks it isn't a phrase - I Googled it and turns out it's a common phrase from the 60's and 70's - yep I am old too} I also figured out how to unlock the header and how to add more widgets.  It was a big day.

4. The Social Media Sprite.  Eppppp!!! {I just said that} - this is my favourite part of this design.  It seriously took me 5+ hours to figure out how to make this work.  But I did it.  And it works.  Thanks to Katie {again!} - this girl is getting a lifetime shipment of mini eggs. {I must be craving mini eggs}.

5. The Widget Title Bar.  Normally what I do {or should I say did?} is individually design a widget title for each widget {I hate the word widget}.  But, but, but not this time - this time I did some magic with some CSS coding and viola - now any time Heather adds a new widget to her blog - the widget title will magically appear.  This was also a glorious moment.  Cyber fist bump to anyone who is willing.

I now have 5 blog redesigns {including my own} under my belt.  And three more in the works.  I think after those are completed - I will have the skillz to redesign my space and blow all your minds up.  {just kidding - I am not really that confident}.

So what do you think - honestly?  I can take it. 


  1. Not even kidding, seeing this makes me SO much more excited about my blog makeover!! I love that you didn't take out the squiggly line!
    And GENIUS about the widget code! I always wondered how that worked with bloggers that didn't do their own design.
    FIVE blog designs?! Busy lady!! GO you!!
    You truly have a talent, miss!
    Oh and this makes me not want pics in my header. Ha. only the monsters in there somewhere.
    So excited!!

  2. Love it!! This looks great!!

  3. wow this looks great!! I am DESPERATE to know how to makes my social media buttons pretty!! I don't know much about coding except what I have learnt in my travels and reading a HTML book in my younger days but most willing to learn!! looking forward to seeing your next one :)

  4. Hello!! Kristen here from MamaWinkle's Blog! Just popping in to get familiar with your blog, say hello, follow (of course), and politely as that you please return the favor? :) That would totally rock my socks off! Thanks!!

    Have a great week!!


  5. Love it! They both look great :)
    You're awesome!

  6. Your layouts are amazing. I wish I had your skills.

  7. I'm definitely impressed!! I really love how it turned out and I'm wishing I had some free time to work on my design/coding skills. I really love your social button sprite and the widget header - that stuff is mad impressive! I cannot wait to see what you come up with next!

  8. This looks so beautiful! I love it, and am actually kind of jealous! Ha! You're so talanted. My favorite parts are the header, and the flowers on the side. Great job!


  9. I think it looks great! It's definitely your style, but still original for her blog. I really like the background, with the flowers but being simple, too- it adds some jazz without clutter. The navigation bar is GREAT- an unusual, but still tidy and easy to find spot! Way to brave the colors, too- I love the yellow!! Great job!

  10. Love that design. It's classy and pretty. I'm a fan of the flowers and the large profile pic. Following you from the GFC hop. Thanks for joining us today.

  11. You go girl! I love seeing the designs that you come up with, keep up the good work!

  12. I LOVE IT! Great job, girl! Super impressed. Love the links at the top right and the squiggly line :)

  13. Sometimes you design blogs, and...


    You did such a great job, Emily!

  14. Great job Emily!!! I'm jealous of your skills and that you know how to do all of this! You should be proud. I love the color and definitely love the squiggly line.

  15. I wish I could find the font you needed because I REALLY love mini eggs! Glad I found your blog - Yay for Tango Tuesday!

  16. WOW! You did such a great job! I badly want to get into web/blog design and I love reading and seeing work from others! I'm only just learning HTML so I have a long way to go. This is super inspiring-you did great!

  17. Yay Emily!! I'm so proud of you for figuring out the sprite code.. seriously, it makes a world of difference on the blog! I obsessively check social networking icons to see if they are sprites.

    I also have a vertical sprite code template if you need it! (like how your SN icons are now on your blog.)

    p.s. I found cadbury mini-eggs on the island last week!! They were at a pharmacy in the capital city called "Jolly's." They converted to about $8US but I took the plunge & am rationing them for the next month :)

  18. Ohmystars. You are too a blog designer! Look at you!! IMpressive, girl!! I love it! :) :)

  19. New follower from the GFC blog hop!

    This looks amazing and you're quite talented! I wish I knew more about how all that stuff works!


  20. LOve it...i love grey and yellow too..it looks awesome..

    I am trying to makeover my blog all on my own...its KILLING me..

    GRRR...good for you figuring it out on your own..

    I may have to hire you before I loose my mind

  21. Thanks for linking up at the GFC Blog Hop today!!

  22. Wow! That looks beautiful! Great job! I'll give ya a cyber fist-bump. *pow* Glad to have found you through the GFC hop. :)

  23. You did a great job, Em! I always love your designs - clean and simple.

  24. I think this designed turned out AWESOME!! You got some sweet skills girl. :)

  25. I love this design!! Now I have blog envy! lol Thanks for linking up with the blog hop!!

    Rachel (co-host)

  26. My blog just got a makeover too! I love your design. Very cool! Newest GFC follower from hop. Love for you to stop by and return the follow when you can. Hosting a facebook hop now. Love to have you!


  27. the squiggly line is my FAVORITE. :) Great job!!

  28. you did a great job! love the sprites!!!! they are hard but so worth the effort :) plus i'm sure it get easier once you get over the initial 5 hour hump :P


Thanks for dropping by Hope Squared. If you like the things I have to say - I would love to read what you have to say.