Like many designers, I can only go so long with a site design before I start getting the itch to have a new look. While I’m still tweaking here and there, it’s mostly complete- what do you think? (the screenshot is for the benefit of my subscribers of course)
I wanted to use the 960 Grid for this design, and looked around for a blank canvas theme built on the grid to save time. I found a pretty good one (only had to fight with it a little) in the 960bc theme. This was my first use of a framework and I’m totally sold on it. It makes everything SO much easier. If you haven’t tried using a grid system, check out this tutorial.
I used CSS sprites for the first time with this site for the navigation. Just like the grid system, I’m wondering what took me so long, as it’s relatively easy. I found this tutorial to be helpful. In case you’re not familiar with sprites, the basic principle is that you design one image and just adjust the background position as needed. For example, here’s one of my navigation images. I just adjust the background position by -38px on the hover state. I could have put the whole navigation in one image, but I thought I’d start out simple on my first try. For a more complex example, check out how Ryan Imel uses a large sprite very effectively in his site.
I’m using the media settings within WordPress to manage the homepage thumbnail sizes. I just set the thumbnail and medium settings to the size I needed and it automatically generates the sizes I need!
The font for headings, navigation and logo is a wonderful font called Museo- three of the weights are totally free! I used the AnyFont plugin so I could have the same font for my widget headings. The social media icons are by Function and I found them on MySocialButtons (where else?). Other plugins that are useful in the new design are :
GetTheImage – automatically generates thumbnails in the archive and articles pages)
Advanced Random Posts – after 2+ years of blogging there’s a lot of good content that can easily get buried.
FlexiQuote Rotator – to manage my testimonials
Tweet This – for the submission links to Twitter, etc below each post.
I’m still looking for some things to put in my sidebar on internal pages. Any suggestions? If you have any comments or suggestions, or find any problems I haven’t caught, please feel free to share in the comments.
Hi Randa,
Congratulations on your new design. I love it. Like you I’m always itching to redesign my site. But for now I opted to go for a minimalist look. Keep up the good work.
Raymond – I like your site! The minimal look really appeals to me.
Wow, Randa I had no idea you were working on a redesign.
I really like this layout and look. The thin latest post allows for a bigger feature of the other recent posts spot. I really think that works well. Nice job!
Brian – Thanks for stopping by and for your nice comment.
Randa,
What plugin are you using for your awesome reply to comments functions? I love how this works
I’m using a plugin called WP Ajax Edit Comments, but I think the reply function is just a part of the threaded comments actually.
The rotating quotes is a nice touch, Randa, and I couldn’t agree more about old content getting lost. Good idea for a little randomness.
David- yeah, it’s funny. I keep seeing posts in the Random section that even I’d forgotten about!
whoa, what a different look, Randa. Nice work and congrats with the launch of the new design. I admire your productivity!
Thanks for the write up on your new design, found some new resources for myself. Random testimonials and articles are definitely a handy touch. What are you using for the Sitemap?
Will you be also updating your favicon, from green to red?
My first impressions: lots of grey, the spacing between columns is a bit too tight, the line-height in pargraphs could be slightly increased. Really like how you’ve organized everything here, post thumbnails, use of Museo and icons, and a beautiful gradient at the top.
Thanks Vivien. Yes, I do need to update my favicon, thanks for the reminder. I agree about the spacing between columns. I wish there were just a little more breathing room in the grid. The site map uses the SRC Clean Archives Plugin.
Randa,
The randomness section is great. Old content does get lost very easily. People usually only look at the recent articles because there the easiest to find.
The redesign is great. It’s very easy to navigate and clutter free.
ya..last week I visited your site.. there is something different on your design.. simple but ‘eye catching..’ congratulation…!
Your new design looks great – but it looks little dull with the grey backgrounds, when compared to your old design.
This design will be the inspiration for a work I’m going to do.
Congratulation!
Mauro.
tuProgramador.com
Love the re-design and thanks for the resources too. You’ve made me want to investigate grid layouts.
Ideas for the side? Maybe give the client quotes more room with more line spacing?
I am actually going through the same thing. I think after a year with the theme I designed it’s time for a change. A new look is exactly what the doctor ordered.
I am creating the style sheet and wireframe and hope to have it in beta by the 4th of July.
Love it! Just amazing how you put it all together, really slick, and the theme is so YOU!
This has opened a can of worms for me, I’m very impressed with the 960 grid. I was only thinking the other day about the potential benefit of something like this.
Also based on your post looked into CSS Sprites. Another very interesting way of doing things. Two things to consider when doing my next site.
Also, Like the design very much!
I must say I like this new design. Currently I”m restyling my own websites but haven’t found it easy yet because of this new template and buildingsystem I’m using.
Looks great Randa! Thanks for the details about your development process.
Can’t think of any new links for your internal sidebars – the site design is beautiful. Anything more would almost feel cluttered, in my opinion. I like it as it stands – very “web 2.0″ (to be horribly cliche).
Let the design sink in! I find that web developers/designers stare at their sites just a wee bit too much during the startup phase; it might seem plain/boring to you, but that’s because perfectionists tend to obsess about their projects. I had a neighbor who was meticulous about her garden – she nurtured it on a daily basis, and as she grew older, it slowly became more cluttered as she began pouring more and more into it. Now, being her personal hobby, I can’t criticize her – to each their own – but the concept carries weight: she was passionate about it to the point that she may have added TOO much, at least for the casual onlooker. To her, it was refreshing and new, but it was messy from the outside looking in.
Again, gorgeous design.
Randa, a bravo to you here, as this re-design is even better than the previous one! Hopefully, you’ll bring more surprise to us.
Congrats for your new design. I really like all your designs and this one is awesome.
Great looking designs..how many hours does an average design take to complete for you?
It’s hard to say – every design is different.
Even if we had the worlds greatest painting on the wall we get tired of looking at it. Change even for the worse feels fun.