Get the Beginner's Guide to What to Put in Your Tech Portfolio
Get dozens of resources, plus expert tips on how to build a KILLER portfolio even if you're an absolute beginner.
When I first started trying to work as a freelancer and get tech-related gigs, it wasn’t easy. I would send out cold emails or submit cover letters to job listings, and sometimes not even get the courtesy of a reply.
Soon enough, I realized that especially for jobs in web development and design, it’s not what you say about yourself that matters, but what you show clients and future employers you can do.
And without a portfolio to showcase my skills, I was missing the biggest piece of the puzzle.
However, it’s not enough to just have some cut-and-pasted portfolio that does the bare minimum. It’s a competitive job market out there, and you need to set yourself apart with a portfolio that impresses.
Like most things in life, what goes into your online portfolio depends on you and your goals. That said, there are a few basic principles you can follow no matter who you are and what you want to achieve:
24 Dos and Don’ts When Building Your Online Portfolio
1. Do: Include your personality.
2. Don’t: Just pass off a list of bullet points.
Your portfolio is a chance to tell your story, make a mark, and build your brand.
But…there’s always a line. While most people suffer from not sharing enough on their site, it is definitely possible to over-share.
Sharing personal details, a behind-the-scenes look, a brief story about overcoming struggles, etc. is great…if there is a purpose for it.
Make sure there’s a reason why you are sharing certain details. It shouldn’t be just to drop jaws. In fact, too much sharing can be counterproductive.
3. Do: Include your photo.
4. Don’t: Be a face-less rando.
It’s an innately human preference: we trust a smiling face much more than we trust a logo or “about me” paragraph.
And it doesn’t have to be a professional headshot. You can use a photo as a way to show off your personality/interests.
Overall, a photo on your portfolio makes you “real” to potential clients or employers. And that goes a long way.
5. Do: Include relevant work experience.
6. Don’t: Include your high-school babysitting gig.
There’s nothing wrong with babysitting…but it doesn’t need to get a mention on your portfolio site. (Unless part of your duties included building a website or creating a logo or what have you!)
If you’re hoping to land a job as a WordPress web developer, relevant experience to showcase could include:
- WordPress sites you built from scratch
- WordPress sites you built with others (if on a team of people
- Custom WordPress plugins or themes you made
When it comes to gauging relevancy, it can be any experience that ties into your greater goals in some way. For instance, a site sample that was built with just HTML and CSS can be fair game because HTML and CSS are used on WordPress sites, too.
The types of work you would want to leave off your portfolio would be positions that have little or zero crossovers between what you want to do.
7. Do: Include context with your projects.
8. Don’t: Just link to a URL or have a screenshot image.
A user who comes to your site won’t understand an image on its own. (Or a standalone URL.) You need to provide more information about your past work than a tiny thumbnail image.
Context matters! Create stories to explain the projects (and, if possible, engage your readers).
Remember the 5 W’s and one H:
- Who was the client/project for?
- What did you do and what was the result?
- Where did you do it (or on which medium)?
- When did it take place (the dates/timespan)?
- Why did they choose you?
- How did you do it?
Sharing background information about what work went into each project in your portfolio shows clients exactly what kind of work you can do for them, and for future employers it reveals a behind-the-scenes view of how you work.
9. Do: Give users a clear action to take.
10. Don’t: Give users too many options.
When creating a website, avoid the paradox of choice: Essentially, when people are given too many options, they end up choosing none.
That’s why having one clear call-to-action (CTA) on each page or site is important. (Usually, this comes in the form of a button.)
Ask yourself: what action do I want my ideal website visitor to take? And then create a CTA to emphasize that.
Examples of great CTAs (or actions you want your users to take) are:
- “Hire me”
- “Get in touch”
- “Read my resume”
- “Email me”
- “Get a project quote”
You get the idea!
11. Do: Put thought into your site’s layout/appearance.
12. Don’t: Get too complicated and risk confusing readers.
If you’re a designer, and looking for design work, designing a beautiful portfolio is a pretty obvious move.
But even if you’re a web developer who considers yourself design-illiterate, your site’s appearance—and, more importantly, usability—is key.
Because it doesn’t matter how impressive your experience is, how great your bio is, etc., if a user can’t navigate your website!
If you are design-unsavvy, the best approach is to keep things simple. (For more website-building tools, check out this mega list.)
13. Do: Make your contact information accessible.
14. Don’t: Give out your home address.
Don’t give away too much personal info…it is the internet, after all, where anyone can find it.
Strike a balance. Your email address, LinkedIn profile URL, Twitter handle, etc. aren’t things you need to hide.
A business or Skype/Google Talk number is a great move. So is a business address or PO box. However, I would pause before putting a personal phone number or home address online for the world to see.
That said, since the primary purpose of a portfolio is to find work, you want to make it as simple and seamless as possible for a visitor to find you.
15. Do: Show samples of your work.
16. Don’t: Show too many samples.
Some people struggle to find work samples to add. Others add every little project they ever worked on.
Unless you’re a web designer/developer of epic proportions (like, you’ve been featured on Awwwards), don’t include too many things. Instead, sort through all your projects and choose only the best. In tech, MORE isn’t always better. When it comes to including projects in your portfolio, think “quality over quantity.”
This is your opportunity to curate your experience and tell a story to potential clients/employers. Make it a good one.
17. Do: Think outside the box.
18. Don’t: Limit yourself to just experience, education, and skills.
On your portfolio site you don’t have to limit yourself to work samples, education, and skills. There’s a ton of additional things you can include on your portfolio—even if you’re a beginner.
- Testimonials (from previous clients, bosses, co-workers, etc.)
- Your own projects
- Volunteer experience
- Speaking engagements
And more. Here, relevancy is the name of the game. As long as an element of your portfolio adds legitimacy to what you’re trying to achieve (such as land a web design gig or get a full-time position as a junior Ruby on Rails dev), it belongs to your story.
19. Do: Think about SEO.
20. Don’t: Clutter your site with keywords in every sentence.
A great way to have people discover your website is to build it in such a way that it gets picked up by search engines when people are searching for someone with your skills.
There are lots of factors that come into play when Google bots determine where your site will appear in the search engine results page. Of course, there are technical elements, like your website’s speed and whether it is mobile-friendly.
Another component is the words you use on the site itself. This means that you should incorporate appropriate keywords (like your skills, title, the job you want, etc.) Don’t overdo it, though!
When you overuse keywords—known as “keyword stuffing”—it actually has a reverse effect.
21. Do: Check your site for grammar/spelling.
22. Don’t: Put your site online without a read-over.
Nothing says “unprofessional” like a blatant typo of a common word.
When you work on something for a long time, you become blinded to mistakes. Even if you’re a grammar perfectionist! Have a friend, or even pay someone on Upwork, to give it a read-over.
Spending the extra $50-$100 for light editing can mean a lot…especially if you’re landing $1,000+ website projects from your portfolio.
23. Do: Update your portfolio site regularly.
24. Don’t: Build it and forget about it.
Like you, your portfolio site should evolve over time.
A dead website can send out the message that you’re not getting new work, or maybe that you aren’t even in the industry anymore. To avoid your portfolio site looking like a graveyard, make to sure update it with new work samples, skills, testimonials, accolades, etc. regularly.
Conclusion: Craft a Portfolio That Will Land The Opportunities You Want
Building a web presence is key to your job search in 2015 and beyond—because the Internet isn’t going away anytime soon.
In the job market, your online presence is one of your biggest assets. So make a good first impression with your portfolio site, and allow future opportunities to come to you.
Laurence is a self-taught freelance web developer, focusing primarily on front-end technologies. In her spare time she manages learntocodewith.me, a blog geared to beginners teaching themselves how to code. Laurence is addicted to side projects and travel.