How To Make Your Portfolio Better And Get More Clients: Part 1

Your online portfolio is one of the main windows for which potential clients can view ‘you’ as a whole. I deliberately said ‘you’ and not your work. This is because a portfolio isn’t just to show your skills at writing, designing, coding, or whatever else you may be freelancing in. It also represents your personality, interests and style. That is why it is very important to make sure your portfolio is PERFECT (and I mean that to its full extent). Want to know how to do that? Well, here’s how.

Note: This article comes in two parts, the second part will be posted in the future.

Usability

In this part of the article, we’re going to be talking about usability. Usability is a term coined when you assess how easy something is to use. If you can go to a website, know exactly where you are, and know exactly where what you’re looking for is, then that is an extremely easy-to-use website, and therefore an extremely accessable and ‘usable’ website. Let’s get on to the tips.

Titles, Tags, Sections, Links

Wording

When thinking about the usability of your portfolio (and I’m referring to your online portfolio throughout this article) it’s crucial that you make sure all your titles are easy-to-read and very briefly describ that particular area of your website. For example, the title of your ‘About Me’ page should not just be ‘About Me’, an improvement would be something along the lines of ‘About [Enter Name Here] – Design and Code Extraordinaire’. If you analyse the latter title, you realize that it perfectly sums up what you do and how good you are. It also immediately attaches those attributes to your name. All your tags, section titles and links should also follow the same general rule as explained above.

Colors & Fonts

What I’m about to explain here is pretty much common sense, but I’ve seen this mistake been made over and over (and over and over) again. Heck, even I make this mistake sometimes! But anyway, make sure you color your links in a distinctive manner that will easily make them identifiable as links. Using the standard blue or various shades of it is brilliant, but even if you’re using any other strong color for a link, make sure it’s uniform and looks like something you would click.

Oh and one other thing about link colors, don’t make text that isn’t a link blue if it differs to the rest of the text on the page. People will think that piece of text is a link!

In terms of fonts, just make sure they’re legible and suit the portfolio’s style. People usually go with one of the following:

  • Tahoma
  • Verdana
  • Arial
  • Georgia
  • A few others…

I recommend you stay within those bounds for standard digital text. Although if you’re using text in imagery, it’s fine to differ.

Size

Using various sizes of font to form a structure around the content of your portfolio is a great way of making it easier to use. For example, if you have an overall page title of ‘About Us’ for example, make sure it’s bigger than any other headers you have further down within the content of that page. It makes sense to do this, and psychologically gives your content an element of structure.

Example:

Heading 1

Heading 2

Heading 3

Layout

Positioning & Structure

The layout of your portfolio is extremely important. Personally, I’m an advocate of minimalism. I don’t like too much on a page as it distracts me for what the main core purpose of the site is (well, unless that purpose is to distract you with too many things). The reason I say this is because not everyone is tech/web savvy, and therefore navigate through your websites as quick as you. I’ve witnessed this first-hand, particularly in those of the previous generation, where they take minutes looking for a single link. Your whole aim when designing your portfolio is to make it as easy-to-use as possible so that you reduce the risk of visitor dissatisfaction which can lead to lost business.

Take my portfolio as an example, it has a single preview box with arrows either side to navigate between thumbnails. The idea behind it is extremely simple, but works well. I wouldn’t say it’s the most usable function in the world because I find that a lot of people don’t know what that image in the center is, and don’t know if they should click it or not, therefore I had to write up a small instruction on the side to guide them.

What you should be doing though, is try to mimick the simplisity of design that a lot of portfolios out there show. That way, you’ll be able to create a portfolio that is a lot better, and in the long run potentially increase the amount of business you gain from that portfolio.

Always remember that the best portfolio isn’t necessarily the most ‘flashiest’.

Part 2 of ‘How To Make Your Portfolio Better And Get More Clients’ will be posted in the future. If you enjoyed this post, please don’t hesitate to subscribe to our RSS feed.

Comments

23 Responses to “How To Make Your Portfolio Better And Get More Clients: Part 1”
  1. bibi says:

    Although this post reiterates what many of us young designers already learned in school, it’s a great reminder! Sometimes it’s easy to get lost in design and this post really helps break down the basic attributes that a great site requires.

    cheers!

  2. Bogdan Pop says:

    I must say that having the website will look a lot better, and more professional if you had another email listed over there. It is a hotmail. Some prospects may think you’re just a high school kid who knows how to go around and edit templates, once you find them on the internet.

    A paid / owned domain email, and a land line phone will show a bit more professional, and the clients will be delighted.

  3. Taiyab says:

    I could easily add [something]@6creations.com there instead, so I think I will seeing as it brings with it many advantages. I’ll also add my number on there as well.

  4. Bogdan Pop says:

    To Bibi. Were you serious? You actually studied design in school? I envy you.

  5. Rob Hofker says:

    It strikes me as odd that you would need an instruction on how to navigate through a portfolio. To me that clearly indicates a bad user experience or interaction design. Try adding a navigation bar with thumbnails or small snippets of the designs.
    Also I feel that some explanation on the design should be better visible. I would put it below the image.
    The pop over full view has also an akwardly placed close button at the bottom, below the fold. Put it at the top, the common place for a close button.
    Adding to these remarks I have to say that although the content of the post is correct, it is hardly related to portfolio design. It’s about common sense web design.
    I do hope part II fills in the gaps I am missing.
    But I don’t know if I will stumble along …

  6. Taiyab says:

    @ Rob: Your opinion is valid in terms of my portfolio’s usability, I would definately agree with you there. I was bring up the portfolio in terms of minimalistic design; I didn’t have usability in mind.

  7. Bogdan says:

    Hey Rob, having a close button on the right top corner is not common. It is just, ammm… Windows!

  8. Rob Hofker says:

    @Bogdan ;-) I never wrote top right, but still it is something you see quite often and more over it makes sure that the user always sees the close button when viewing the full image. Where it is placed now the user needs to scroll,

    @Taiyab Maybe I am too much in the usability mindset and interpreted “better” as “more usable”. But then again I think “design” is about “usability”.

  9. Mike Summers says:

    There’s one thing that you didn’t mention… It is absolutely critical that you check for spelling errors. Few things will erode confidence in your skills more quickly than typos.

    By the way, “mimick the simplisity” should read “mimic the simplicity” :)

  10. AR Guy says:

    Taiyab, I noticed after looking at your site that you have a fairly large mistake. You have underlined headlines that aren’t actually links. People have become accustomed to underlined text being links and when they are not links, people click, and get frustrated when nothing happens. Also, you have links on your portfolio that don’t have a pointer finger. I know that seems knit-picky, but that is another thing people are used too. If these small, but common, practices are not followed, people may get upset and leave. I have been through a couple of these issues myself but after watching many people navigate through sites I have learned that even though it may not be as beautiful, these small usability issues can drastically help the user of a site.

  11. Taiyab says:

    @AR Guy: Wow, I hadn’t actually realized the underline thing on 6creations until now, thanks, I’ll change that now. I’ll also look into that pointer finger suggestion too.

  12. mark thousands says:

    Taiyab,
    What app /apps did you sue to create your preview box?
    Thanks for the info
    -Mark

  13. André says:

    Very good job..
    i´m a freelancer but i jst have a blog with
    jobs and i use it to prospect clients, but your article is very
    interesting…
    Andrew

Trackbacks

Check out what others are saying about this post...
  1. [...] How To Make Your Portfolio Better And Get More Clients: Part 1 [...]

  2. [...] the last part of this topic, I covered ways to improve your portfolio. Usability was the main issue at hand, and I presented [...]

  3. [...] Your online portfolio is one of the main windows for which potential clients can view ‘you’ as a whole. This is why it’s extremely important for you to make an everlasting impression on those that visit. Want to know how? Read ahead. View source [...]

  4. [...] How To Make Your Portfolio Better And Get More Clients: Part 1 [...]

  5. [...] FreelancerMagazine.com #1 e FreelancerMagazine.com #2 Salva e condividi questo articolo: Queste icone linkano i siti di [...]

  6. [...] How to make your portfolio better and get more clients [...]

  7. [...] How to Make Your Portfolio Better and Get More Clients – Part 1 (and Part 2) [...]

  8. [...] How to Make Your Portfolio Better and Get More Clients – Part 1 (and Part 2) [...]

  9. [...] Whether or not you actually make the plunge into freelancing in the end, you can still work on your portfolio. The great thing is, there’s no need for you to quit your job whilst doing such steps, as you could both work on your portfolio and work a full-time job. Your portfolio is perhaps one of the most important marketing tools for your business as a freelancer, so make it good. If you need some tips on how to create or improve an existing portfolio, then I suggest you check this article out. [...]

  10. [...] Seu portfólio é a etapa mais importante de todas para conseguir trabalho freelancer, é o seu marketing pessoal, então se você agora está pensando em desenvolver o seu, ou está achando o seu meio fraquinho, cheque esse artigo. [...]



Speak Your Mind