Website Makeover: Photoshop Layouts (Part Three)

Back to working on my website redesign this week and I feel like I am on a good path. Yesterday Brian over at The Design Cubicle posted “Anatomy of a Successful Graphic Designer’s Website” which goes over some of the essential pieces to having an effective website for graphic designers and I am happy that I had thought of all the parts he highlighted! It’s a great post and I’d even add it to last weeks list of “Website ReDesign Recommended Reading” – check it out.

The Homepage

I did pretty much stick to the original layout established in Part2 of this series where I did preliminary sketching and wireframing. A lot of times, even if I plan out a design on paper – once I get started pushing pixels around on the screen I’ll end up coming up with a whole new idea (which I think is pretty normal.) I basically took the layout I sketched and polished it up a bit. Worked off the 960 Grid and focused on keeping this page full of good information while still being concise and uncluttered. (Rollover designs to view grid overlay.)


My about page will gather my bio, some client testimonials/client list and a drill-down of services CMD+Shift Design offers. My goal for this page is to offer useful and interesting information while keeping it in bite-size easy to digest portions that are going to be quick to consume.


In the interest of keeping things concise — I am working on the idea of forgoing a seperate page for the contact form and making it viewable from anywhere on the site using something like this. I’ve designed it in a way that it doesn’t interfere with any of the content and blends into the design.

This solution will be simple to implement, but it’s effect makes the site seem just a touch more “fancy” and I can get rid of the page with nothing but a lonely form on it.


The blog redesign is really a whole other project. My blog has to fit in with the entire sites design and while I want it to flow as just another page on the site – I also do not want to appear as “just another page” on the site. (if this makes any sense at all?) My blog tends to get a different audience than my portfolio site, while there is somewhat of a crossover, my blog is mainly frequented by fellow design/devs, freelancers, and other creatives while those reading my bio and perusing my portfolio tend to be those interested in hiring a creative.

This in mind – I am giving my blog a bit more of a personal flare and I hope to make sharing the content as easy for readers as possible. I want to promote more interaction, cause really – that’s what makes blogging fun! As a little experiment, I took some time this weekend and restyled my comment form – feel free to give some feedback on the new look!

*portfolio page designed but not included in post.

Next time on Website Makeover Edition

So… since I’m opening up my process to all of you, I’d be great to get any feedback you have!

Subscribe to this blog to be notified when I post Website Makeover Edition Part Four, where I’ll start coding it up! :)


Comments are closed.