20 Sample Portfolio Websites to Inspire Yours (Tips & Tricks Included)

They say that clothes don’t make the man, but I would dare say online presence does make a successful professional in the modern business world. What better way to establish an online presence than an amazing portfolio website?

We present you with a bunch of actionable tips and tricks on how to create a great online portfolio, along with the 20 samples of inspiring website portfolios to steer you towards the right direction.

What are Portfolio Websites?

A portfolio has always been one of the best ways to showcase your work, but today, portfolio websites aren’t just simple collections of work samples.

website-portfolio-for-developers

They are a great way for you to show the world who you are, what kind of work you do, how you do it, what your future career goals are, and who you really want to work with.

Your website portfolio is the first impression you make in the world of online employment opportunities. When a potential client lands on your website, they don’t just expect to see a presentation of your previous works - they use it to form an opinion of you, both in terms of your personal traits and your professional qualifications.

What to Put on Your Portfolio

Custom logo and tagline

Not only will this make your portfolio website look good, it’ll also help you establish your brand, and maybe even show off a bit (especially if you’re a designer or a copywriter).

Original (or just really good) site design

It’s really important to have a clear and concise portfolio design, though it becomes even more important if you’re a web designer. An original design can really help you stand out from the crowd and grab your potential clients’ attention.

The design is vital, but what’s even more significant is usability. Ask yourself if your visitors can easily navigate your portfolio website and find all the information they need.

Relevant skills

There’s simply no wrong way to gain a skill. So, don’t be afraid to list skills acquired through formal education, online courses, previous work experience, volunteering, and so on. As long as they’re relevant to the services you offer and the jobs you wish to start landing.

Christ Thurman

Source: Chris Thurman

Education and certificates

Education can include both formal education (college classes) and different online or offline courses. Many online learning platforms allow you to integrate with LinkedIn and add certificates with just one click.

Previous projects and other relevant work experience

This is your place to shine - the ‘classic portfolio’ part of your portfolio website. You can list your previous work samples here, but again, as with everything else, try to stay relevant. With that in mind, nix all irrelevant projects and positions (like your McDonalds part-time job when you were 16).

A great thing about your online portfolio is that there are no rules to what you can add - it doesn’t necessarily have to be something you got paid for. So, you can add your personal side projects or coursework you completed during your studies.

Tip #1 - Edit yourself

Do not give in to the temptation to showcase everything you’ve ever done. Sometimes less is more, so try to create a mix of your best work. People don’t really have time to scroll through dozens of portfolio samples, which is why you should do your best to impress them with a select few.

Tip #2 - Keep it fresh

Every now and then it’s a good idea to selectively remove pieces that no longer fit your style or aren’t representative of your best work anymore. Also, you need to make sure that you’re updating your portfolio with fresh samples from your new projects, to show that you’re still relevant.

Bio/About me

Don’t be afraid to make it personal - after all, it’s YOUR portfolio website. Instead of just listing boring facts, you should tell stories, as they’re proven to be much more engaging.

About gummisig


 Source: gummisig

Photo of yourself

Putting a face to your portfolio will make you look more trustworthy to your potential clients. Although it doesn’t have to be a super-serious headshot in a suit and a tie, try to keep it relatively professional (no selfies, NSFW photos, or depictions of nightlife).

Easily-accessible contact info

When making a portfolio website, you want potential clients to contact you, right? So, don’t make it an obstacle course for them. You should make your email address and/or phone number easily-accessible.

Social media accounts

Feel free to add any relevant and active social media accounts. Acting as a resume itself, obviously a LinkedIn profile is a must. More and more job recruiters use LinkedIn nowadays to find talent.

In addition, you should consider establishing a presence on the popular industry-specific networks (for instance, Github for developers, or Behance and Dribble for designers). Once again, staying relevant is key. So, don’t include your Facebook and Instagram profiles if you’re not using them for work-related stuff. But, if it’s relevant, you can include those two, as well as Twitter, Tumblr, and so on.

Testimonials

Other people singing praises in your name just can’t do you wrong. Testimonials, reviews, or case studies are a great way to showcase the great work you’ve done for your clients. Ideally, those should be coming from well-known previous clients, but anybody satisfied with the work you’ve done for them will do just fine (but whatever you do, don’t do fake ones like in our mock example below).

testimonials

 

Recognition and awards

Have you earned any recognition or awards during your career? Your portfolio website is the place to brag - as long as it’s relevant to your field.

Blog

If done correctly, blogging can bring a lot of traffic (and potential clients) to your portfolio website. That’s why you should consider including a blog right on your online portfolio or maybe even use one of outside portfolio websites, such as Medium.

Of course, if you’re a creative writer or copywriter, your blog can at the same time be your portfolio.

Videos

New Call-to-actionOkay, contrary to the popular belief, not everybody’s a writer nowadays (though you can always hire one). But you can still find other ways to gain exposure, creating helpful videos and tutorials being one of the best ways to do so.

For example, a WP developer could create and post ‘how to’ videos, showing various WP-related tips and tricks.

 

CTA

If you’re looking to add an effective CTA to your portfolio website, you need to determine its main goal. Whether it to get new clients, to get a full-time position, to collaborate with other people on your own projects, or to simply expand your mailing list.

Once you’ve decided on your main goal, you should emphasize it through your call-to-action. CTA should lead your visitors to the next step, be it to “get a quote”, “view/download resume” or “hire me”.

If your goal is to generate leads, you should consider using online quizzes as one of the most potent but still relatively underrated means of doing so. Lewis Howes, a New York Times bestselling author, used LeadQuizzes on his personal website to grow his email list by 42%.

Lewis Howes LeadQuizzes 

Bonus Wisdom #1 - Google Yourself

Come on, admit it. You must’ve done it at least several times - googled your name just out of curiosity (or to find out if you have any famous doppelgangers).

If you haven’t done it yet, you should. In case you’re just starting out, you might not have enough social proof, but still, chances are you’ve been featured more than you realize. If you’ve been mentioned online in a positive light, no reason not to include it in your portfolio.

Google yourself and see what comes up. But be prepared for the worst as well - in case of any negative reviews or mentions, you might need to do some reputation management.

Bonus Wisdom #2 - Choose the Best Domain

As portfolio websites are all about first impressions, some considerable thought should be put in choosing the best possible domain. After all, in order to get to your website, potential clients need to click it or type it into the address bar. There are several extremely important things to consider when choosing a domain name: 

  • It should be short, memorable, and easy to spell
  • The brand name vs. personal name dilemma
  • Watch out for unexpected word combinations (while IT Scrap looks like a perfectly acceptable name for a recycling company, its domain itscrap.com sends a message they didn’t probably have in mind)

For some additional tips on how to choose a perfect domain for your portfolio website, check out this article.

Most Popular Portfolio Website Builders

  • Wix. A user-friendly and versatile website builder, with a huge database of more than 500 templates, 20+ of which are particularly specialized for portfolio websites. If you decide to use this platform to build your portfolio, you may want to learn more about how to make the most out of your Wix site.
  • Squarespace. The most popular platform among photographers and artists, as it enables them to create stunning and professional-looking portfolio websites for displaying their works of art. Here are some of the reasons why you should make your website on Squarespace.
  • Weebly. One of the easiest website builders, perfect for those not so tech-savvy. Clean and basic, perfect for simple and minimalistic portfolios.
  • Wordpress, Jimdo, Fabrik, Format, Behance, Dribble, and many others.

Wix Portfolio Templates 

Source: Wix Portfolio Website Templates

20+ Portfolio Website Samples 

1. Gary Le Masson - SEO consultant. He made his website portfolio look like Google search results, which is perfect for the clients he’s looking to attract - those who want to rank high in Google. 

Gary Le Masson


 
Source: Gary Le Masson 

2. Mark Wheeler - Art Director at Microsoft

3. James White, the founder of the Signalnoise Studio

Signalnoise
 

Source: Signalnoise Studio

 

4. Sanat Rath, Google UX designer for Docs, Sheets & Slides

5. Marc Thomas, Digital Designer and Front-End Developer 

Marc Thomas
 

Source: Marc Thomas

6. Kristi Hines - Business Blogger, Certified Content Marketer, Copywriter, Freelance Writer, Ghostwriter, Photographer

7. Colin Newcomer, Freelance Writer specializing in lead generation 

Colin Newcomer

 
Source: Colin Newcomer

 

8. Toy Fight

Toy Fight

 
Source: Toy Fight

9. Adam Hartwig - Squarespace Digital Designer and Developer

10. Laura Belgray, Copywriter 

Talking Shrimp

 
Source: Talking Shrimp

11. Emily Wiegand, Graphic Designer

Emily Wiegand

Source: Emily Wiegand

 

12. David Hellman - Bikes. Code. Design. Drinks. Photography.

13. Mike Kus - Branding, Graphic/Web Design, Illustration & Photography

14. Nine Lion Design

Nine Lion Design

Source: Nine Lion Design

15. Miki Mottes - Illustrator, Animator, Designer 

Miki Mottes

 
Source: Miki Mottes

 16. Vanity Claire - Art Director, Designer, Branding Expert 

Vanity Claire

Source: Vanity Claire

17. Daniel Spatzek - Freelance Designer and Art Director

18. Robby Leonardi - Illustrator, Animator, Designer. His interactive portfolio website is a combination of a resume and a video game.

Robby Leonardi 
Source: Robby Leonardi

19. John Green Books

20. Jessie Van - Product Designer

 New Call-to-action