1. Technology
Send to a Friend via Email

Your suggestion is on its way!

An email with a link to:


was emailed to:

Thanks for sharing About.com with others!

How to Create a Portfolio

Showcase Your Web Design Skils with a Portfolio


What is a Portfolio?

When most people think of a portfolio, they imagine an artist with a huge document case with samples of her work inside. When I was in art classes, I had a huge one that contained all of my best work as well as copies of my work in progress (you never know when you'll have the opportunity to start getting charcoal all over everything!). But for Web designers a portfolio is slightly different.

The basic aspects of a Web portfolio are:

  • Screen shots of your best work.
  • Descriptions of the work done on the projects.
  • Links to the live documents or copies.
  • Very rarely, color printouts of the projects.

Use Only Your Best Work in Your Web Portfolio

A Web portfolio is meant to show off your skills and talents to prospective employers. For this reason, you don't want to provide them with samples of low-quality work. Quantity is not quality. If you only have 3 sites that you're really proud of, then your portfolio should only have 3 sample sites.

Use your portfolio as an opportunity to brag. I like to explain both how a project was difficult as well as how I solved it. Don't be modest in a portfolio. But don't lie. If you worked with a team of designers to come up with the ground-breaking design concept - don't present it in your portfolio as all your own work. It's fine to use Web projects where you only worked on one aspect of the project, just be sure to clarify what you did.

Know Your Audience - Perhaps Create Multiple Portfolios

Web designers and developers often have to "wear different hats" to get their work done. But this can be very confusing in a portfolio. I divide my portfolio into sub-categories, which are something like mini-portfolios all to themselves. For example, I might have portfolio pieces on the following different aspects of my work:

  • Web programming
  • Web design
  • Writing and content creation
  • Content management

By separating them out into categories, I can direct prospects to the portfolio that best describes how my skills match their needs. So if I'm applying for a writing job, I point out my writing portfolio or if it's a JSP programming job, I point to my Web programming portfolio.

What to Include in Your Portfolio

The advantage to a Web portfolio is that you can include nearly anything in it that you can include in a Web page. Some key elements are:

  • A screen shot of the design.
    Even if you're highlighting the code you wrote, a screen shot is important to engage interest. But make sure that it's an excellent screen shot. If the designer did a bad job on the project, leaving off the picture will help your audience focus on the code.
  • A link to the working page.
    This can be the page live on the site it's still on, or better yet, a copy of the site on your own server (get permission from the owner before you do this). It's important, especially if you're highlighting dynamic elements or programming, that you have a working copy. I like to link to it on my own site whenever possible, so that if the original site changes or goes down, my portfolio isn't ruined.
  • A description of the work and your role in creating it.
    Many Web portfolios forget this step. They often hope that the work will "speak for itself," but it's often hard to tell what is special about a design just by glancing at it. If you were the first person to get rounded corners to work without images in IE 5, then say so in your description. By the time your audience sees the portfolio, rounded corners may be ubiquitous or IE 5 completely gone.

The Most Important Portfolio Element

As I said at the beginning of this article, the most important element of your portfolio is that it be of your best work. If you can't decide which items are your best work, ask a few friends to help you choose.

Why Not Get Started Today with Your Portfolio?

I have created a free Web template of the portfolio layout that I have used for my personal portfolio. Feel free to use or modify it to suit your own portfolio needs.

©2014 About.com. All rights reserved.