Freelancers, Here's How to Build a Portfolio Website (An Ultimate Guide)

how to build a portfolio website

When you work primarily online for clients around the world, how do you present yourself?

You need a hub where your best work is on display, where potential clients can review your credentials and reach out to you – a one-stop-shop to learn everything there is to know about you as a professional freelancer.

Enter the portfolio website.

Think of it simultaneously as your career landing page and an invaluable tool that may help you earn more work.

Rather than providing a list of your accomplishments, a portfolio website shows them in action. It tells the world, "Hey, I did this awesome thing – and this and this and THIS – and I can do more." 💪

If you're now asking yourself why you don't have a portfolio yet, you're in the right place.

Let's get into how to build a portfolio website, one you'll be happy to share with everyone, including clients, peers, employers, and even your mom.

How to Build a Portfolio Website: Table of Contents

How to Build a Portfolio Website from Scratch: Templates, Tools, and What to Include

1. Start with a Template for Personal Portfolio Websites (Free & Paid Recommendations)

2. Include Necessary Information and Pages

3. Showcase Your Best Work

4. Include Paid and Non-Paid Gigs

5. Present Your Value to Potential Clients/Employers Up-Front

6. Create a Simple Brand Logo

7. Keep It Fresh and Updated

Leveling Up: When to Build a Portfolio Website and Turn It into a Personal Brand

1. It's About Building Your Reputation

2. It's About Consistent Messaging

3. It's About Leveraging Your Experience and Authority

High-Level Portfolio Case Study: Content Hacker

3 Examples of Portfolios Turned into Personal Brand Websites

How to Build a Portfolio Website from Scratch: Templates, Tools, and What to Include

Ready to build that portfolio website? Start at the ground level.

1. Start with a Template for Personal Portfolio Websites

Before digging into building a portfolio website, you first need a web address and a tool to build your site. Each of the following providers offers basic hosting as well as templates and tools to get the job done:

Free Portfolio Website Providers:

  • WordPress – WordPress has both free and paid options for building a portfolio site. With its range of templates and sheer customizability, WP is perfect for any freelancer (designers, content strategists, marketers, writers, web developers, etc.).
  • Behance – Are you a freelance designer, artist, photographer, or creative? Behance is one of the most-used portfolio sites for showcasing everything from product design to UX.
  • Weebly – A free portfolio website on Weebly's platform includes a range of templates to choose from and a super-easy drag-and-drop website builder. Great for any type of freelancer who wants more options and customization for the look and feel of their online portfolio.
  • Wix – Another option for those who want to create their portfolio to their specifications, whether you want to code it or build it with Wix's website builder. A Wix portfolio is a good place to start if you are just beginning to build your client list.
  • Journo Portfolio – For freelance writers and journalists, Journo Portfolio allows you to collect your published work from around the web and showcase it all on one clean interface.

Paid Portfolio Website Providers:

  • Squarespace – If clean, minimalist design, as well as buildable pages (no HTML code required), are your thing, Squarespace offers affordable paid plans for your portfolio.
  • Strikingly – One of the simplest website builders out there. A good choice if you're not tech-inclined but want a professional-looking portfolio. A free option is available, but the limited paid option is worth it for more features.
  • Format – This website provider exclusively caters to people who need to build digital portfolios. The cheapest plan is $6/month with lots of features, and the templates are minimal, modern, and sleek. Format even offers a client portal with your website where they can proof and approve your work at a custom link.

Misc. Portfolio Website Alternatives

  • Google Docs – Really, really intimidated by the prospect of building your own site? Create a beautifully formatted Google Doc with your work examples, credentials, and testimonials. (Templates here. Look past the resumes – for example, the report templates would make nice portfolios!) Share the link and you're good to go.
  • Visualize.me – This isn't a portfolio website, but rather a tool to use to enhance your site. Wouldn't it be cool if you could create an infographic of your career, interests, and work experience? Enter Visualize.me.

How to Choose a Portfolio Website Template

Once you choose a provider, the fun part begins. It's time to choose the overall look and feel of your portfolio website with a designed template you can customize.

Most of the above providers offer templates specifically for portfolios, but you don't have to limit yourself to them. Think about the work you want to showcase and your objective for your portfolio website, and choose a template based on those considerations.

In general, make sure the template you choose has options for creating and formatting pages, including:

  • Feature images for displaying client work and projects
  • Text blocks for describing your work
  • The ability to add new pages as needed

Lastly, unless you plan to blog on your new portfolio website, steer clear of templates with a heavy focus on blogging.

2. Include Necessary Information and Pages

Some of the most important pieces of information on your portfolio website will not include your work.

Instead, your contact info, your social media links, and a solid bio are some of the most important pieces of the puzzle.

A few good places to include your necessary details:

  • On the homepage – Include a blurb about you, your social handles, and your email address.
  • On a separate contact page – Make a page dedicated to getting in touch with you! This is a perfect spot to include a form, which is super-easy to set up using one of the providers we mentioned above. The drag-and-drop website builders all will have options for inserting a contact form on your page. Don't forget to include your social links and email address here, too. Give prospective clients and employers every chance to contact you.
  • On your about page – Create a separate page with a professional headshot, a longer bio, and all your contact details.
  • In your website sidebar – If your portfolio website template includes a sidebar in the design, add your contact details there, too!

Remember, if somebody visits your portfolio and loves what they see, you need to give them the opportunity to take the next step and contact you. The more opportunities you provide (within reason), the easier it will be for that client/employer to hire you!

For example, check out the portfolio website of copywriter John Espirian. On his about page alone, he has three places within the copy where he offers his email address & social links. Note ALL of these instances are calls-to-action:

#1:

#2:

#3 (the static footer that appears on every page):

No matter where you are on John's website, he provides opportunities to learn more and connect with him. That's a key part of any online portfolio, no matter your industry or field.

3. Showcase Your Best Work

Even if you have a large back-catalog of client work, you shouldn't include every single piece you have ever worked on in your portfolio website.

Why?

Because potential clients or employers faced with sifting through your mountain of work will back away slowly. They don't have time to weed through everything you've ever done – they just want to see the best of what you've done.

Make it easy for them and only include your best samples. 5-7 is good. 10-15 is plenty. Anything more than 20-25 is really pushing it.

The exception: When your work spans various industries, fields, genres, or categories.

For example, on the following portfolio website, Jennifer Fernandez has showcased her writing in various digital publications by subject: design, travel, and lifestyle.

Another example: If you're a web developer with portfolio projects galore, whittle down your work to the stuff that makes you the proudest, then categorize them by client type or type of website.

In the end, always use common sense. Think of what clients and employers expect to see from someone in your line of work. Include the samples that show off your best work and your range of skills.

4. Include Paid and Non-Paid Gigs

"Your best work" doesn't just include gigs for which you were paid. Include non-paid work on your portfolio website, too, especially if you don't have a ton of work samples yet.

For example, say you took on a project for free just to get some experience under your belt. Or perhaps you did a friend or family member a favor and lent your expertise to help them. These are all fodder for your portfolio!

Present them as case studies, explain the problems you solved and the benefits your "clients" received, and include examples.

Just because you received no compensation for these jobs doesn't mean they weren't valuable experiences.

5. Present Your Value to Potential Clients/Employers Up-Front

This point can be summed up in a few words from a famous movie: "Show [them] the money!"

What does this mean?

Simply, show your potential clients or employers the value you bring to the table right up-front. Don't beat around the bush. Show them the money.

  • Tell them what you do and why they need you.
  • Explain the benefits of hiring you.
  • Show them the results you are able to achieve with your work.
  • Know your objectives for your portfolio; know your clients and what they're looking for in a freelancer.

For example, take a look at freelance writer Jay Crisp Crow's homepage for her copywriting business, Crisp Copy. Right off the bat, she tells you what she does and why you need her:

She writes "mouthwatering words that open hearts (and bank accounts)" and "crisp" copy (a play on her name) that's never stale.

In one fell swoop, she tells you what she does and why you need her. She shows you the money right away.

  • Similarly, think of your value in your profession and what you bring to clients who work with you.
  • Know backward and forward what clients who need your services are looking for in a freelancer.
  • Show them that money when describing your services or offerings on your portfolio website.

6. Create a Simple Brand Logo

To take your portfolio website from "run of the mill" to outstanding and unique, put a cherry on top – get a logo made with your name or brand name to stand out.

This doesn't have to be complicated. For instance, find a nice font you love that meshes well with your portfolio design (you can download tons of cool fonts for free – try 1001fonts or dafont.com). Then type up your name in that font in your image-editing app of choice.

Crop it, save it in different sizes. Put it everywhere: your portfolio, your business cards, your email signatures, you name it.

Done.

Great examples: Successful women like Marie Forleo and Amy Porterfield just use their name as their logo.

Another option: Hire a graphic designer from Fiverr or Cloud Peeps to design your logo. There are a ton of college students out there who need extra cash and experience. Find a designer with samples you love for the best results.

Another example: One of my students, Mariana Norton, has a clean yet professional logo that's simple and effective:

7. Keep It Fresh and Updated

Once you have a portfolio website up and running, don't let it gather dust in a forgotten corner of the internet. Instead, make sure you review it and update any outdated information regularly.

For instance, let's say you add various projects to your portfolio. You call it "done" and move on. BUT, your volume of work increases after that, so the work you did 6 months ago is no longer an accurate representation of what you can do or who you typically work with.

In this case, you might want to review your portfolio and update it every 3 months (quarterly) to ensure it accurately and fully represents your work.

On the other hand, maybe you are in a steady flow with work and always take on projects with similar clients. In this case, you should perhaps review your portfolio yearly and update it with new work as needed.

The point is, nobody's "best work" remains that way for long. The more projects you do, the more you'll evolve as a freelancer. You'll probably improve your workflow, tweak your style, or shift your client base over the course of your freelance career.

Your portfolio should always accurately reflect you as a professional, at this stage in your work life (whatever that looks like for you).

Remember, if it's out of date, it's no longer a tool you can use to get more work – instead, it becomes an archive.

Leveling Up: When to Build a Portfolio Website and Turn It into a Personal Brand

Let's shift gears and look toward your future as a freelancer (or, if you've been in the game and winning for a few years, your present).

When you have a steady stream of clients, when you start making enough money to not just live, but invest…

It's time to think about turning your free portfolio website into your personal brand platform.

1. It's About Building Your Reputation

Building a personal brand is all about taking your reputation sky-high.

As a freelancer, you've probably already built a name for yourself among your client base. Personal branding takes that foundation and elevates it so you won't just be known among your clients, but also generally in your industry or field.

That means other experts and pros will know you, and their audiences will know you (ideally, many of them will merge with your own audience).

The power of personal branding means you'll have the clout of a company while attaining the trust level of an individual. (According to Nielsen, 92% of people trust advice and recommendations from individuals, not companies.)

2. It's About Consistent Messaging

When you invest in personal branding, you invest in a consistent look, feel, and style for your communications across whichever channels you use.

Your portfolio website becomes your branded personal platform. Your social media accounts get a similar look and feel. Your posts (including blog posts) have the same tone, voice, and style, and if you use imagery, it all has the same vibe, colors, and personality.

This is HUGE for your business because consistent branding increases revenue by 23% on average (Lucidpress).

3. It's About Leveraging Your Experience and Authority

The contributing editor for Inc., John Brandon, made a salient point when he said: "Defining who you are is the most important differentiator you can make."

This differentiator is what you'll take with you as you build your personal brand. Most importantly, it will help you leverage your experience and authority as you create a name for yourself online, because both factors will be baked into what differentiates you from everyone else jostling for the same space.

What do you want to be known for? Who do you hope to reach? Your unique personal brand will answer these questions.

Finally, your personal brand is an opportunity to cash in on the years of experience and clout you've built over time. To understand what I mean, let's look at a personal example.

High-Level Portfolio Case Study: Content Hacker

When you have the budget for a higher-level portfolio, it's totally worth it. How do I know?

I did it myself.

Case in point: Content Hacker, my personal brand.

Before I launched Content Hacker, I had 8 years behind me working in the content marketing industry and running an agency. I wrote books, created a podcast, and blogged a LOT. I had all the necessary experience and had built a reputation before I approached building a personal brand. That made it easy to see it blossom right away.

First, I put in the work. Here are just a few of the pivotal steps I took to build out my personal brand:

  • I mapped out and leveraged connections to my agency, Express Writers.
  • I bought the domain for my personal brand name and even started the process to trademark it.
  • I keyword researched and ideated blog topics for launch that would eventually win rankings and traffic.
  • I made a commitment to creating long-form content.
  • I strategized list-building and created a meaty lead magnet.
  • I launched branded social media profiles for Content Hacker.

Some of the results from launching my personal brand website:

  • After a mere 2 months, we achieved a top 10 spot in the Google rankings.
  • After 3 months, we were ranking for 2,500 organic keywords, bringing in 345+ visitors monthly.
  • Finally, after mere months of going live, we have begun ranking for our focus keywords.

That's the power of leveraging your reputation and authority with content and pouring it into your personal brand. Down the road, once you have a steady stream of clients and have the opportunity to invest – invest in yourself!

3 Examples of Portfolios Turned into Personal Brand Websites

To round out this guide, here are some kick-a$$ examples of portfolios turned personal brand sites:

1. Tarzan Kay

As Tarzan Kay explains in her bio, she hustled for work for years before finally cashing in on her skills as a copywriter and launch strategist. She's a hyper example of how to turn a hard-working portfolio into a personal branding dream.

2. Proof Mango

Proof Mango is the personal brand of Monique, one of my Practical Content Strategy & Marketing Course students! She took her years proofreading educational content for the likes of Adobe and Microsoft and spun it into a unique brand and services.

3. Mariana Norton

As I mentioned earlier, Mariana Norton is one of my students. Her website is another prime example of leveraging a portfolio into a personal brand as a digital strategy consultant.

Don't Wait to Build Your Portfolio Website and Get Noticed

If you want to know how to build a web design portfolio, a writer portfolio, or even a web developer or computer science portfolio website, it's best to just dig in.

Don't wait until you feel confident in your website-building, portfolio-creating abilities. Just start.

Once you take those initial steps of finding a website provider, choosing a template, and picking from your work samples, it should fall into place pretty naturally.

Give yourself enough time to build a thoughtful, informative, cohesive portfolio website, and you'll be okay.

Best of all, once it's out in the world, you'll feel ready for whatever new work opportunity comes your way. You'll also have a better understanding of your body of work, your professional strengths, and where you could grow in your industry.

Win, win, win. 🏆🏆🏆

how to build a portfolio website

3 thoughts on “Freelancers, Here's How to Build a Portfolio Website (An Ultimate Guide)

  1. Nice post! The information you provided is very helpful if someone is planning to hire freelancers. I think Xpertin .com is a better platform to hire Freelancers.

Leave a Reply

Your email address will not be published. Required fields are marked *