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.

  • This post was written by Youri
  • Website: http://Designfeedr.com
  • About: About the author text goes here. Let's see if it shows up somehwere.
8 Comments RSS
  1. Reply Mark LuckieNo Gravatar said on July 29th, 2008

    Great tips and great portfolios. Check out 15 more portfolios here: http://tinyurl.com/5r87cn

  2. Reply Goran WebNo Gravatar said on July 30th, 2008

    Some really nice portfolios here. I Agree with your tips, especially when referring to flash and music!

  3. Reply YouriNo Gravatar said on July 30th, 2008

    Glad you guys like the post.

    @Mark : Good link, some nice work in there.

    @Goran : We can only hope people catch on so we don’t have to turn our music down for their site! (or we simply close the site;)

  4. Reply JamieNo Gravatar said on July 30th, 2008

    Thanks for the link!

  5. Reply YouriNo Gravatar said on July 30th, 2008

    Thanks for having a rocking port site;)

  6. Reply Max | Design ShardNo Gravatar said on July 30th, 2008

    i completly agree with all of that, can be quite hard to critique yor own work, always a good idea to get someone else to tell you as a second opinion who is in the same area of work.

    Max | Design Shard

  7. Reply ErikaNo Gravatar said on July 31st, 2008

    “Don’t use a splash page… EVER”

    Emphasis on the “ever,” for crying out loud. LOL.

  8. Reply ??????? ??? ??????No Gravatar said on August 4th, 2008

    Po moemu neploho!

What do you think?

  • The Harsh Future Of Web Design?
    The Harsh Future Of Web Design?

    I think we can all agree that design has been in a constant change since the burst of the Internet, however it seems that the direction of who is doing the designing has also chang...

  • 22 (New) Free High Quality Icons Sets
    22 (New) Free High Quality Icons Sets

    [digg-me] Icons are a staple of the design industry – every day new sets are being released into the world, most often with little to no attention. Today we are going to showcase...

  • 40+ Stunning Black And White Photographs
    40+ Stunning Black And White Photographs

    [digg-me] Color is beautiful, no doubt about it. In fact, here at Elite By Design we've shown off a lot of very neat galleries filled with bright and vibrant colors – but not tod...

  • Freebie - Kaleidoscope Circles Photoshop Brush Pack
    Freebie - Kaleidoscope Circles Photoshop Brush Pack

    Download the Kaleidoscope Circles Brush Pack Please do not repackage, redistribute or direct link to the download. If you would like to share these textures please link to this ...

  • Flash Hijacked - Let Our Soundcard Go!
    Flash Hijacked - Let Our Soundcard Go!

    So let’s start off with a disclaimer: This article is not in anyway intended to diminish the numerous, dynamic advancements that Flash has introduced into the design and developm...