Design A Portfolio Website That Lands You Clients: The Ultimate Guide

The goal of any portfolio site is to sell your work to potential clients. That means you need a killer layout that’s easy to use & helps sell your work for you.

In the past we’ve covered plenty of great portfolio sites2020年欧洲杯时间表 mostly as inspiration galleries.

But for this post I want to share some tangible design tips you can apply to your portfolio. If you follow some of these tips to update your layout they’re sure to increase engagement and encourage more clients to reach out for quotes.

2020年欧洲杯时间表Whether you’re a writer, designer, artist, coder or anything else, this post can help you build a rockstar portfolio site that’ll rock the socks off your clients.

Showcase Your Work(And Do It Fast!)

Quality of work is huge in freelancing. This should be a no-brainer when it comes to portfolio design regardless of what you do.

You want your work front and center, especially on the homepage, because your work is what sells.

Granted a personal portfolio is also about selling yourself to the client. So it’s a good idea to have some personal info if the site is just about you(as opposed to a company).

But the one thing I hate is landing on a portfolio site and having no idea what the person does. Are they a programmer? Do they specialize in IT/server management? Do they handle social media marketing?

2020年欧洲杯时间表Clarify what you do right away to remove all that guesswork.

2020年欧洲杯时间表The portfolio of is a fine example of showcasing work on the homepage.

Right from the first pageload you know it’s a personal website based on the header. But his gallery is what really sells the work with big thumbnail images littering the page.

If you hover any of the thumbnails you’ll get a preview with more project info. This is very helpful to clients who want to quickly browse over your work and see if it fits with their projects.

I also like the use of minimalism in this design. It’s a staple for many personal portfolios and it removes all unnecessary elements to place focus where it belongs: on the work.

Another nice example of a focused portfolio layout is the homepage of website.

2020年欧洲杯时间表Again the header is short but sweet offering just enough to explain the website.

2020年欧洲杯时间表But the real big ticket item is the homepage gallery organized into a structured grid. Clients can quickly browse over his work to see what he does, the quality, and if his work may deliver on what they need.

Sometimes the work you do just won’t fit with prospective clients. That’s OK.

You wouldn’t wanna waste any time on a project you couldn’t do, or have clients wasting their time looking for a perfect fit. That’s why showing off your best work right away is key.

It helps develop trust and clarity for exactly what you do. And it encourages clients to dig deeper into your work if they like what they see.

Sell With Visuals

2020年欧洲杯时间表There are some freelance jobs that just don’t work so well using visuals.

A couple examples off the top of my head are writers and coders. But there’s no doubt that images than words so any graphics you can add to your site will help.

If you already do visual work then you won’t have any trouble setting up a thumbnail gallery to show off your stuff. A few sample careers where this works well:

  • Photography
  • Digital art/illustration
  • Icon design
  • UI/UX design

The difference for writers and coders is figuring out what to show.

If you’ve written some e-books could you show the covers for those? If you’ve built some cool webapps in PHP/MySQL could you show screenshots?

Get creative and find ways to improve your site beyond static text. This doesn’t even have to be work related!

The homepage of is a fantastic example. It features a strong graphic in the header with a purple-colored Jenga type board icon.

It’s a memorable graphic and helps improve the branding on the site. However this isn’t related directly to project work, so it’s an interesting example of what you can do with some ingenuity.

Same goes for and her colorful portfolio site.

Gradients, icons, font choices, and background photos litter the landscape of her homepage.

This is one case where minimalism really isn’t needed. The graphics add a very unique style into the page and they stay consistent2020年欧洲杯时间表 throughout the entire website.

Look for ways to add subtle graphics into your layout. Even if those graphics are just personal photos or small branded icons. You’ll be surprised how much of a difference they can make.

Design With A Personal Touch

2020年欧洲杯时间表This tip usually works best on portfolio sites for individuals or smaller companies.

2020年欧洲杯时间表Sometimes I do see personal features on larger corporate portfolios but they work best for smaller companies. Think background photos of the company office or videos of the team hard at work.

But no matter what you do or how large(or small) your company is, people pay to work with people. That’s why as much as you sell your work, you also need to sell yourself.

The background image on is a nice example. Anyone can pay a few hundred bucks for a similar photo shoot and you get those photos for life.

This means you can a design large hero header2020年欧洲杯时间表 to grab attention and sell yourself, then forge ahead into your work as you build the rest of the page.

Another great example is .

This one I like even more because background videos really grab attention.

They’re so dynamic and true-to-life so people get to see you as a real human being.

Granted not everyone can capture video of themselves or setup the background video properly(aside from frontend devs). But I think it’s worth a try if you have the time.

There’s also plenty you can do with just a simple photograph of yourself. has one small photo in his header mixed into the darker background.

A clean photo that works right into the layout with ease. The rest of the page is all about his work and reaching out, but that one photo adds a personal touch that radically affects the site’s design.

Make It Easy To Reach Out

2020年欧洲杯时间表Every website is built with a purpose. Blogs are meant to be consumed. Landing pages want visitors to buy something or sign up to something.

2020年欧洲杯时间表And portfolio websites are built to land new clients. So how do you do that?

2020年欧洲杯时间表By encouraging contact!

Design your site in a way that anyone could reach you with ease. This can be with any medium: phone, email, Skype, in-person meeting, whatever.

You achieve this on your site with clear contact details or a clear way to contact you.

doesn’t have anything too flashy but their “contact us” link is designed to stand out in the header. It’s also right next to all their social media accounts so you can quickly get in touch with just a few clicks.

Sometimes you’ll want to add a contact form right into your homepage. Other times this can feel like overkill and kind of a hard sell.

2020年欧洲杯时间表Instead I recommend designing a contact link that stands out & leads to a very clear contact page. Much like the design on .

Basically no distractions or anything here beyond the main contact form.

Not to mention it’s only three fields! Shorter forms are way easier to fill out so you’re much more likely to get an email if people only need to fill in a couple fields.

2020年欧洲杯时间表The other alternative is to not even include a contact form. You can opt to use a plaintext email address and link it right from your site instead.

Granted this provides little-to-no protection from spam, but it may work better for some clients who don’t want reach out through a contact form.

On portfolio you’ll notice there’s an entire section devoted to contact details. And what a small section it is. Just a simple email address, a phone number, and some social links.

This couldn’t be simpler.

Only trouble is that it puts the effort onto the visitor rather than on you.

Generally an in-page contact form is more convenient than opening up an email client or opening a new tab for Gmail to compose a message.

But there is no single correct way to do this. All that matters is that you encourage contact & make sure your contact details are easy to find from any page.

Be Unique & Make Yourself Stand Out

The portfolios with the most memorable designs often jump off the page at first sight. Be one of those designs.

2020年欧洲杯时间表You can do this with personal photos, custom icons/branding, or just incredible work. Or some combination of other factors!

2020年欧洲杯时间表The definition of being unique is not being “the norm”. So it’s hard to say exactly what you should do to be unique… all I know is the benefits are great.

On the website you’ll find a lot of cool unique features.

2020年欧洲杯时间表Custom graphics, animations, strong nav links, and a pretty cool logo to boot. This is something that a client will remember when they visit the site again.

Their work is superb and the homepage even has a strong contact section. Great example of using a unique design to your advantage.

2020年欧洲杯时间表Another nice example is the with the incredibly vibrant background animation.

2020年欧洲杯时间表This is unique in the sense that no other site has this animation style. It’s a way for Fireart to really stand out from the crowd and show off a little of what they can do.

2020年欧洲杯时间表But this will not be a good choice for everyone. And it’s hard to say exactly what you can do to stand out from all the other freelancers.

My best advice is play to your strengths and design a site that people will remember.

When In Doubt Go Minimalist

If you really have no idea what do with your site then just keep it simple.

2020年欧洲杯时间表Strip it down to black & white colors, reduce most graphics, design on a simple grid and go minimalist. You really can’t go wrong with this style.

Yes it’s a little cliché but it’s used so often because it works. People know how to interact with clean minimalist websites and there’s no way you can screw it up.

I think does a nice job of walking the line between unique and minimalist.

The site is very simple and doesn’t use too many strong colors. Yet it does have some personal touches2020年欧洲杯时间表 along the way so it feels unique compared to all the other minimalist portfolios out there.

Notice that typography plays a huge role2020年欧洲杯时间表 in this design. Work towards some killer type on your page and see what you can do to spruce it up.

A great way to liven up a minimalist layout is pairing custom fonts2020年欧洲杯时间表 together.

Here’s another cool example site by (small warning: this page has auto-playing audio).

2020年欧洲杯时间表I’m including this site not just for its design, but also its setup. The entire site is released for free on GitHub and published using the feature.

2020年欧洲杯时间表This is a nice way to get around paying for your own domain & web hosting. You can use the GitHub pages feature for free so long as you release all of your site’s source code in a repository.

I know this is probably a little much for most “sample” portfolios. But if you’re a developer or if you know your way around basic web dev concepts this is a really strong way to go for cheap hosting on a slim minimalist site.

Wrapping Up

2020年欧洲杯时间表Whether you’re launching a new portfolio or redesigning one from scratch, these tips are sure to get you on the right track for a sweet layout design.

2020年欧洲杯时间表Depending on the type of work you do you’ll probably have different needs and design goals for your site.

But as long as you focus on the user experience and design a quality engaging layout you’ll have no problems landing work.

Start Your Own Freelance Business!

Learn how I went from a corporate employee to owning my own freelance business and blog. Sign up for my email newsletter and get a FREE copy of my Ebook plus a coupon for 10% off your first billing cycle on any Vandelay Premier plan!

Looking for hosting? offers secure managed WordPress hosting. You’ll get expert WordPress support, automatic backups, and caching for fast page loads.