Having a sharp online portfolio is a must for every designer. Here are ten steps to creating a website that truly expresses your unique style.
These days, a professional online presence is an absolute must for designers and creatives. An online portfolio with spot-on website design is the modern day version of a business card, a resume and a project showcase all in one. After all, it’s the go-to place for all potential clients and employers looking to hire you.
Creating a portfolio website is an opportunity to make something that shows off your skills and conveys your unique voice, while looking just as crisp and professional as any of your other work. With the right tools, you can go beyond technological constraints and artistic compromises, and build a powerful online presence. To get you started with learning how to make a website, here’s a guide on creating an online portfolio you’ll be proud of.
Starting a design business? Use this design name generator to name it.
Ready to create an online portfolio? Start designing yours now.
What is a portfolio?
An online portfolio is a digital collection of your work, experiences, qualifications, skills or accolades you have earned and want to share. It is a great way to showcase your skills and talents to potential employers or clients. People in all sorts of fields use portfolios, but the most common ones include the creative arts (graphic designers, photographers, writers, musicians, etc.), technical fields (software and web developers, engineers) and business. The layout of your portfolio depends on the field you're in and what it is you want to highlight.
How to create an online portfolio
01. Gather inspiration
Creating a portfolio begins with some visual research (and checking out the best portfolio website builders). Whichever field you’re in, looking around at other online portfolio websites will provide you with plenty of inspiration and generate some initial ideas. It’s especially recommended to take a look at websites by other people in your specific creative niche or industry.
When looking through these resources, start thinking of the vibe you want your portfolio to convey and what experience you aim to create. You can take notes or even make a mood board to accompany you throughout your creative process. Consider essential details like the color palette, typography and site structure that you like, and clue yourself in on current web design trends.
02. Choose a template
How do you want visitors to move from one page to the next? By opening a menu or scrolling down for further information? Do you want your site to be a one-page website, or a gallery of fullscreen images that open up into individual pages? These are questions you’ll ask yourself at the next step, choosing your portfolio template.
When you’re ready to go, have a look at these portfolio templates for creatives. You might find something similar to the result you envision, in which case you’ll be able to customize it and make it your own. If you’d rather start from a blank canvas, you can always create your website from scratch and enjoy complete freedom to express yourself online.
03. Showcase your best projects
Your actual work is the core of your online portfolio, so make sure to showcase it in the best way possible. It should stand out and be easily reachable through the homepage and/or website menu. You can highlight this work by creating a dedicated “projects” page on your website.
Expose clients to your creativity and skill by sharing only your best work. This way, you’ll bring their attention to your strengths, and maintain a consistent level of quality throughout your portfolio.
As well as presenting your best work, make sure to update your website every once in a while, so that you’re always sharing your most recent creations. This will show visitors that you’re active, working and have experience. When first creating an online portfolio, consider how you can build a portfolio that’s easy to update, letting you comfortably add new projects as you go.
It’s helpful to add a narrative for each project, so that visitors can get a sense for the context of your work. Make sure to give a concise description of the project and mention your role, as well as any collaborators you worked with - an often overlooked portfolio design tip.
04. Use high quality images
Not only photography portfolios require high quality images. To ensure that your work looks as impressive online as it does in real life, invest time and effort into photographing your work, your process and your products. In cases when a professional photoshoot is not feasible, work with mockups to bring your visuals to life. When showcasing your images, the Wix Pro Gallery will offer you a professional look with customizable layouts, edits and effects.
05. Include the right content and features
Once you have a good base from which you can set off and a collection of projects ready to display, it’s time to identify which additional content you want to include in your online portfolio, and how to present it strategically. This includes text, images and other media. Whether you need some model portfolio examples or you're creating an industrial design portfolio, graphic design portfolio, a stunning photography portfolio or any other type of website, here are the most crucial pages and sections to include, plus some professional design features to consider implementing on your site (for even more web design portfolio examples, check out our guide):
The virtual home of your portfolio should grab your visitors’ attention with an eye-catching design. On top of the visual aspect, your homepage is a chance to stir the curiosity of potential clients and employers with a powerful introductory sentence. Make it short and sweet, clearly expressing who you are and what you do. There’s no need to go into your biographical details here (that’s what your ‘About’ page is for), but your name and main area of expertise are an absolute must.
Since your homepage acts as a starting point and base for visitors’ navigation, be sure to also include a menu of items that’s easy to find and clearly directs users to the right place on your site.
The About page is where you present your background and short bio, provide essential information about your activities and summarize your unique identity and values. Include any distinctive elements, such as your achievements and skills. It can also be a good idea to clarify your current employment status and include your CV. You can either add it directly onto the page or as a downloadable PDF.
You can show off your personality with puns, smart microcopy, illustrations or anything else that feels true to you. Check out how designer Jikun Tao added a personal touch to her online portfolio by including a googly-eyed gif and a play on typography.
After you’ve stunned visitors with your site, make sure they can easily contact you. Commissions won’t pop up in your inbox by some miracle, so add any of the following elements to ensure you’re reachable: a contact form, your email, phone numbers and links to your social networks.
These can be featured as part of your menu, in a dedicated contact page or as a pinned element on the side of the screen. It’s also highly recommended to repeat your contact details in your website footer, offering visitors a final invitation to get in touch.
Clients and testimonials
Highlight your professionalism with a list of respected clientele who have chosen to work with you. If any of your projects have been featured elsewhere or have received press coverage, mention that too (especially in high-ticket industries, like architecture portfolios).
You might also want to drop in a testimonial or two by satisfied clients. As long as the feedback feels genuine and not over-the-top, testimonials can add a lot of credibility to your online portfolio. Don’t miss out on this chance for some free and authentic PR.
Incorporate professional features
To craft a professional look and an engaging experience, see how you can incorporate design features that catch your visitors’ eye by taking your online portfolio design up a notch. From hover effects and parallax scrolling to animation and lightboxes, these finishing touches can help bring your website to life. They can also serve as functional tools, drawing your visitors’ attention to a specific place, or generating interaction.
Another great way to make your site more dynamic and tailor it to your specific needs is using Velo by Wix. This web development platform lets you insert code elements into your website with various custom interactions, helping you bring your most intricate visions to life on your portfolio.
06. Improve your portfolio's UX
Now that you have your content, it’s time to make all the pieces come together. There are a number of factors to take into account for creating strong UX, or user experience, on your website.
Start by listing all the web pages you’ve decided to create. Then, identify which elements will need to be included on each page. For example, a project page might include a featured image, header, description, plus a few extra images or media features. Listing the items on each page will let you prioritize, decide on their hierarchy and come up with a fitting website layout.
You can either sketch out your ideas on paper as wireframes, or start creating your portfolio website straight away, gradually putting elements into place.
Once you know which pages will make up your online portfolio, you’ll be able to decide on the navigation. How do you want your visitors to transition from one page to another? Will you include a hamburger menu that opens up into a fullscreen list, or a fixed menu at the top of each page? How will you indicate what page people are on? This guide shares website navigation tips and covers everything you need to take into account for a smooth browsing experience.
For more ideas, check out this collection of websites with good UX design.
07. Work on your site's SEO
What good is an online portfolio if no one gets to see it? In order for your clients to find you and book your services easily, work towards optimizing your website to bring it higher up on Google search results.
Search engine optimization (SEO) is an ongoing task, concerning various elements of your site. Here are some pointers will help you get started:
Create unique, fresh and valuable written content. A good way of doing this is by writing blog posts, as they’ll give you the chance to share ideas that other designers and creatives will enjoy reading. This will also show Google (and site visitors) that you’re actively working.
Do keyword research to find the right keywords for your site. Keywords are the most commonly searched phrases on Google when people are looking for creatives such as yourself. A keyword example could be “independent web designer” or “Toronto architect.” Once you’ve done some keyword research, use these phrases in strategic places throughout your website.
Write alt text for your images. Short for alternative text, alt text is a brief description of your site’s images and photos (for example, “postcards and business cards for a branding project”). Writing SEO-friendly alt text can also help improve your website’s accessibility. You’re likely to have many visual elements on your online portfolio, so use this opportunity to integrate your keywords into your alt text.
Write titles and descriptions (known as metadata) for each of your design portfolio’s pages.
Get found by people in your area using local SEO. If you’re a freelance designer with a permanent location, use local SEO to ensure that your portfolio is found by anyone searching in your particular area. Make sure to claim your business on Google My Business, register your website on relevant directors and add your location on your website’s pages.
Pro tip: If you have a Wix website, try Wix SEO. It’s a free, step-by-step plan designed to help improve your site’s SEO with a tailored checklist and helpful tips. Using your portfolio as a personal marketing portfolio is never a bad idea.
08. Make it mobile friendly
People often forget about the huge amount of users who are likely to be viewing their site from a smartphone. In fact, mobile devices account for 52% of web page views worldwide. That’s why the best website designs should look just as good on mobile as they do on desktop.
One of the major challenges designers face when it comes to creating a portfolio online is ensuring that it will be mobile compatible. Your mobile website is more than just web design made smaller, so there are a few rules to keep in mind when designing for mobile.
For the small screen, you’ll want to declutter the mobile version of your site, keeping only the most crucial elements visible. Furthermore, pay attention to the fonts and colors you use and make sure they’re legible. Reduce the amount of typing required and consider adding a search bar to ease navigation.
If you’re creating your portfolio with Wix, your site will automatically generate a mobile-friendly version, with an adaptive gallery for your images.
09. Ask for honest feedback
We all know the feeling of getting lost in a project until we lose sight of what it really looks like. That’s why it’s always best to run your website by a second set of eyes for some insight and fresh ideas. Ask your trusted friends what they have to say about your portfolio’s content and visuals. Did they think your portfolio was missing information? What did they like or dislike about your site’s appearance? Was it easy to navigate? Even if it means making adjustments, critical feedback from your peers can help you fine-tune the details of your site.
10. Publish and promote
Once you’ve published your online portfolio, don’t forget to share it on all of your social channels, from Pinterest to Dribbble and more. This straightforward social media marketing strategy will help you reach more potential customers, improve your SEO ranking and hear honest feedback.
Another Instagram tip for designers is to add social buttons to your site, helping visitors reach your social media profiles easily.
After you’ve gotten the word out, remember that your portfolio should grow with you. There’s always another tweak around the corner to make it a little better. Keep updating your site with new content and projects, implementing different features, improving the user experience and staying up-to-date with current design trends.
Tips for making a portfolio
Now that you know how to make your portfolio, here are some extra tips to make sure you really nail it:
Use consistent branding throughout your portfolio. This means using the same fonts, colors, and overall style throughout your portfolio. This will help to create a cohesive and professional look. On top of that, only include your best work in your portfolio. This will help you to showcase your skills and abilities to potential employers or clients.
Make sure your portfolio is mobile-friendly. More and more people are using their phones and tablets to view websites, so it's important to make sure your portfolio is mobile-friendly. Use a clear and consistent navigation system so that potential employers or clients can easily find the work that they are looking for.
Keep your portfolio up-to-date. As you create new work, be sure to add it to your portfolio. This will help to keep your portfolio fresh and relevant. Make sure that your images are clear, sharp, and well-lit and add clear and concise descriptions to each one.
How to make a portfolio FAQ
How should a portfolio start?
A portfolio should start with a strong introduction that tells your story and what you are all about. You can include a brief bio, your contact information and your goals. You may also want to include a statement of purpose that explains why you are creating a portfolio and what you hope to achieve with it.
What makes a good portfolio?
A good portfolio is one that is well-organized, easy to navigate and showcases your skills and abilities. It should also be visually appealing and engaging. Here are some tips for creating a good portfolio:
Be selective. Only include your best work in your portfolio.
Be organized. Organize your work in a way that is easy to navigate.
Be clear. Include clear and concise descriptions of your work.
Be professional. Your portfolio should be professional in appearance and content.
Be consistent. Use a consistent design throughout your portfolio.
Be creative. Don't be afraid to be creative with your portfolio.
How do I create a student portfolio?
To create your student portfolio, decide its purpose so you can narrow down the content you want to include. After that, you need to select your best work, organize it in a way that makes sense and add annotations to explain what the work is about. Then, design your student portfolio in a way that's visually appealing and easy to navigate.
The final step is to share your portfolio with your teachers, classmates and potential employers. You can also submit your portfolio to online competitions or portfolio review websites.
Creating a student portfolio can be a lot of work, but it's a worthwhile investment. A well-designed and informative portfolio can help you showcase your skills and talents to potential employers, colleges and other opportunities.