24 Useful ‘How to Design Portfolio Pages’ Tutorials

How to design portfolio pages is a subject that we visited in a post a few days back. However, since you cannot have too much of a good thing, we decided to give you another roundup of tutorials that promise to teach you the essentials of designing great portfolio sites. The tutorials in this post offer a mix of step-by-step guides, tips, error alerts, inspiration, ideas and much more. Whether you are looking to redesign your current portfolio or seeking help in designing your first ever portfolio, you will find all the advice you need right here.

How to design portfolio pages is a question that we all ask as we get down to the job of creating layout, putting together text, and selecting our best works for displaying on the portfolio. In this post, we have collected 24 different tutorials and informative articles to help you get through all the necessary steps and end up with a brilliant portfolio that makes potential clients and employers sit up and take notice of your work.

You may also love to check our previous compilation of 21 creative how to design portfolio tutorials.

A portfolio – whether online or offline – has the ability to bring you new clients and great work. So put in some effort to turn it into a knockout portfolio. These 24 tutorials are here to help.

Build A Killer Online Portfolio In 9 Easy Steps

What if you were told that building a great online portfolio is as easy as counting from one to nine? It just so happens that the editorial team over at FreelanceSwitch has put together an informative article that walks you through the qualities that make one portfolio design stand apart from the rest. The article warns you outright: “Building your portfolio is easy. The hard part is making it good.” But then, it walks you through the nine steps that will make your portfolio special, and as they call it, “an automatic work generator”.

Building portfolio sites

Visit tutorial at FreelanceSwitch

100+ Tips On Creating An Effective Online Portfolio

The promise of 100+ tips is guaranteed to make anyone sit up and take notice. This tutorial is not so much a tutorial on its own as a roundup of great tutorials on how to design portfolio pages. Not only does it link you to great articles dishing advice on the finer points of portfolio building, but it also highlights some of the best advice provided by these tutorials. Whether you are looking for advice on attracting clients or toying with the idea of adding a blog, you can find plenty of advice right here.

Online portfolio design tips

Visit tutorial at FreelanceSwitch

Alternative Ideas For Designing A Web Portfolio

Professionals who want their portfolio (and hence, their work) to stand out in the crowd stand to benefit from this tutorial offers “alternate ideas” for portfolio design. This tutorial discusses the various concepts that make for good design, rather than talk about current trends in portfolio design. If you are looking for some insights and advice to get you thinking out of the box, even as you tick all the boxes that make for great portfolio sites, this article offers some fine ideas with examples on the side.

Great portfolio sites ideas

Visit tutorial at Fuel Your Creativity

19 jQuery Scripts And Tutorials To Improve Your Portfolio

If you are eager to bring a breath of fresh air to your current portfolio sites, jQuery scripts can help you do that. This multi-browser JavaScript library has many tricks up its sleeve for designers and developers who are interested. Of course, it helps to have some guidance regarding what you can really achieve with jQuery. This post offers links to jQuery scripts and “how to design portfolio pages” tutorials. Create tabs, bubbles, flip boxes, sliders and more once you master the use of this great online tool.

JQuery tips for portfolio design

Visit tutorial at Designer Daily

6 Steps To Creating A Knockout Online Portfolio

This wonderful tutorial on how to design portfolio sites takes the form of an interview of Behance’s chief designer Matias Corea. Corea is well placed to offer insight and advice regarding what makes for a knock-your-socks-off portfolio. Apart from basic advice like keeping the website simple in order to highlight your work, Corea also offers really useful titbits like, “Always showcase the type of work you want to be doing in the future.” The article supports the advice with a range of beautiful portfolio design examples.

Portfolio design steps

Visit tutorial at 99u

7 Tips For Improving Graphic Design Portfolios

A graphic design portfolio is not necessarily a whole lot different from other professional portfolios, but it helps to know the finer points that make such a portfolio special. Thus, showcasing your work effectively or maintaining a one page portfolio could make all the difference. This short and sweet article over at You The Designer offers seven essential tips on how you can make your existing portfolio even better. Whether it is taking a video of how you work or making the contact page easier to find, you will get enough advice right here.

Graphic design portfolio

Visit tutorial at You The Designer

Design A Creative Portfolio In Photoshop

We all love Photoshop, but sometimes it is easy to underestimate all that the popular image editing software can do. Even if you are not a particularly experienced designer, Photoshop can help you create a fine portfolio. Rather than wonder how to create design portfolio pages on Photoshop, check through this useful tutorial over at Wegraphics. The tutorial shows you how to create a simple portfolio design and layout from scratch using Photoshop. Read through and get inspired to make one of your own.

Photoshop portfolio design

Visit tutorial at Wegraphics

How To Create A Winning Online Portfolio – Even If You Design Offline

As the headline to this tutorial shouts out, you do not have to exclusively be a web designer to have an online portfolio. Even if your design work is limited to the offline arena, an online portfolio can be a great showcase for your work and a way to attract potential clients. Since non-web designers may not have as much info regarding the dos and don’ts of portfolio sites, this tutorial offers valuable advice and tips to ensure that you develop a great portfolio online.

Great portfolio sites

Visit tutorial at You The Designer

5 Things Your Online Journalism Portfolio Should Include

The World Wide Web offers numerous tutorials on how to design portfolio sites for designers. What do you do if you are journalist, freelance or otherwise? Luckily, Mediabistro has a useful article dishing out essential advice to journalists who are looking to showcase their work online. Here is a five-step article telling you about the salient features of a good online journalism portfolio. Read up and work these factors in when setting up your own portfolio page.

Journalism portfolio sites

Visit tutorial at Mediabistro

What to Consider & Avoid When Creating An Online Graphic Design Portfolio

Any good tutorial on how to design portfolio sites will not only focus on the must-have elements of the best portfolio sites, but it will also highlight the things that are better avoided. Here is one such tutorial that seeks to teach graphic designers about the hits and misses of designing a successful graphic design portfolio. This detailed article encourages graphic designers to show their work and their personality but also to keep things simple and accurate. Examples of top portfolio sites add some inspiration to the mix.

Graphic design portfolio ideas

Visit tutorial at Oneextrapixel

The Common Mistakes With Online Portfolios

In keeping with the previous tutorial, this particular article over at Creative Boom encourages portfolio designers to be aware of the common mistakes that can subtract from your otherwise brilliant portfolio. For instance, a portfolio that seems to be trying too hard will send the wrong message to potential employers. Luckily, this tutorial on how to design portfolio pages highlights five common mistakes along with possible solutions and also offers 10 additional tips “to get your online portfolio rocking”.

Portfolio design mistakes

Visit tutorial at Creative Boom

You’re A Designer And Don’t Have A Website? Get Started Now

A designer operating in today’s Internet-dominated world must have a website. There is no alternative to this. However, many designers even today continue to operate without an online address. This tutorial over at Design Shack sets out to show you that this is a mistake. The article not only deals in the salient features of good portfolio design but also highlights the benefits of having a strong online portfolio in today’s world. The article also highlights great portfolio sites explaining why theirs is such a success story.

Design portfolios

Visit tutorial at Design Shack

7 Things You Should Include in Your Web Design Portfolio Website

Web design portfolios are proliferating around the web. However, not all of them are as good as they could be. If you have a web design portfolio that is just about so-so, give it a dash of pizzazz by picking up quick tips from this great article on web design portfolios. If you want your web address to rank among the top portfolio sites online, you will have to make sufficient effort to make it happen. Luckily, articles like this one give you a good idea of what employers are seeking. Then it is up to you to incorporate this knowledge into your portfolio design.

Web design portfolios

Visit tutorial at Speckyboy

10 Tips To Build A Killer Online Portfolio

Portfolio designers who are in a rush can really gain from this great tutorial posted at the DzineBlog. The focus here is on providing 10 great tips that will help you put together a great online showcase of your work that will encourage clients to work with you. The article encourages you to play to your audience, keep things simple and focus on good presentation, among other things. Get ready to increase your reach and better your business prospects.

Top portfolio sites tips


Top 10 Portfolio Tips for Freelance Designers

Freelance designers have no way out. They absolutely must have an online portfolio that highlights their previous projects and persuades potential clients to hire them. If you are a freelance designer, you probably already know that it is not enough to just have a portfolio online. It also needs to be a great portfolio if it is to make any kind of impact on your target audience. A customized portfolio, a portfolio that stands out, a portfolio that scopes out the competition – that is the kind of portfolio you need; the kind of portfolio that this Vitamin T tutorial helps you achieve.

Freelance design portfolios


How To Build Your Own Single Page Portfolio Website

Single page portfolio are all the rage these days. The obvious benefits of a single page portfolio are that it is inherently concise and easy to put together. Whether you are a novice or a veteran on how to design portfolio sites, this tutorial walks you through the various steps to help you create a simple but eye-catching single page portfolio layout while highlight all your best work, your contact details and more.

One page portfolio design

Visit tutorial at Blog.SpoonGraphics

Web Portfolio Design With A Watercolored Background In Photoshop

How you design the background of your online portfolio can go a long way in building an interest in your web page. Assuming that you have little or limited experience building portfolios, here is a cool and specific tutorial that teaches you to create an interesting water-colored effect for the background of your online portfolio site. This useful article takes you step-by-step from the stage of a blank document to helping you create a cool and fun background. Feel free to add your own little touches to the final creation.

Portfolio sites background

Visit tutorial at PV.M Garage

How To Create A Great Web Design CV And Resume

Online CVs are considerably different from portfolio sites. However, if you have an online portfolio, it would be useful to also include a link to your CV or resume. Now, while the rules for non-digital CVs are similar to those that you post online, you have the opportunity to play with the layout and make your qualifications pop. Not only does this tutorial give you basic tips on CV-writing, it also encourages you to experiment with the layout until you come up with a winning format.

Online CV tips

Visit tutorial at Smashing Magazine

Creating A ‘Filterable’ Portfolio With JQuery

Earlier on in this roundup of tutorials on how to design portfolio pages, we included a article discussing how you can use jQuery to spice up your portfolio design. Here is another jQuery tutorial that helps you throw in a “filtering by category” option using jQuery. The article shows you how to use jQuery scripts in order to make this happen. The step-by-step tutorial is a great resource for developers of portfolio sites everywhere.

Portfolio design with jQuery

Visit tutorial at Net Tuts+

Create A Grid Based Resume/CV Layout In InDesign

Here is another great tutorial that helps you revamp your current resume layout and make it current, edgy and impactful. Give your resume a new lease of life by using this grid-based layout provided by blogger Chris Spooner. The CV was created using Adobe InDesign. Given that CVs are simply a summary of your qualifications, there is not much scope for creativity. But a clean and user-friendly layout can make all the difference in the world.

InDesign CV layout

Visit tutorial at Blog.SpoonGraphics

Design A Portfolio Site With A Textured Background

The home page of your portfolio site is a key element in getting you work. Thus, it makes sense to spend some time tweaking and improving the home page. Here is a tutorial on portfolio design that helps you put together a smart and subtle homepage background to give your portfolio some texture. This article shows you the steps involved in creating a textured background for your portfolio and then creating a suitable layout.

Portfolio design background

Visit tutorial at DesignM.ag

Build A Flash Portfolio

A flash portfolio is another option that you could consider as you go around looking for tutorials on how to design portfolio pages. A flash portfolio can be a great platform not only to show off your work but also to highlight your personality and creative streak. This article over at Computer Arts gives you a case study of a particular colorful and whimsical portfolio page. As you study the composition of this design, you could gain some ideas and inspiration to make your own portfolio design more fun and out of the box.

Flash portfolio design

Visit tutorial at Computer Arts

10 Solutions To Easily Create Your Online Portfolio

Fortunately, nowadays there are several online solutions to your portfolio problems. You no longer have to be a brilliant designer/developer or hire one in order to ensure that yours ranks among the best portfolio websites. Here is an article that introduces readers to 10 wonderful online platforms for portfolio sites from around the world. From Carbonmade to Behance to DeviantArt, you can browse through a number of fine portfolio platforms and then decide which one works best for your needs.

Platforms for portfolio sites

Visit tutorial at Blog.SpoonGraphics

6 Portfolio Design Mistakes That Drive Me Nuts

There can never be enough articles featuring common mistakes in portfolio design. Here is another insightful one that warns portfolio designers and owners against the common pitfalls that turn off potential clients. This article not only points out these errors, but also highlights why these are problems and how you can overcome them. From telling you not to divulge your age to stressing the need for confidence, this is a great resource for all portfolio owners.

Portfolio sites mistakes

Visit tutorial at Design Shack