Advertisement

Elements of a Great Web Design Portfolio

by

This Cyber Monday Tuts+ courses will be reduced to just $3 (usually $15). Don't miss out.

It's sad to say, but a lot of designers neglect their own portfolio sites. They spend all of their time working on client projects rather than their own business (which is admirable, for sure). The problem with that is that they're likely losing business, and potentially losing out on some of the best clients they might have.

Your portfolio is a reflection of your business. It's a reflection of who you are as a designer. And it's the first thing a lot of your potential clients are going to see. Make sure that what they're seeing is giving the impression you want to give them. That means pay attention to details, keep things updated, and put your best foot forward.

Here are some more elements you should consider when creating your portfolio site:


Prominent Showcase of Your Work

This is one of those things that should be a given, but so many sites really miss the mark. The entire point of a portfolio site is to show off your work. You want to entice potential clients with your design skills, and to do that, they need to actually see your designs. So make sure links to your work are prominent.

Don't just show off one or two pieces on the front page and then make it nearly impossible to find the rest of your work. Make sure that the link to your work is the most prominent thing your visitors will see. That's why they're at your site in the first place.

VolumeOne's website is a great example of putting the focus squarely on your work:


Put the focus squarely on your work

A Selection of Your Best Work

On a similar note, nothing says you have to showcase every single piece of design work you've ever done in your portfolio. In fact, you should do exactly the opposite. Hand-pick the best work you've done, and leave the rest out.

We've all had projects where the client's vision and our own creative sensibilities didn't match up, and the result wasn't exactly something we were proud of. So why on earth would you show it off to your potential clients? All that's going to do is attract more clients who aren't in line with your own creative preferences (if it attracts any clients at all). You want to showcase the work you've done that's in line with the kind of work you want to do more of in the future.

Denise Chandler only showcases a handful of designs on her site, but it's enough to give prospective clients a good idea of what she can do.


Denise Chandler only showcases a handful of designs on her site

A Call to Action and Easy-to-Find Contact Info

For most designers, the entire point of a portfolio site is to get more clients. So why would you make it hard for those potential clients to actually get in touch with you? Your contact information needs to be easy enough to find that your visitors barely even have to think about it. If it's not immediately apparent where your contact page is, they may give up and go elsewhere, especially if they're soliciting bids from multiple designers.

Along the same lines is a prominent call to action. You want your visitors to take a specific action, such as requesting a proposal, so why not just ask them to do so? Instead of a simple contact form, make a prominent button for them to click to get a quote or a proposal. Have that link to a specialized form that will give you the information you need to proceed further, rather than a simple contact form. Don't be shy about asking your visitors to do what you want them to do. They're on your site for a reason, and there's nothing wrong with acknowledging that.

Vector Stories has a prominent call to action "Let's get started, Hire me!" right at the top of the home page.


Vector Stories has a prominent call to action

A Unified Brand

You need to think of yourself as a brand. Now, that doesn't mean you need to follow all of the "branding gurus" out there who tell you that you have to completely live your brand, but it does mean you need to present a unified front to the world. That means consistency is key.

You need to present a unified front to the world.

In relation to your portfolio, that means you should have a logo and tagline, and should probably repeat those on your other professional profiles on social media sites. You might further expand this to include a particular color scheme or other visual indicators that are always associated with you and your brand.

The main reasoning behind having a unified brand is that it makes you appear more professional. It puts you on the same level as large design studios, at least in the eyes of many clients, even if you're just a one-person business working out of a corner of your dining room. When you have a logo and a "business" image, you'll be taken more seriously as a professional. You'll no longer just be that guy with a home office and a copy of Photoshop; you'll be a professional designer who can charge professional rates.

At the same time, don't be afraid to be yourself. A lot of clients would prefer to work with a solo designer rather than a big studio because they like the personal attention. And it's entirely possible that you'll land a client because you have something in common, even if it's unrelated to your design work. But the key is to purposely cultivate your image and your brand, rather than letting it happen haphazardly.

One thing that can really help you establish a "brand" is a great tagline. A lot of designers, whether they're independent freelancers or a large studio, come to be known by their tagline. Plus, when a visitor lands on your site, a prominent, memorable tagline can give them an instant indication of who you are and what you do.

Hype Nation has fantastic branding, even taking their color scheme right into their portfolio (you'll have to click on each design to see the actual color scheme of the client site), and they have a straight-forward tagline that tells visitors exactly what they do.


Hype Nation has fantastic branding

Social Media Integration

Social media is a fact of life for most web workers, whether we like it or not. And some clients are likely researching you via various social media sites, whether you want them to or not. So make things easier by linking your professional accounts to your portfolio site. Include links to Twitter, Google+, a Facebook page, LinkedIn, or any other professional profiles you might have.

Using icons for your accounts is a great way to integrate them. Another option is to import your Twitter or other feed directly onto your site. However you choose to do so, it's important to make sure that whatever accounts you're linking to are ones that represent you well professionally. Be wary of linking to accounts where you discuss personal things or where you aren't willing to friend a potential client (like a personal Facebook profile).

If you're not a one-person studio, you should have dedicated accounts for the business set up for social media, or you should link to the accounts of whoever your primary spokesperson for the company is. This might be the most well-known designer, or simply the person who is most passionate about sharing great content via social media.

Nudge Design proves you don't have to have a ton of social media links to properly showcase them on your site. In fact, sometimes only one or two links makes more sense and lets you better focus your efforts.


Sometimes only one or two links makes more sense

Not Too Showy

Your portfolio should show off your design skills, both in its content and the design itself. But it can be tempting for a designer to create a portfolio site that is too "showy" and doesn't have enough substance. Granted, your portfolio should be as well-designed as any client project, but there's something to be said for a site that is simple, clean, and especially easy to navigate.

Depending on who your ideal client is, you may want to make your portfolio more or less artistic. If your ideal clients are other creatives, then you may want to go with a more artsy, creative profile design that's a little more off-the-wall or experimental. On the other hand, if you specialize in websites for lawyers, accountants, financial professionals, or similar "conservative" professions, you'll likely want your portfolio site to echo the types of sites you'll be designing.

The Pixelhaven site is beautifully designed, but it's also very simple and not at all "flashy". It's going to appeal to a wide demographic.


The Pixelhaven site is going to appeal to a wide demographic

No Marketing-ese

This is probably the most annoying thing to come across on any designer's website. If your copy sounds like something out of Dilbert, you need to rewrite it. You want your site's text to sound like something you actually wrote, not something written by some marketing monkeys who know nothing about web design.

Now, that doesn't mean you can't hire a copywriter to help you create compelling copy for your site if you're not comfortable writing it yourself. But make sure you hire someone who writes in a style that fits with your personality and sounds like something you'd actually like to read, not something that's pushing for the hard sell.

A portfolio should be personal to a large extent, and overdone marketing terminology is the quickest way to make your portfolio impersonal. It's also often associated with website farms, made up of so-called "designers" who do nothing more than change a couple elements on a template and slap their customer's logo on it and call it a "custom" design. That's the last thing you want to be associated with!

Electric Pulp's website has a very professional look and style, but their copy is completely relatable and unique. It's a great example of how even a portfolio site that needs to appeal to corporate types doesn't have to resort to unreadable language that no one even understands.


Completely relatable and unique copy

Twelve More Examples of Great Portfolios

Ian James Cox

This site has a clear call-to-action ("Hire me") and good social media integration.


MindBorn

MindBorn has a creative design while maintaining usability and easy navigation.


Christopher Scott

A clean design with clear links to view the designer's work or resume.


Colin Grist

A very nice site with a clear brand and prominent social media links.


A Little Bit of Something

The attitude on this site definitely sets it apart from the competition. While it's certainly going to turn off a lot of potential clients, it's also going to be a huge draw for others. The designer knows who his ideal client is and is going after them without worrying about alienating others.


Henry Brown

A simple site with prominent work samples, social media integration, and easy to find contact information.


Webteam at Furness Internet

A well-designed portfolio site with a good call to action and prominently showcased work.


Brian Wilkins

Brian Wilkins' site is clean and modern, like the websites he creates for clients.


Deda

This site really conveys the personality of the designer, while remaining professional. It's relateable and obviously targets a certain kind of clientele.


1Minus1

This site is fun and creative, while also maintaining a very professional look. It's tough to balance both, but it's done really well here.


Sparkling Milk

A professional but fun site with a well-defined theme throughout.


Ice Lab

A creative site with a great call to action and great social media integration. Their copy is friendly and inviting, very conversational in tone.

Advertisement