Content Process & Content Blocks

[00:00:00]
>> Okay, so you got a rough idea of the kind of content, it's probably just a bullet list. Like bullets of questions, bullets of functionality, bullets of whatever, so you got that. Now what do you do with it? Well, the first thing to realize, is that can get pretty damn big, right, that list.

[00:00:19]
Especially if you work on international websites like I tend to do with many different products across many different parts of the organization. And you're trying to deal with different user groups, going different paths, I mean, obviously you don't tend to deal with it all in one go. But even if you're just tending to deal with one part of it, it can get really complicated.

[00:00:41]
But even on a smaller side you can end up with a not insignificant list. So we need to basically now prioritize it, right? Because not all questions, not all objections, not all tasks are equal in people's minds, they care a lot more about some things and others. And we need to highlight those.

[00:01:00]
We need to make sure that that functionality, that content, those answers, whatever, have floated to the top and are quickly identifiable. So the way that I tend to do that is through something called top task analysis. And I'm not gonna get into a huge amount here because it's a big old subject.

[00:01:23]
There's a great article on the list apart website, where the guy who came up with this talks you through the process, how to do it. So I've got link in the slides, you can go and check it out yourself. But very briefly the summary of it, is you basically get users to prioritize, right?

[00:01:44]
You get them to say which of the various tasks, objections, questions, matter most to them, all right? So that means when you start wireframing you know, okay, at a glance they need to be able to see this, this, this, and this. And it really kinda helps provide focus to where different functionality is placed, and how it's organized.

[00:02:08]
The other thing that kinda, a little bit of a tangent on this, is that something can be important to somebody within a certain context at a certain moment. So, for example, let's say in your insight, I'm now coming back to your example a lot because you raised it.

[00:02:26]
But you talked about these micro projects where you're looking at a particular thing. I would still carry out a very lightweight top task analysis in a situation like that, or at least think it through in terms of what was most prioritized, because, let's say you're updating a form again.

[00:02:42]
Okay, so somebody's got a question that's really important to them. But that doesn't necessarily mean that question needs to be answered at the very top of the form, cuz that might not be when it comes into someone's head, right? They might not think of that. For example, what are you gonna do with my email address?

[00:02:58]
They won't think about that until they get to the field that says, enter your email address. So being contextually aware is quite important as well in those kinds of situations. But looking more kind of holistically on a bigger website scale, once you've kind of prioritized your content or content areas, and I'll say what you need to do is start organizing that.

[00:03:22]
And the way that I tend to do that is with card sorting. When I've got the budget and time to do that, so instead of me guessing as to how content should be organized and structured, I get some users to organize it and structure it for me. There's a great tool that's free at the moment called uxmetrics.com.

[00:03:42]
That does open consulting, and clouds card sorting, and to explain the difference very quickly. Open card sorting basically allows people to organize your different content areas in any way that suits them. With closed cards sorting, they have to organize it within predefined buckets. So closed card sorting is better when you're trying to validate a navigation you've already come up with, while open card sorting is better for getting initial ideas.

[00:04:13]
It's a really great tool, it talks you through the process of how to do it. Essentially, basically users just drag stuff into different groups. And then once they find those different groups, they just basically name the group whatever they want to name it, and they can create multiple groups.

[00:04:33]
And then you could analyze that data, just to give you some kind of inspiration into how to organize that, how to structure your website. It's not gonna do it for you, you're still gonna have to make some educated decisions. But it's a really great way of saving a lot of internal discussion.

[00:04:50]
Because one of the big problems that you come across when you're working on information architecture, which is what we're talking about here, is it becomes about ego and politics, right? I wanna be on the top level section because my team is the most important team. Obviously they don't say it like that, but that's the underlying message, right?

[00:05:08]
Or we wanna call our top section, top level product section, Gizmo 2.4. Well, nobody knows what Gizmo 2.4 is, so do we really want that in the navigation? So if you test and do card sorting, then you've got evidence that voids all of that kind of stuff. So yeah, it does take a little bit more effort and a little bit more time, but it's really worth doing to avoid that.

[00:05:34]
Next thing I do is I then map that content onto pages. So I've got my navigation, it's done, look pretty. I've got the navigation running across the side, I've got the sub navigation down the, sorry, main navigation across the top, sub navigation down the side. And then I'm just putting bullet points of the questions and things that need to be raised on that page, right?

[00:05:54]
So now I've got a map of my app, my website, my whatever of how it all kind of fits together without any attempt to design. So this is even before you do a wireframe, really. And like I said, I mentioned earlier that I just kinda throw something like this together in notion.

[00:06:12]
But you could use Google Docs, anything that can interlink pages will do it or just do it in plain HTML. We could go old school. So just helps you now to see the structure of the site however links together. In theory, you could test that if you wanted to.

[00:06:29]
You could test, can people navigate it, can people find it? But it is a great way of kind of visualizing that cuz you can show your client this, you can show your stakeholders this, right? To minimize the surprise later on, you could show them the research, you could discuss it with them.

[00:06:45]
You could get them involved in things like, for example, that brainstorming workshop of coming up with questions, and objections, and functionality. Start building them into the process. So we now wanna move a bit closer to being able to actually do some wireframing. So the next thing is to start chunking some of your content.

[00:07:03]
So one of the big problems that you'll find when you're working on things like site structures, is that you tend to start adding more and more things to navigations cuz everybody wants more and more stuff. She maybe start off with four top level sections, then it becomes five, then it becomes six, and then it becomes eight.

[00:07:24]
Product categories are another great example of this on e-commerce sites that get longer and longer. Drop down menus on forms are another example where they get longer and longer. So this is kind of a fundamental problem you need to deal with when it comes to navigation and that kind of thing.

[00:07:40]
So, the problem is that we can only hold about four things in our short term memory, right? So that's why your credit card, if you've ever looked at your credit cards, I better get my credit card out and show it on camera. That would have been a really bad idea.

[00:07:56]
Well, if you look at your credit card number it's 16 digits long and it's broken into four sets of four, because we can only have four numbers in our head at a time. So when you get into navigation that's got like 20, 30, 40, categories in or something like that, it's just, forget it, it's ridiculous.

[00:08:13]
So the way you get around this is by chunking it, just like the credit card numbers chunked into four sets of four. So I tend to do that with content as well as we're starting to think about content. So beginning with navigation. So if I'm working on a website like the one that's on the screen now, I can split the navigation into different groups.

[00:08:39]
So there's one group that is dedicated to bout the company. There's another one that's the resources that the company provides, and then the third one, which is kind of utilitarian stuff. So we can do that kind of thing in our navigation to help break things up. And then also even within my content itself, right?

[00:08:58]
That's where you think about a page, and the pages structure and all the things you wanna communicate. I tend to think in terms of content blocks, right? And this is quite an important thing to communicate to any content creator that you're working with. Cuz a lot of people who aren't familiar with writing for the web will produce reams of copy [LAUGH], right?

[00:09:24]
Like they're writing an article, and that's absolutely useless online. People only read about 25% of the copy on a page. And so, they scan it, they don't read it word for word. So what we wanna do is break up our copy into content blocks. So let's say we've got our list of benefits, right?

[00:09:46]
We identify some benefits, or some questions, or whatever kind of content you've got. You wanna display each of those as a separate content block. And that content block normally consists of a heading, maybe a short description that explains what that benefit is, what that feature is or whatever.

[00:10:05]
And then maybe a link to more information. So if you're working on a content heavy website, start talking very early with your stakeholders about content blocks and this concept. Because it stopped them delivering content that really is inappropriate for the website. And I tend to show them examples like this.

[00:10:24]
You can go to pretty much any website, this happens to be the Stripe website. And you can see how basically they've got content blocks within content blocks here, where you've got kind of a headings for each content block. You've got short description, a link, and an image, right?

[00:10:43]
So as you start to draft up content, whether you're doing it on behalf of your users or, sorry, your stakeholders, or whether you are working with a content creator. Start thinking in terms of content blocks, start thinking in terms of chunking. And I put all of that into notion, my really crappy kind of wireframe thing that just shows the basic structure of the site.

[00:11:11]
And only once I've done that do I really start to wireframe pages