A Geoscience Education Site - Website UX Review

UX Expert Paul Boag reviews the website for the British Geological Survey (bgs.ac.uk), which provides services and advice around geoscience. It is a very large site that seems to have a long history. Paul provides guidance for updating the look and feel while restructuring the site with better content organization.

Transcript below.

Topics covered in this video: How design influences us, Visual design principles.

---

Transcript

Hello, my name is Paul Boag and you're watching First Impressions, a video series where I give my first impressions on a variety of different websites that have been provided to me by the wonderful people at Balsamiq who have been collecting various submissions over the past few weeks. So let's dive immediately into the submission that they have sent me this week which is the British Geological Survey.

I loaded it up just a few moments ago and let's have a look and see what we've got. I mean there's a really obvious thing, isn't there? As you look at this website the first thing that strikes you is the design. The design looks dated. Now, does that really matter?

Is it really more about usability than it is actually design? Well, yes and no. Yes, of course, your website has to be usable and that comes before everything else and certainly is more important than esthetics but you can ignore the value of design. You read some usability experts and you'd think that design doesn't matter, in fact, that design is a bad thing.

But that is not the truth. Design influences us at a subconscious level. You only need to look at slot machines in a casino to understand this. If you think about it from a purely usability perspective, you would walk up to a slot machine, it would sense that you're walking up to it. It would generate a random number and say you've either won or lost.

That's all. Right? You might have a button on there that you press to play another round. All right? That would be the most usable slot machine because that is the simplest version of a slot machine. At the end, it just generates a random number. But that wouldn't be compelling.

That wouldn't create a great experience. Right? It's the design of it, it's the esthetics, it's the gameplay that makes it addictive. And the same is true with a website. Your design influences us, connects with us at an emotional level. And it really does. And I know all of this sounds a bit kind of airy-fairy but you look at a design like this and it looks unprofessional, doesn't it?

Right? It doesn't look like it's professionally made. And so, our initial response is, "Well, the British Geological Survey is an unprofessional organization." Now, there's no real causal relationship between the two but it's like when we see a person for the first time, we make judgments about them before they open their mouths.

We're told we shouldn't do that but we all do it. Right? We're programmed to make a decision about something. And in fact, most people will make a judgment about a website in about 50 milliseconds, the blink of an eye. They will conclude certain things about that website and associated organization just by the design of it.

But not only does it maybe color your impression of the British Geological Survey as being unprofessional, it also makes you doubt the content as well. Because, if they're under-investing in the design of their website, what else are they under-investing in? Are they under-investing in the content?

And actually, what is written, if the design doesn't look professional, we will doubt and we will question the validity of the content that's being communicated because of the design. In the same way as if somebody looks shifty, right, we're less likely to trust what they say.

Okay? And again, there's no causal relationship between the two. Just because somebody who's maybe got [inaudible] eyes, or is looking, you know, shifty in some way, doesn't mean that what they're saying is necessarily not true. But that's the conclusion our subconscious draws. The same is true with websites.

Design matters so much. So how do we sort out the design on this website? It's obvious that this website has been under-invested in for a while now. How do we sort the problem? Well, I think the first area I would invest in is the imagery. Right?

Looking at this, I look at the imagery and, to be honest, it's badly compressed and it's distorted in some places. I mean if we click through this carousel, which by the way has just broken on me, you're seeing, you know, the stretched imagery that's going on here. And then, we've got typography being overlaid by text, you know, this page is particularly prominent.

Look, you can see... And it's all cramped in in this text overlaying the imagery and it's a wasted opportunity. We're talking about geology, right? Geology is magnificent. There's, you know, incredible geology in the world. And that should open up a wealth of possibilities for producing just gorgeous wonderful imagery.

But instead, that isn't happening. Instead, we're seeing really quite poor-quality imagery on the website. So invest in the imagery, give it space to breathe. Don't overlay it with lots of text. So that's one thing I'd do. Secondly, I'd look at the typography. Screen sizes have got a lot higher resolution since this website has obviously being created, and so, you've got quite small text, I would increase the font size.

But I'd also look at things like spacing. You know, the text is very closely packed to one another which makes it harder to read. And also, the spacing between elements...look how close these two elements are here to one another. Or look how close this text is to the search box. There's no space for any of it to breathe.

So I'd look at giving the typography more space, I'd make improvements there. And talking of spacing and padding, I'd increase the white space and the negative space in the design overall. Because the more negative space that you include in a design, the more elegant and sophisticated it looks and the more professional it looks, as a result.

I'd also look at removing some of these gradients and blocks that we've got here and try and break up that kind of very blocky design. Because that is a very dated look that you're seeing here. You know, it's that kind of portal look that was around in the late 90s, early 2000s that really goes a long way to dating the design.

Of course, that's all very easy to say. It's not as easy to do when you've got limited budgets. And I don't imagine the British Geological Survey is sitting on a big pile of cash. I might be wrong, but let's presume they're not because I know that there will be other people out there that, you know, are facing budgetary constraints.

So how can you go about improving a design like this when you haven't got a lot of money to do it? Well, to be honest, if I was the British Geological Survey and I was on limited budgets, I would just go out and find a good template. There are some great design templates out there. So there's companies like, oh, I don't know, TemplateMonster is one that's been around for years that springs to mind.

And, you know, sites like this, they have tons of really attractive beautifully-designed templates that will load up eventually hopefully, you know, and really will make a huge difference to your site just introducing some of these templates.

You know, look, just this first one that I happened to click on. You know, it's got, you know, much more space for imagery. Look at how much space there is on the imagery, etc. So just go out, find yourself a good template, and look at implementing something like that.

Very very cheap. We're talking, you know, less than $100 in most cases. And if your website is built on something like WordPress, that's even easier because, you know, you can just install the template and it kind of works by magic, in most cases. What about imagery? You know, the British Geological Survey probably can't afford to hire a photographer to travel the world and take beautiful shots for them.

So what are they going to do? How are you going to get that good imagery? Well, instead of relying on maybe some amateur photography that you've been taking over the years, just go out there and get some imagery that you can introduce. There are some great stock libraries, obviously, out there, like Shutterstock is a well-known one where you can get these subscription models, which means that you can download imagery that you want.

But maybe you don't even have the budget for stock imagery. Well, google it. I mean let's just Google "Geology." Right? And then, go to Google Images. I mean look at some of the stunning imagery that's available that you could be using on your website. Now, I know what you're thinking.

You're thinking, "Oh yes, but that imagery is copyright-protected." Absolutely, you can't just go to Google Images and help yourself to whatever imagery you see. But if you look, you can go to Tools, you can select Image Rights, and you can select "Labeled for reuse," "Labeled for..." Oops, I hit the back button, sorry about that.

"Labeled for noncommercial reuse," etc. So if we click on one of those, all of these images are images that we can use. Right? They're royalty-free images. And these days, there is so much royalty-free images online, it's unreal. In fact, there are sites dedicated, like Unsplash, that has some gorgeous imagery that you can search on.

All right? So let's search on geology. Like look at this stunning imagery that you can use, high-quality imagery that you can use absolutely for free. In fact, there are so many sites like Unsplash now that there are actually tools emerging which kind of allow you to search across all of these sites at the same time.

So one that I use quite a lot is one called Zoommy. And that has the ability to search across all these different sources in one go. Right? There is no reason why you can't have great imagery on your site. And there's no reason why you can't have reasonable design as well using a template, if you can't afford to get a proper designer. Don't get me wrong.

Of course, ideally, you want a custom design for your site that's beautifully designed by an expensive designer but we don't all live in that world, do we? Now, of course, design isn't the only thing that's going on on this website. We've also got too much information. You know, this is quite a crowded homepage with loads of different things. We've got quite a lot of...oh my word.

I was going to say quite a lot of top-level sections, then you roll over them and you see quite how much is under each one of them. My word, that's a lot of different options. Right? And we're going to find that people are just overwhelmed with all of those options, all of that text. Now, adding some white space, spacing everything out, redesigning it will help to some extent.

But that's not good enough, is it, for the amount of information that's being communicated. These guys...and I understand why it's happened, this website has obviously been around for years, hasn't had a huge amount updated and changed on it, I'm guessing, other than more and more stuff being added.

That's what happens to websites over time is more and more content keeps getting added to them and they become more and more complex, and so, you end up with too much. So these guys really need to take a step back and look at their content, do a content audit, and make every piece of content, every element, every page justify itself.

Does that thing need to be there? Right? Could it be removed? What would the consequences be if it was removed? The trouble with the internet is because you...there's zero cost of putting a piece of content online, you know, why not? Someone might find it useful. But of course, every piece of content you add makes it harder to find the piece of content that people really want.

You know, and even if you can't justify removing it, maybe you can hide it, put it deeper in the information architecture. And even with pages like...like this homepage, everything is equally balanced, everything has got the same emphasis. Right?

I bet this is the same throughout the site. Yeah, look, here, right? Look at all these different boxes, they're all equally balanced. There's no visual hierarchy. There's no indication of what's more important and what's less important. Okay? So we need to make sure there's some kind of visual hierarchy and a visual hierarchy that's based not around the organizational structure or how the organization thinks but around what tasks matter most to users.

So I mean if we look at some of these, look at how all of these options are equally, you know, designed. There's no hierarchy to them really beyond these sections. And these don't really make sense, from a user's task point of view. You don't go to a website going, "I want to see, you know, British Geological Survey's products," or, "I want to see their top-data services."

Instead, you've got a particular problem you want to solve, "I want data on erosion," for example. Okay? So we need to be matching the tasks that people want to use. So I'd recommend for these people that they do, you know, say, a top-task analysis.

Right? Because if they do a top-task analysis, that's going to help them understand what it is that users really care about, what's most important to them. And then, that enables them to say, "Okay, well, maybe we don't need this online because nobody's expressed an interest in it," or, "yes, it should be online but it's not as important as this, this, or this." So you begin to build up a hierarchy of information.

And then, once you've done a top-task analysis, identified what tasks users are interested in, then we can look at maybe carrying out a card-sorting exercise, for example, and we can refocus the information architecture around how the user is thinking and what the user's wanting to do rather than just organizing it into what's logical or the organizational structure.

Right? Because the information architecture isn't always logical, because users' mental models are not always logical. There's some weird stuff going on in this homepage. It's like content has just been grouped around, not even around organizational structures, but around content types.

"Here's the news, here's the events, here's stuff from social media, here's the videos, here's some links," you know, rather than what tasks people are wanting to complete. So there is a lot that can be improved on this website but it doesn't all need to be done overnight. You can do it in stages, maybe address the design first.

Then start doing a content audit, which is going to be a more time-consuming project. But even before you do the content audit, you really want to do that understanding what it is users want to achieve. Right? So there's three things that we can take away, whatever your website is. One, don't allow your website to get into this kind of state.

Right? You know, from a design perspective, look at evolving and developing your website on an ongoing basis. Maybe you've just redesigned your website and you're feeling smug because it looks so much more modern and up-to-date than this. But this website looked modern and up-to-date at one point. Right?

Do you have the time, the people, and the resources to ensure that your website is going to be kept, being updated and evolved over time? Or is it going to get stagnant and end up like this where all you're doing is adding more and more content to it? So keep your design up-to-date, keep it evolving, tweak it and improve it over time.

Secondly, step back every once in a while and do a content audit. Make everything, every element on your site justify itself. And third, understand your users better, understand their mental model, understand what task they're coming to your website to complete. Look at your analytics.

That will tell you what really matters and what doesn't. So really, the British Geological Survey website is a cautionary tale of how easy it is for a website, that's obviously been around for a long time, to get neglected, to become out-of-date, to become bloated, and how, when it gets into that state, it starts to negatively impact one's impression, not just of the website, but the organization itself that we can get to the point where we start to doubt the professionalism and the validity of the content being produced by the British Geological Survey, which is obviously the complete opposite of what they're going to want as an organization.

So thank you to the British Geological Survey for putting their work out there and letting me pick it apart. It's never an easy thing to do to hear criticisms of your website. But understandably, right? Totally understandably, you probably haven't got a lot of money to spend on it. But it's amazing what you can do when budgets are tight if you make use of templates, you make use of free tools that are available, free imagery, etc.

But you do need to put a little bit of time into looking again at that content and reassessing it. But for now, thank you for watching and join me again next time when we will give our first impressions of yet another website. But until then, thanks for watching. Bye-bye.

---