10 Steps To A Better Portfolio Site

Web designers, illustrators, graphic designers or and other creatives have one thing in common these days. They all have a personal portfolio site where they showcase their work. Creatives always love working on their portfolio site since it’s the moment they can be client, designer and art director at the same time. While working on your dream project however it can be easy to forget that your online portfolio isn’t there for your personal pleasure, it’s an instrument crucial to your success. It’s this site that will significantly influence whether clients or employers will choose to work with you!

Because an online portfolio is such an important element of your success I thought it would be a good idea to use this guest post to talk about some good practices and some not so good ones. I’ve divided the tips into five do’s and five dont’s and added a mini showcase of great examples below.

The definite do’s

Here’s the list of things you should definitely consider when you’re building a new portfolio or updating your existing one.

• Make sure you test in other browsers
  Web professionals reading this will probably yawn out of boredom now but there are a lot of creatives that don’t specialize in the web yet do want to build their own site. This tip is for them. Test your site in the common browsers! I know when you’re just starting out with web design this is a hassle because you’ve already spent so much time with your site. Of course browsers interpreting css rules differently is a pain in the ass but it’s worth it to put in the extra hours. You’ll feel really silly when you find out a year after you’ve launched a site that it’s layout has been breaking in a particular browser all that time!
• Consider a one page portfolio if you have little to say
  If you really only want to showcase your work, have a small about me and your contact data a one page portfolio is probably the best way to go. This allows you to put all the relevant data on one page so you don’t get near empty pages (for example an about me with 5 lines of text). There is of course no reason why a one page portfolio isn’t possible if you have more to say, Dale Harris’s site is good proof of this.
• Make the right choices for animated elements
  If you want an animated element in your portfolio, like in your header for example, don’t go full flash. Just embed the animated Flash element in a normal Html/Css site and enjoy all the benefits that such a site has over full flash one (Search engine will find you better, better accessibility and so on). A good example of having the best of both worlds is Mike Poss’s site.
• Post your strongest work
  Don’t post your good portfolio pieces together with your lesser ones, be a harsh critic on yourself and select only the best work. If don’t have that many items in your portfolio don’t give into the temptation of churning out a lot of quick pieces, these will usually be lesser in quality. The lesser pieces will affect how your future clients view you in terms off overall quality. It is much more preferable to have a strong but small portfolio than a large one with a lot of mediocre work.
• If possible put your contact data on a spot that’s always visible
  This one is more important than you might think. When you’re applying for a job or communicate with busy company individuals it really helps your cause if they can spot your contact data in one glance. It also gives the impression that you’re “open” to do business.

The dont’s

The dont’s are arguably even more important than the do’s. Make the wrong design and coding decisions and you’ll be chasing visitors away instead of impressing them with your portfolio!

• Don’t over complicate
  Extravagant designs with a lot of elements can definitely be great, but only if you pull it off flawlessly. If it’s done wrong it becomes a confusing experience for the user no matter how good looking it is. If you want an intricate design try it, but be honest with yourself and know when to go for something simpler if your design is not working.
• Don’t use a splash screen – ever
  Designers like splash screens because it’s an extra chance to exhibit their skills at creating a cool visual. The logic seems sound, but trust me that in this day and age nobody’s waiting to get a non-functional screen between them and their content. A splash screen is a guaranteed loss of visitors.
• Do not use pop-ups for content
  Regularly I still see sites that open new browser windows for images. This is frustrating for you and your viewer. Your viewer will be stuck with another open browser window which he will have to close every time he wants to continue viewing your site. You on the other hand should be frustrated with the knowledge that pop-up blockers (Google toolbar has one built in) will stop your content from being displayed.

  Check out Lightbox, Slimbox and all the myriad of ways to showing images and videos on the same page through javascript as an alternative.

• Don’t use sound
  You want your site to be an experience and you want to express yourself, music is a good way to do this. I get you, I really do. However you don’t know what the circumstances are that your viewer is entering your website on. Maybe he or she is playing their favorite lounge track and your music will just disturb the vibe. Maybe it’s two in the morning and your viewer forgot to turn his speakers off – in for a shocker! Maybe your viewer just plain doesn’t like the music you chose? The fact is, most people search and race for the stop button on a site that has music playing. Use music on your site if the whole concept depends on it, otherwise skip it.
• Don’t build it if you’re not satisfied
  Sometimes when you’ve spent a lot of time on a design you’ll start getting itchy to build it. Resist this urge and only build when you’re satisfied. I made the same mistake with a site I recently launched and now I’ll soon have to recode a portion of it since it’s current state just doesn’t satisfy me. It’s always better to get your design right a hundred percent and then build it.

Mini showcase – some excellent portfolio sites

Below are some excellent personal portfolio sites that not only look great but also operate very well. You’ll find that a lot of the do’s and don’t apply to them.

Hope you enjoyed the article and have some food for thought when your next portfolio revision comes around! Feel free to post your opinions in the comments, I’ll be stopping by every once in a while to check them out.

About the author :
Youri is a Web designer, blogger, import magazine addict and hardcore gamer turned casual. Other than blogging on Designfeedr he also runs Tutorials we heart – the site that collects the best tutorials from all over the web.

For more web design tutorials check out the new tutorial site, The Tutorialist.