13 Tips for Online Portfolio Website Design

Building a portfolio website? Here's how to make sure it's well-designed and client-ready.

portfolio 18 scaled

An effective portfolio is your most powerful marketing tool. Keyword there? Effective. If your portfolio doesn’t follow these tips, there’s a good chance it isn’t. The Internet has done something magnificent: it’s given creative professionals an unprecedented audience with which they can share their work. As a result, there are countless portfolios currently floating around the web. Unfortunately, a lot of them are far from effective.

While a well-designed online portfolio is the most powerful tool in any creative’s arsenal, a poorly-designed portfolio is just the opposite—it can drive clients away like nothing else. Don’t worry, that’s where we come in. Follow these twelve essential tips, and you’re sure to craft a beautiful online portfolio website that’ll wow even the most cynical of prospective clients.

portfolio-14

1. Design A Logo

There’s more to logo design than simply putting a circle around your name. By designing a logo that’s truly thoughtful, you won’t just make your portfolio look more professional, you’ll also come to understand yourself better as an artist—and you’ll gain insight into how others perceive your work. When you design your logo, ask yourself the following questions:

What’s the purpose of my brand?
Who’s my target audience?
How do people perceive my competition? How do I want to be perceived?
How am I different from my competitors? What makes me unique?

Answer those questions, and you’ll be well on your way to creating a logo that’s uniquely you.

portfolio-2

2. Don’t Take A Shotgun Approach (But Don’t Give Up, Either)

It can be very tempting to include every piece of artwork you’ve ever made in your portfolio—don’t. Everyone has some work that’s great, and other work that’s mediocre. But if you include your mediocre pieces alongside your best, people will be distracted from the awesome images.

Select your absolute best work, the images that make you think “wow” when you look at them. If you find yourself wondering whether or not an image is impactful, that means it probably isn’t. In that same vein, don’t be too hard on yourself. If it helps, try bringing in a friend and asking them which of your works are their favorite.

portfolio-3

3. Keep Confident

What are you trying to accomplish with this portfolio? Every word on your website should serve that goal. Trust in your talent, and avoid using passive language. If it helps, think of your website like a physical storefront. If a retail outlet advertised itself the way you advertise yourself, would you bother shopping there? If your answer is no, then you need to be more confident in your language. (But not too confident. Keep your voice personal and friendly, too.)

portfolio-7

4. Organize!

If you’re looking to get work as a designer, what’s the surest way to shoot yourself in the foot before even setting out? If you answered, “a sloppy, chaotic website,” then you’re right on the money. Your portfolio needs to be as straightforward and simple to navigate as possible for visitors. If they have to hunt around for images or information, you’re at risk of losing them to the competition.

Consider organizing your work in one of the following ways:
By genre, if you work in multiple genres.
By clients, if you work with high-profile people or businesses.
By project, if you do creative work exclusively.

portfolio-9

5. White Space Is Great, Emptiness Isn’t

How much work do you actually have? That’s a question you need to answer before choosing a template or layout for your portfolio. If your site looks empty or threadbare, or your work looks almost entirely absent, then it’s a sure sign you may have chosen the wrong theme.

Here’s a bit of advice to that end:
Horizontal scrolling works well if you’ve a small body of work.
Slideshows aren’t a bad idea either, for small to mid-sized portfolios.
Tiled themes are awesome for large portfolios, especially with vertical scrolling.

portfolio-20

6. Captions Add Context

Don’t underestimate the power of a good caption. There’s a story behind every image, after all, and a caption can tell that story, adding some much-needed context. They also allow you to give credit where credit’s due, and highlight other talent involved in your images.

portfolio-15

7. Spell Checkers Are Your Friend

I’ve seen far too many online portfolios rife with spelling and grammatical errors. It makes you look extremely unprofessional when your copy looks like you hammered it out in a few seconds with nary a second thought. Spell-check wherever you can (or better yet, have a writer friend look at your site for you).

portfolio-6

8. Mobility’s Great: Use It

It should go without saying, but with mobile devices now supplanting desktops as the primary browsers of choice, your portfolio’s alienating potential clients by not being mobile-friendly. Your portfolio needs to look good on anything with an Internet connection, no matter how big or small. A tall order, certainly, but one you need to meet if you’re to succeed.

portfolio-8

9. Know Your Clients

Many creative professionals have fooled themselves into thinking that, by showing a specialization, they’re boxing themselves in. The opposite is actually true—by showing a preference towards a particular work or highlighting a particular skill set, you attract the type of clients you really want to work with. Don’t be afraid to embrace what you’re best at, and to welcome the clients that are interested in those skills with open arms.

portfolio-19

10. Remember The Rule of Three

The old saying “third time’s the charm” exists for a reason. There’s just something about the number three that feels…right. Believe it or not, the reason for that is actually pretty simple: our brains process information by identifying patterns, and three is the smallest number possible in terms of pattern recognition.

Keep the rule of three in mind when ordering and organizing your portfolio—you might be surprised how well it works.

portfolio-4

11. Use The Right Theme

To be frank, there’s an overwhelming array of choices when it comes to choosing a theme for your portfolio—but there’s a comparatively narrow set of themes that will actually do your work justice. Think about the type of work you do, as well as how much work you’ve got to show off, who your clients are, and what they’re looking for. All of those details will inform the theme you ultimately settle on using.

The most important thing about your theme is that it meshes with your brand and its accompanying imagery.

portfolio-5

12. Tell A Story With Your About Page

Talk about yourself. Be honest, open, and humble. Use personal anecdotes, and paint a portrait of yourself with words. What would your friends and family say about you? What’s your greatest strength, and your biggest weakness? Anyone reading your About page should get the feeling that they know you—which will make them that much likelier to contact you.

portfolio-1

13. Don’t Forget Your Contact Details

This one’s pretty self-explanatory. Your contact information needs to be readily accessible to anyone visiting your site. If it’s not, you might as well not have a portfolio at all.

Looking for more portfolio inspiration? Check out our favorite portfolios from some of Format’s top designers, illustrators, and wedding photographers.

Contributor

  • icon black

    At Format, we are a passionate group of individuals at the intersection of technology and creativity, united by one purpose: helping photographers succeed. Our team is dedicated to providing photographers and creative artists with the tools and resources they need to share their work and grow their businesses.

A4 1 4

Unlock Your Creative Potential

Elevate your creative work with our exclusive starter package. Access invaluable insights, tools, and strategies to refine your craft, improve your skills, curate a stunning online portfolio, and advance your professional journey.

Name(Required)
Subscribe to the newsletter Field Label
This field is for validation purposes and should be left unchanged.
en_USEN