Step-by-Step Guide to Build a Portfolio Website for Freelancers (Under 10 minutes)
sohrab askarzadeh
Author
In this article, I will guide you through making your portfolio website without any coding or programming knowledge. Personally, I don't like using out-of-the-box software for commercial or enterprise applications, but a personal portfolio website does not fall into these categories. So let's go!
Why do you need a portfolio website as a freelancer
I guess you know why you need a portfolio website; otherwise, you wouldn't open an article like this, but I will explain it so we can get on the same page about why we are doing this and not just giving out a document or brochure to our clients.
It adds to your credibility
It's hard to trust someone that you can't find anything about them online these days. At least in most industries. Can you trust a programmer that no one knows about them online? Or a graphist that doesn't even link you to a list of their projects so you know it isn't copied? Having an online presence shows that you are a serious man/woman who concentrates on one service and one service only. Even if you have multiple jobs, you should not mix the portfolios. Your online portfolio must be concentrated; that's what makes you more credible.
Control, Control, Control
Imagine this scenario, you make a brochure of your previous projects or maybe even a small book. What happens when you do a new project? Reprint it? have a new brochure? Or what happens if for any reason (legal or otherwise) your previous customers ask you to remove their brand from your portfolio, then you need a new brochure. But when you use an online portfolio website you will have control. Adding or removing projects is just a matter of clicks!
The other thing about having control over your portfolio is you are not limited by some third-party platform or rules. You can add links where ever you want, you can put anything you like on your website and change the layout to whatever you desire.
Getting more clients!
Needless to say that if you work on portfolio and do some SEO on it you potentially can attract more customers from google or other platforms. That's ultimately to goal of most public websites, increasing the reach of business.
Let's move on to the steps you need to take to have the best portfolio website possible.
What makes a portfolio website work
I'm a software engineer, so sometimes I go through more details than necessary for a tutorial. But in this case, I believe you must know how a portfolio website works, so if you want to change, update, or improve it later, you know where to start! So what does a website (in this case, a portfolio website) need to be functional? What are our options?
I will tell you the details, and then we will make a website together step by step! Sounds good? Let's go.
A Domain for your website
A domain is your unique ID in the web development universe. Ours (as you see in your browser URL) is Flamincode.com.au. You will need something like that so people can reach you. For example, yours will be "mycoolfolio.com." I will explain how to obtain one later in the article.
An actual web application
This is what your domain will point to. So when your customer types "mycoolfolio.com," the internet will take him to the computer(server) where your application is running. The web application (which your portfolio and projects are on) will do the techy stuff and show the result to your client via their web browser! I will explain how to get that web application, too, don't worry.
A Host or a server
Every piece of software (like the web application we discussed in the previous heading) needs a computer to run and work smoothly. In this case, this computer needs to be on the Internet so your clients can access your portfolio (web application) from anywhere in the world. A host or a Server is the perfect computer for this goal. You can get one from hosting companies, make your web application run on it, and, voila! You have a working website.
Well, that's it. You need these three things, so let's talk about how to get a domain, a web application, and a server and how to connect them.
How to get them all (Free version)
In this version of how to create a portfolio website, we will gather all three of our needed things for free and will have a portfolio website in under 15 minutes! I will talk about what you can achieve through this method, its limitations, and advantages. Let's dive in.
Free domain
- Go to WordPress website and login with your email.
2. After login, a page opens that allows you to choose a domain. It tries to push you to buy a domain (which is fine) but choose the one I highlighted at the start. Choose the one like "someRandomText.wordpress.com" with the free tag on it.
Now, you have a free subdomain that can be later connected to your web application and server.
Free web application
3. In this step, the WordPress website will ask you about the goals of your web application. Choose the "Showcase work/portfolio" option and click next. This mainly helps WordPress suggest better templates if you don't like them. If you want to expand your website to do more than just show your portfolio, you can do that later easily.
4. Here, you see the templates (web applications) that WordPress suggests. Make sure from the upper filtering "type" buttons you chose "Portfolio" and then choose any of them that have a "Free" tag under them. My suggestion is not to pay for templates at first until you learn how they work. If you want to upgrade your subscription from free to other levels, it's easy to do so later. For now, we concentrate on the free templates.
I chose an old-school (and a bit ugly) template named "Kigen." We will create and have our portfolio based on that, and after we've done that, we are going to migrate to a new template, so you can learn that, too.
5. Now that we have chosen the layout, WordPress will take us to get the website ready to launch. It will ask you to give the website a name and maybe write a blog post.
Here, I wrote "Jack's portfolio" and created a tagline that shows my customers what I'd do for them.
6. The next step is editing your main page because it's the first thing that your users will see; from the left panel, click on pages, then click on Homepage:
Now you can see the homepage of your portfolio website:
Do you see the blue border around the first tile? Remember that anything you see here can be edited! So, we start by replacing the first tile with a picture from our project. I have always loved painting, so I say I'm a painter, and I want to showcase my works.
What I do is click on the first tile and upload one of my paintings from my local computer. I continue doing this for all the tiles. And I change the Site Title to "Jack's Cool Paintings!"
The result would be something like this:
7. One of the best ways to show your portfolio's details to your clients or create a case study about your work is to write a blog or create a page and link your portfolio tiles to that.
By going to your WordPress panel, you can choose your website (you can create more than one!), and then from the left panel, choose Posts>Add New or you can choose to make a page, or you can just use the shortcuts that shown in your panel, I assume you click on Add new blog, then you will see something like this:
Your goal now is to give it some content. We now have 8 recent projects (paintings, in this case) on our homepage. Now, what if a client clicks on one? We want to take them to a page that explains the work, the challenges, the creativity we put into it, and maybe some customer satisfaction testimony.
So we write the article. You can add pictures, videos, texts, and whatever you want to make it more attractive. After writing it, we are going to save and copy the link it gives us in the upper right panel:
8. Now we go to our homepage, edit the tile that shows the fox, paste the link into its input, and save:
Congrats! Now, we have a main page that shows tiles of our work, and we linked it to a more detailed explanation! So when users click on it, they can read about your project.
Free server or hosting
9. WordPress already gave that to you when you published your first page. If you go to the hosting section from the lower left panel, you can see the specs of your server:
If you just started your website, you won't need to change that anytime soon. So, let me congratulate you on your first fully free portfolio website. But what if you don't like the template anymore? Can you change it? Yes! Let's see how to do that.
How to change the freelancer portfolio template
It's important to know that using the free subscription limits your choice of templates. Almost all the cool and modern templates are behind some kind of paywall, but we will change it to another free template so you can use the Idea.
Click on the upper left WordPress logo and choose the "Themes" option. You'll find a list of templates that you can migrate to. I will choose the "Bradford" theme this time and click "Active this design"
Wordpress now notifies you that the homepage will change, but your content (pages, blogs) will remain accessible. So all we have to do is add some tiles to the new homepage and link them to the old blogs that we wrote earlier.
As you can see, our page looks a bit different, but it still has our content.
The advantages of free wordpress portfolio website
In this method, we used a WordPress domain, web app, and server; here are its advantages listed:
- It's free: as a freelancer who is just getting to create websites, it's nice not to worry about money at first.
- It's easy to use: especially if you get the hang of it; you can see many YouTube videos about how to customize a WordPress website.
- It's customizable compared to alternatives: listen, your other alternatives are Wix, canvas, and such, and those aren't exactly flexible compared to WordPress. The reason for that is they aren't using an open-source application as the web application part (remember the second heading?). when you learn to work with WordPress (which is open source), you can use many, many more templates outside of the WordPress website and use servers from hostings like Hostinger, Bluehost, etc.… and create your own universe later.
Disadvantages of free wordpress portfolio website
Here are the disadvantages of using a free WordPress subscription for a portfolio website
- The free ones aren't cool: almost all the cool templates of WordPress are behind a paywall (which is not that expensive), but then again, so are the alternatives! Almost all the other options that give you freedom in editing and upgrading your website are behind a paywall. At least it has a free subscription.
- It can get messy: if you don't pay attention to the details and want a very custom website, it can get messy. If you want a simple portfolio website, you will have no problem. But you need to know some basic information to expand it to support shopping, commerce features, and such.
How to get it all! (Paid version)
If you want to spend money, I will list some alternatives that are easier to implement. But I still suggest WordPress over all of them because it's more customizable, and customization will serve you very well in the long run.
Company |
Description |
Has full free plan? |
Starting price |
Wordpress |
Popular CMS with flexible options (hosted/self-host) |
Yes (WordPress.com limited) |
$4/month (WordPress.com) |
Wix |
Drag-and-drop builder, many templates |
Yes (with ads & Wix subdomain) |
$16/month (billed annually) |
Weebly |
Simple website builder for small sites/portfolios |
Yes (with ads & Weebly subdomain) |
$6/month (billed annually) |
Squarespace |
Visual site builder with advanced customization |
No (14-day free trial only) |
$16/month (billed annually) |
Webflow |
Visual site builder with advanced customization |
Yes (with Webflow subdomain) |
$12/month (billed annually)
|
Conclusion on how to create a portfolio website
There is no best choice in making the best portfolio website for freelancers. (I'm lying it's WordPress) so you can explore your options. Of course, when writing this article, I tried to show you ways to create a website if you are not a tech guy and you don't want to spend money on creating the website, but if you are an established brand, company, or you want your portfolio to really shine between your competitors, you should consider using the services of a designer, programmer or a web design agency. They can create custom-built websites for you, which is much faster and much more eye-suiting than normal WordPress or Wix websites.
Hope this helped you; if you want me to create other articles on how to create your website using different technologies, let us know in the comment section! <3
Admin
Sohrab is our lead developer, He is a web developer with 10+ years of experience in requirement engineering and server-side programming. Skilled in .NET, memory management, and performance optimization