A Freelance Web Designer Portfolio - Website UX Review

UX Expert Paul Boag takes on a freelance web designer's portfolio site (juanfernandes.uk). As someone who has used freelancers before, he considers how well it answers his three main hiring questions: Is their work any good?; Can they do what I need?; and, Will they fit in with my team? See how focusing more on specialization and process details would make this site really stand out.

Transcript below.

---

Transcript

Hello. My name is Paul Boag, and you're watching First Impressions, a video series where I look at websites for the very first time and give my initial reaction, a cross between usability, testing, and maybe a little bit of a critique. The websites are provided by the guys at Balsamiq, who've been collecting them for a little while and they send them through to me to check out.

So let's dive in and see what I've been sent this time. Okay. So the website we're going to be looking at today appears to be a freelance website designer site. A freelance web designer with 12 years of experience. He designs and develops responsive websites using industry best practice and standards, including HTML5, CSS3, and some jQuery.

Okay. So I ran an agency for the best part of 13, 14 years. And from time to time, I would need to bring in freelance web designers in order to kind of supplement my internal staff. So I very much know about going and visiting websites like this and trying to assess the people involved.

And I kind of always used to ask myself three questions really. First, is their work any good? Secondly, can they do what I need to the standard that I need it? And third, will this person fit in with my team and the way that we work? So maybe the idea is to explore this site and kind of answer those questions.

Now, I have to be honest, as far as the first question, is their work any good, I'm not blown away, if I'm honest, by looking at this site. The design is a little bit dated, if I'm honest. So because, of course, the first thing you look at is the website itself because this is, you know, what this person is able to produce without any constraints or with a client telling them what to do.

And I'm not blown away. I'm also kind of... I guess the first thing I need to do is look at their portfolio work. So let's do that, let's pop through here. Okay. So we've got some various websites. Let's go to, say, Land Rover.

Okay. Right. So there's some, I mean, the designs, these designs don't look too bad, I have to say. And also, I'm noticing here that, you know, it's got some fairly complicated stuff in it. It's, you know, designed responsively from the looks of it.

Let's have a look at some others. You have mobile first. Yeah, okay. So his client design work seems to be a little bit better, actually, than his own website. Probably because he spent longer on it, which is understandable. I'd like to be able to bring these up bigger because it's kind of problematic getting a really good look at what's going on here.

So yeah, that's something. When it comes to your portfolio, make your work as big as possible so people can get a really good look at what you're looking at. Also, I'm not seeing any links to live websites here. Now, I can kind of understand that because, you know, inevitably, you know, they messed with the website and it's not as good as it could be.

But it would be nice to at least see some quality of the code behind that website. So maybe some code snippets or, I don't know, maybe I can download some templates. Because this guy talked on his homepage about, yeah, he talks about HTML5, CSS3, and some jQuery.

So he obviously does some front-end coding, and I'd actually like to see the quality of his code. Let's have a look actually, let's have a look at the code here. I've been known to do this on many occasions, right, look at the code behind someone's site. Okay. Well, I'm already seeing some stuff that I quite like the look of here. It's got some nice, neat semantic code in it.

Very consistent naming conventions and that kind of thing. So the code looks pretty good. Now. I'm beginning to rethink a little bit. Yeah, he's got no jQuery going on.

Now, I'm quite impressed with the code. Now I'm beginning to reassess him a little bit in my mind. So let me explain what I mean by that. So I'm seeing a somewhat dated piece of design, but with some excellent underlying code. And now I read the text, I'm seeing things HTML5, CSS3, jQuery, responsive, that kind of stuff.

I assessed him as a freelance website designer, because that's how he presents himself to the world. But actually, I think I'm looking at a front end coder here, right? So suddenly, that repositions him, okay? And this is something that I see quite a lot, that because this guy is trying to pick up client work and stuff like that, he's trying to offer a huge range of difference because he's positioning himself as a jack of all trades.

But actually, I think he would do himself more favors by specializing, right? He would win higher quality work if he just specialized in front end coding and positioned himself as a freelance front end coder. Because his quality of code is much better than the quality of design he's producing. I'm not saying, you know, he's not capable of doing good design, because obviously his portfolio shows that, but actually I think maybe he would do better from specializing.

I see this a lot with freelancers, they're almost afraid to specialize in something. But when you specialize, you become seen as an expert in that field. And so, ultimately, that tends to win you more work than you would if you were a generalist. It seems a bit counterintuitive, but it's true. And also, you can charge more if you're a specialist as well.

So that's looking pretty good. I just want to pop back into and look at these portfolios again in a little bit more detail, have a look at some of the things that are written here. So he's talking about, well, he's done some HTML, PHP. Yeah, that's useful, what technology he's doing. He works with a CMS.

One of the things that's worrying me a little bit, let's have a look. Yeah. I'm not seeing anything more modern than 2015 here. And what, we're in 2019 at the time of recording this video. So that makes me a little bit nervous, you know? Where is his more modern work?

Why hasn't he put anything online more recently? Is it just that he's neglecting his own website, which causes some alarm bells with me? Or is it that he hasn't produced anything good more recently? Now, he could very easily deal with that just by removing the date. Why have the date there? Do you see what I mean? And actually, I see this a lot, where people put dates in.

And actually, it just dates the content, it makes the content feel old even though it doesn't necessarily need to be. I bet his blog does the same thing. Yeah, sure enough. Yeah. 24th of April. So you've got dates in here. Now, these dates are fairly, you know, regular and up-to-date.

But even so, why have them there? What value do they provide? Dates just make life difficult. Remove them wherever possible, in my opinion. Because, you know, ultimately, they just make things look old. So is his work any good? I think if he positioned himself as a front end coder, my answer would have been yes.

But as positioning himself as a designer, maybe it's a bit more...I'm left doubting, I'm left wondering whether he's a good fit. Because now it's bringing into my mind, you know, if I want a front end coder, and I hire this person because he's got good front end coding skills, is he going to get frustrated and bored because he's not doing design as well?

Which brings me on to, is this person a good fit, you know, will he fit in with my team, really work well as part of the team? So how do I assess that? Well, often, I go, testimonials, because that's what you want, isn't it? You want some great testimonials. Now, actually, I must admit, I'm a bit rubbish at this, I'm not very good at getting testimonials out of clients.

It kind of feels a bit embarrassing asking them, but it's a really important thing to do if you're a freelancer. So it's definitely the kind of thing that you want to be looking for. Right. But the problem that I'm seeing here is that these are pretty long testimonials. And anybody who's going to be looking at this website is not going to be giving it their full attention, they're not going to be reading every word.

So you need to kind of help them pass these testimonials a little bit better. So just kind of pick out some key phrases and highlight them in some way. So I had the pleasure of working, right, it's a pleasure to have worked with this person. That needs to be highlighted, right? Incredible ingenuity.

These are brilliant little phrases, it can just highlight in the sentence to help people, you know, see a little bit more about them. Yeah. I had the pleasure of working, absolute pleasure to work with, very thorough. You see, these are great phrases, and this is really making me feel much better about hiring this guy.

Job title isn't accurate, and that's not surprising because his skills and expertise are impossible to capture in a word or three. I've worked alongside him for years in some of the most audacious projects. A specialist, generalist, part designer, part front end developer, part behavioralist. Okay.

So I can see, yeah, where you might be reluctant to specialize, but I think it would probably help you. Okay. So I look at testimonials, that, you know, I'm hearing all the right things here. He doesn't get flustered, he's lightning fast, you know? So this is reassuring me a lot.

But we need to make these testimonials much more accessible, I think. The blog posts, blogs often give me a sense of whether I can work with somebody as well, so let's have a look at his blog. What are these weekly notes? Okay, this is almost like a diary. It's good to see that he's reading stuff.

That's good. That means he's a continuous learner, which makes me feel good. So, you know, having a reading list like that is a great idea. This isn't that helpful, if I'm honest. It's good to hear about some of his work, but I'm more interested in knowing a little bit about, you know, what his working methodology is, right, or how he likes to work.

So, you know, does he like to work as part of a team or does he prefer to work alone? Does he like working from home or does he like working in the office? Does he like to be in control of the whole project, design and development, or is he happy just to do a part of it? Those are the kind of things that I need to know to work out whether he's going to be a good fit for the team.

And I'm not really finding that on these blog posts. About me. So again, you know, I wondered whether I'd find that here, but again, I'm not. I'm getting a bit about his career background, which is not uninteresting, but I'm not finding out that stuff about whether he would fit nicely into my team. There are a few little hints I'm seeing in the copy that's kind of helpful.

So, for example, I love the fact that he's writing in the first person the whole time. And I noticed on the homepage, he goes, "Hey, I'm..." You know, he introduces himself. He's being friendly and approachable, and I like that. I just want to get more of a sense of him, who he is. A video might help.

A little video of him introducing himself. And I need a bit more of a sense of how he likes to work. So yes, the testimonials was really strong, but I think he just need to be a bit more accessible. Yeah. But other than that, not too bad. There's definitely hope there, because the testimonials are so strong.

Then the last question that I tend to ask is, can they do the particular kind of work that I need, right? Now, he's got this skills box which is really good. So I know, at a glance, you know, that he's up-to-date with his skill set and the kind of things he's doing.

Also, when I was in his portfolio, you know, he's making it clear what tech he's using and, you know, what kind of stuff that he's doing on a project. So I can get a sense of, you know, like he's talking about he's mobile first, which, you know, is important to know. So that's really good.

I'm doing well with that. There is one word, however, that's making me a little bit nervous, right? Which is he lists HTLM5, CSS3, and some jQuery. It's this word "some" that is making me a little nervous. It's funny, isn't it, how a single word can have such an impact. And it makes me think that he's actually not very confident with jQuery.

And so what does "some" mean? Does that mean he can just do some copy and paste of jQuery? From a front end developer, I'd expect a little bit more in that regards than just "some." So we do really need to think about the wording that we use on our site. And to be honest about our level of expertise, yes, do that, but on the other hand, don't put yourself down unnecessarily.

What I'm not seeing here is any real detail in terms of how he works and how he approaches things. So saying, for example, you write HTML5, well, big deal, anybody can write HTML5. But, you know, how do you do it?

You know, is your code semantic? You know, is that important to you? What about accessibility? How do you approach that? You know, if you do CSS3, are you using something like Sass, or LESS, or something like that behind it? What's your, you know, preferred content management system? How do you approach responsive design?

Now, I would expect to find that kind of thing as articles in his blogs, but it seems to be mainly these weekly notes, which, to be honest, are very little interest to me. Oh, okay, there are some exceptions. So he's saying a little bit about, right, he obviously works with Perch. We got some code examples here. Here we go, that's more like it.

Keep track of tasks. Okay, so this is a little bit, this will be useful for, will this person fit, you know, give me a sense of how they organize themselves. So he obviously thinks about how he organizes himself. So I think I would be tempted to drop the weekly notes, drop the date, so you don't have to update them regularly, and then write me half a dozen posts about how you approach your work, right?

How you approach responsive design, what you've learned about jQuery, a little bit about how you go about coding. So even if your blog only consists of say six posts, you know, about different aspects, that's perfectly fine, it gives me enough to go, "Yeah, this person don't only has the basic skills of being able to write CSS and HTML, but actually can write it in a way that is really useful to me, you know, and makes a difference.

So there you go, there's a little bit about freelance websites and how to go about creating a good freelancer website. So let's just recap what we've talked about so we're clear. The three big questions you've got to answer is, is your work any good, can you fit in with their team, and can you do the particular type of work that they need?

Okay. So what that means is, is that you need to go in depth into your working methodology and how you approach things. You need a compelling portfolio that is more than just some small screenshots, but actually breaks down the project, and how you work on a project, what you did on the project, maybe uses some live code example.

Almost blog post-level case studies is what I'm wanting to delve into. And then the other thing that you're really going to need to look for is making that connection with your reader, all right? So they feel they get to know you a little bit. So make sure you've got, you know, maybe a video or you write in this very personable, approachable way.

And then, of course, highlight these testimonials. These testimonials are by far the best thing on this website. The other thing that does work for him... I was going to wrap up, I haven't quite managed it, have I? The other thing that does work in his favor is he's got some big names here, right? McLaren, he's got, you know, Virgin, he's got Land Rover.

So, you know, that kind of social proof works really well. Well, if these big names hired him, then he must be good. So again, look for some big names. But a little tip off of the back of that is, don't only list big names. I've made this mistake on my own website, that I list all my biggest clients.

And I've had people before say, "Oh, okay, but he's obviously too expensive and too big to work with me," right? So make sure it's a mixture of bigger and smaller clients. But other than that, a good, solid website. And thank you so much for having the bravery to put this out for a critique. And I think it's taught all of us a little bit about how to improve our freelance websites.

But until next time, thanks for watching.

---