Computer voice
UX podcast episode 294.

[Music]

James Royal-Lawson
I’m James,

Per Axbom
I’m Per.

James Royal-Lawson
And this is UX podcast, balancing business technology for people in society every other Friday since 2011. And we have listeners literally all over the world, from Chile, to Mongolia.

Per Axbom
And today, we get to geek out in one of our link shows where we each bring an article of some sort to the table, and we talk about it for about 15 minutes or so, and pick apart some common topics. This is one of those shows where we tend to get really concrete with our opinions about real hands on UX design. Whereas often in interviews, we are more strategic and talk about broader issues.

James Royal-Lawson
But even with these ones, sometimes Per we get, well, I think that’s one of the fun things that are made for link shows that we go high and low. There’s some articles where we really nerd out on some articles where we kind of reflect.

Per Axbom
That’s very true.

James Royal-Lawson
You know, look at things from different angles,

Per Axbom
But mostly you and you and I get to geek out.

James Royal-Lawson
Oh, yeah, mostly mean you get to just play around with articles we found. And today, I think we’ve got one of those mixes where we do geek out on details, and then also where we geek out on details there as well, I guess.

Per Axbom
Yeah, but it’s also – we’ll get to it. So the articles are, the first one out we’re going to do is designing the perfect button. And it’s by Domus Markevicius. Really hard to pronounce that name for me. But I hope I got it right.

James Royal-Lawson
Latvian. So using some of our Swedish skills, we’re trying to pronounce Latvian correctly, but no, it’s not.

Per Axbom
So Damas, yeah, he works at Wix which is one of those create your own website Services. He’s a team leader for team of designers over there. So this is an interesting one,

James Royal-Lawson
The design system group.

Per Axbom
Yep. And the next one, James, is,

James Royal-Lawson
The next one is Can a website sitemap create better UX? This is an article that appeared on Loop 11 earlier this year, and is by Kelly Breland. I think that’s maybe how you say that. A digital marketing manager for SE Ranking.

Per Axbom
When it comes to designing the perfect button, which is a great of course, article name, it makes me wonder, of course, what is there, is it even possible to design a perfect button. But there’s a subtitle.

James Royal-Lawson
Surely, Per, you’ve designed plenty of perfect buttons over your time?

Per Axbom
I have designed the perfect button. But then of course, I’ve designed a more perfect button six months later to replace it. And I constantly keep doing that. As I get older. I really liked also how this article is structured, it’s very easy to read, it’s very easy to get to the content and get something from it. Although of course, I have some objections to some of the things that he’s outlined, which is fun. Because we can always, always geek out some more.

He starts with helping us understand why are buttons so important because, of course, a lot of companies actually measure their success by button clicks. And that’s a whole other show we can do about why how do you measure. But really, it’s important because this is how people get to do something. People come with an intent in mind and to try to accomplish something, then you often need to click buttons, or otherwise links, to get to the information or the content or the features they want. And he starts also off with quoting the Google principles for a good button.

James Royal-Lawson
I think this comes from Google’s material design.

Per Axbom
Identifiable, findable and clear. Which of course they sound obvious to most of us when we hear them, but then he starts going even deeper into, so what do each of these mean, which is really nice as well. So I like that when you’re not just dropping these adjectives, but also actually getting into what do they mean in this specific content?

James Royal-Lawson
Yeah, he does actually, like you say he goes through each of these aspects plus some more. And what I liked about this is that they illustrated it with experience their own experience over many years, at Wix doing work with the design of these buttons. Presumably it’s part of their work with their design system, but that does give it a feeling of, well it anchors it in a bit of authority, I guess is what I’m saying there. You can even see what they’ve done and he’s open about some things that didn’t work and some things that do work. And that’s nice to see.

Per Axbom
I like that. Yeah. The next sentence after those principles is that a button must clearly communicate what it does with zero space for interpretation. I may have a tiny bit of objections to that, because there’s always interpretation going on, as a person who’s trying to understand the purpose of a button, which is the whole challenge that he actually is communicating through the article. And we start with this discrepancy with talking about icons, which help identify context maybe. And there are several case studies throughout the article explaining why icons lose out to text each and every time.

James Royal-Lawson
When you say icons, Per, you mean, a button that’s solely,

Per Axbom
Yes, exactly.

James Royal-Lawson
That’s lacking text of any kind.

Per Axbom
So icon-only buttons. And we love to play around with these. And especially when we go with mobile first. We realise you don’t have much space, we’re gonna go with the icon only, and people will hopefully get that. And it usually is quite hopefully, because as soon as you add a text, which seems so obvious when you do it, that if you actually have the label there, then people understand it. It’s funny how a lot of designers have such a hard time grasping this simple concept.

James Royal-Lawson
Also Per, we’ve all been in meetings where, or designing in situations where you get fight back until you got everyone knows what that means. So you get told, you don’t need the text, because everyone knows what that means.

Per Axbom
Exactly.

James Royal-Lawson
You know, that’s one nice when you kind of see results from testing, which again we’ve seen, that people do find it easier when you have text with these buttons. I don’t mean to say that there aren’t situations for expert users who use interfaces very regularly,

Per Axbom
Extremely experienced users who use it every day, every hour.

James Royal-Lawson
Muscle memory plays a part and so on. So again, there’s leeway here for situations where it can work.

Per Axbom
One of those people tell me all the time that when I question it and tell this story is this button for a camera, in most video meetings today, where I have this story a person told me where a person’s mother mistook the icon for the camera, which is like a square with a triangle on the side, probably you can recognise it if I say it like that. And they thought it was a fish. I pressed on the fish. There are no icons that are universally accepted.

James Royal-Lawson
We have an episode about that. When I even even talk about my mom’s flower that we have to we have to click on when I needed to adjust the settings of something.

Per Axbom
Oh, the gear icon? Yeah. Yes, of course.

James Royal-Lawson
That’s recommended listening coming early.

Per Axbom
So we talk about the findable, we talk about making a button clear. And then we get into the text as the primary element explaining the buttons intention. Clear, predictable, simple, starting with a verb if you want to encourage action. So it gets into these tiny details and micro-interactions and how to help the button actually explain what it does.

James Royal-Lawson
With this though Per, you’re talking about the situation where you move from having like, okay, cancel, to having to replacing the OK with with something more explanatory of what is actually going to happen when you click OK.

Per Axbom
Yes.

James Royal-Lawson
Yeah. And I think the example in the article is, I think they have move-to-trash or whatever. So instead of instead of saying, Okay, so the question is, do you want to move this website to the bin? Instead of having Yes or Okay, as the primary button there, it actually says move-to-trash, move to bin. So you’re you’re reaffirming, through the language of the button, you’re connecting it to the title, to the actual action much much stronger by having the explanatory text.

Per Axbom
Exactly. And the example he has higher up is actually the difference between having buttons like premium or upgrade to premium, full list, or view all invoices or notifications and turn on notifications, where the word combined with the verb actually encourages people to take the action a lot more clearly. Again, you’re adding more words, which a lot of people seem to have a hard time with.

James Royal-Lawson
Well, we have a hard time, Per. It’s just one of the things. I’m still not really completely confident about the best solution for long text on buttons. Because you know, we have all these grid designs and these kind of design components standard sized components, buttons that have to be in like 100% of the screen, one line of text, or the third of the screen. Then you start to have multiple languages for your interface. And suddenly, Move to Trash ends up being, you know, three times as long in other languages and it breaks your button.

Per Axbom
Exactly.

James Royal-Lawson
You end up with dot dot dot dot dot dot at the end of the text.

Per Axbom
It’s extremely difficult.

James Royal-Lawson
That’s a problem space.

Per Axbom
I would love someone talking about making the perfect button and having an example in every language across the world, there are seven thousand –

James Royal-Lawson
Yeah, how we just calm things down with all the too-long texts. How do you deal with too long text on buttons?

Per Axbom
It’s very rare that I see, speaking of responsive design, that you actually have full text on buttons or more text buttons when you have a larger screen and less text on a button when you have a small. I’ve heard people talk about that. But I’ve yet to think of an example actually, where I see them going on. Often you can see some versions going to icon-only on smaller interfaces, and then adding the text on bigger interfaces. That’s the more common.

James Royal-Lawson
Yep. And he also got the idea when you you have slightly more explanatory text under the button. I’ve seen that too. Yeah. Like, you know, the move to bin or move the trash thing. Underneath it might say, Don’t worry, you can undo this later.

Per Axbom
Oh, yeah, exactly. Right. And hierarchy is the next topical area, which sort of mixes into and overlaps with the next one as well, emphasis. I reacted to this as I was reading it and I think you did as well.

James Royal-Lawson
Yeah, I did. Yeah.

Per Axbom
Because it wasn’t clear to me what the obvious difference was to hierarchy and emphasis because usually when I talk about these things, I talk about primary buttons, secondary buttons, and those should be designed differently to indicate this is the one that most people usually click or the probably the button you’re more likely to want to click in this situation.

James Royal-Lawson
I actually think Per, though, in some ways in the article he has hierarchy. Then it has placement and emphasis as two bits after that. And I wonder if we probably should have interpreted placement and emphasis as aspects of hierarchy.

Per Axbom
But they’re different sizes, those headings. This is interesting. So, speaking of hierarchy, the title heading for hierarchy is the same size as the heading size for emphasis.

James Royal-Lawson
Yeah, it’s the same visual size.

Per Axbom
I love how this became a meta discussion about hierarchy.

James Royal-Lawson
Yeah. And interestingly, I mean, God now we are geeking out. So hierarchy is actually a h1 and placement is h2, an emphasis is h1.

Per Axbom
Exactly.

James Royal-Lawson
No. So emphasis is the same level of hierarchy and placement is, now we are geeking out. But the headings, the headings are a bit kind of messed up here. That’s probably Medium’s fault.

Per Axbom
But when we’re speaking of hierarchy, it makes sense to me to also include this idea, or what I actually alluded to that I wanted to object to in the beginning, was that there are some things I’m seeing here that aren’t buttons to me, but are actually drop down menus. Because there’s an arrow pointing down from the button and it opens other stuff that you can click.

James Royal-Lawson
So you’ve got the the examples where the button is actually a drop down. And then you’ve also got the Split button example where it’s a button with another button squished up against it, that actually is a drop down. Yeah. Or button with list, I guess.

Per Axbom
Exactly. So that brings home the point where it’s someone sometimes we maybe have to distinguish more about what is a link? And what are the different outcomes of clicking a button. Does it open something else, does it change something on a page, does it bring you to another another page on the site? Does it just do something behind the scenes and give you a status message? That’s hard to actually communicate through the button itself.

James Royal-Lawson
But this is a really really good point though Per. Because this is one of those fundamental things that we do go back to an awful lot there and it ties in lovely to accessibility. That you know, we’ve ended up with a lot of situations nowadays where we visually have things as buttons, especially in the world of call to actions, of primary buttons and getting people to convert by clicking on things like create an account and so on, buy now.

But when it boils down to it, a lot of these buttons are actually links. So the general rule when it comes to this is links are for navigating. So links take you to another URL, another link on the web. It might be on the same page actually as an anchor link but you navigate somewhere with a link and accessibility-wise, they should always be links. So, now we’re going to the coding world of things. This is where designing and coding overlap an awful lot, because buttons, on the other hand, are things that execute functions. Something happens when you stay on the page, generally.

Per Axbom
Unless you’re submitting a form, because then you are actually going to another page, but you’re performing an action and the message that you get based on that, should actually tell you that the action was successful.

James Royal-Lawson
Well, traditionally, you maybe would go to a different pitch. I mean, now with the way that forms are built. I don’t think that’s the case. The rule holds, Per, that a button is something that executes a function, executes an action. And, you know, we might sound like we’re being like stubborn about this, because like Designers design, and Coders code.

But when it comes to screen readers, if you have a button that’s a link or a link that’s a button, they come in two different places in your screen reader software thing. It’s not easy to find stuff. Suddenly things that you’re looking for to navigate are hidden away in the list of buttons that you think is for actions for functions. So it can be a real real blocker.

Per Axbom
And that was my point of also about the dropdowns. If you’re not using the standard drop down functionality in the code for displaying that drop down, it’s going to be harder to navigate for someone with a screen reader.

James Royal-Lawson
So backing up there away from the code a little bit, our responsibility as designers is to think about how far we push the boundary of designing the appearance of a link to be a button. And whether we should distinguish, in some way, between link buttons and buttons, to functional buttons? Because I think we’re quite bad at that.

Per Axbom
I think so as well. Yeah. So as I’ve been browsing as your, as you’ve been speaking, I’m sort of agreeing with you now that the emphasis Heading should probably be in h2, because the way I’m reading it now it is actually a subheading, of hierarchy. Because it makes sense with the style and the size that comes after that. Also talking about hierarchy, the size of the button, the smaller it is that the harder it’s defined, it also indicates hierarchy. Of course.

James Royal-Lawson
That’s really nice that we’ve managed to link headings and buttons, because visually, design-wise they, yeah, there’s a lot of exact qualities to them that are similar.

Per Axbom
So much overlap. So creating harmony on the page, so it’s easy for the user to read and understand that’s our sort of goal with of course, hierarchy. So, excellent summary of each section as well that he’s doing in this article. So, I mean, it’s it’s an excellent reference article for the next time you’re designing a button, I think. Lots of good advice. Lots of things to reason around with your team probably, that will be a fun exercise. Talk about these things, talk about how you reason around the buttons, and reflect on how you can perhaps make them even more perfect.

James Royal-Lawson
And a stimulating article. Me and you, we’ve talked now what probably quarter of an hour now, when we’re recording, we’ve talked a fair bit beforehand, as well. And, you know, we’re getting into discussions about accessibility, usability, design systems, buttons versus links, split buttons, dropdowns. We even had a chat, which we’re not gonna go into now, about success buttons. Now you said about micro copy and content design. This is a wonderful treasure trove of inspirational material.

Per Axbom
And I think this is what design teams should be doing more often. I don’t think they’re doing it enough. Send it out to the team, read this article. And then let’s spend just half an hour talking about it together and see what our takeaways are.

James Royal-Lawson
Great. I like that. Or they could send out our podcast, listen to that for a quarter of an hour, and then discuss that too.

Per Axbom
It’s just levels upon levels. Turtles upon turtles.

James Royal-Lawson
Turtles upon turtles, I don’t know.

Per Axbom
Turtles all the way down.

James Royal-Lawson
Turtles all the way down. I have no idea what you’re talking about. Normally it’s me that loses you with those kinds of weird references. So now we’re moving on to can a website sitemap create better UX? As I said in the intro, this is an article that is written by Kelly Breland originally published in April on the loop 11 website. We had them as a sponsor back in the day Per, I believe.

Per Axbom
Yeah. Many, many years ago.

James Royal-Lawson
Yeah, testing software. And well, to give a bit of backstory. This article, I did notice it pretty soon after it came out, I think back in April. And my first reaction to it was a bit kind of, oh god, some of these things I don’t quite agree with. And there’s things that are not historically correct. Just sounds a bit of a weird angle on things. Oh, I don’t know but I just kind of, I let it go. I thought, James you’re just making too much of a fuss. Then it popped up again, a little bit later, a month or two later, I saw it. And I think I even saw it a third time.

And it appeared in one of those newsletters you get with summaries of articles from different places. And I read it again. And this time, it was on Medium, not Loop 11 website. And it was at that point, when I got even more frustrated about it, because the penny dropped, that it was content marketing. And I kind of realised that the feeling, what I picked up on I think on my first read of it was that it wasn’t maybe quite as deep and as genuine, maybe as it looked like on the surface.

And that its true purpose, perhaps, wasn’t educating me about these concepts. It was actually to market something else. And, you know, in our industry, there’s a lot of them. Me and you, Per, we’ve written articles for a long, long time, and on the podcast, too. So we’ve got a history, a tradition of, of writing content, because we want to share knowledge through that,

Per Axbom
Right, you want to learn the article want to explore, explore a topic, get deep into it. It’s often a way of for yourself, also to learn something new as you’re writing, because you’re really intrigued by the subjects you want to really make sure you get it correct.

James Royal-Lawson
Yeah and and one of the issues I have with with content marketing, is that yeah, I know content marketers now will, probably some of them will say, the good content marketing is exactly the same as what you and Per are talking about. But the problem is, there’s an awful lot of content marketing, that hasn’t managed to get away from the fact that they are marketing something. And it’s marketing that something that is the essence of what they’re doing, the reason why they’re doing the content.

And that sometimes shines through really brightly over time, it doesn’t, it’s not noticeable. And that’s when it is good content marketing, I guess, when it’s genuine content, good content. Anyway, so now I’ve done quite a lot of intro into my like emotional reaction to this article. But anyway, to leap forward a little bit into what is it about?

Well, the article, as you can see from the title, can a website sitemap built yet better UX? And it goes straight into saying that, while XML Sitemaps are slowly becoming standard for website development, UX Sitemaps, are relatively new. However, UX site map is essential for UX designers and marketing experts, because it allows them to understand users better. So you can tell Per, and I think you had the same reaction, just that first sentence kind of puts me off kilt.

Per Axbom
Probably that was it, when you sent me this article, it was like that was my first reaction. How is it calling this new? Maybe because it’s a new name. And I also have to stress and be careful here, because I don’t want to be too critical. It is a topic that is interesting. What we are perhaps talking about here is our reaction to it. And whether or not this type of content has a place, does it create value?

James Royal-Lawson
Yeah.

Per Axbom
Maybe it does, because it actually explores a topic that is useful within UX, but perhaps presents it in a way that isn’t true to the history of what Sitemaps are and what they can accomplish, or even to an information architecture profession. And so that’s perhaps what made us wince a bit. But that could also be because we are old and opinionated.

James Royal-Lawson
Exactly. We were of a different generation designer. And I’ve reflected about this article a fair bit because it does have, I mean, there are some things that are factually wrong, there are some things that are factually correct. So the underlying usefulness of how, especially if you’ve come from a world where an XML sitemap is the first thing in this space that you’ve come across, then I can see how this article probably would help you understand a bit more about other incarnations of similar data, I guess.

But it made me start to reflect on not only content marketing, but I’ll start to reflect on, well, where are we with education and with knowledge transfer or how we communicate. There’s always gonna be a degree of relearning stuff. I mean, that’s how generations work. You’ve discovered something again, and you learn it again. But I kind of wonder how good a job we do at times of helping people rediscover and relearn.

So in this article, from the the lens, or the angle that they come from is, you are working with probably content marketing, or marketing or a website. And you know of the XML sitemap and the XML sitemap. For those of our listeners that don’t know, this is a structured text file that is used by search engines to get an idea of all the pages on the website on how they’re structured.

Per Axbom
You might call it a table of contents or a site index. There’s a link to all the pages on your website. So,

James Royal-Lawson
Yeah, and it’s an it’s structured in a way, which is a bit like, it’s code it’s XML.

Per Axbom
It’s not made for humans, though. It’s just made for –

James Royal-Lawson
Not made for humans directly, no. I’ve been nagging for years about it being included a standard on websites on that. Yeah, more and more websites do have it, especially where they’re in the space of e-commerce and consumer sites. Other websites that are maybe more informational or public sector, they don’t always have these still and it’s still a thing I have to nag about.

But historically, so what’s what’s fascinating here is that the XML sitemap, that got introduced by Google in I think it was 2005, when they first first introduced the standard because up to that point, we had a website’s sitemaps, an actual page for people to visit where it visually showed the hierarchy, the structure of a website.

Per Axbom
Often linked in the footer.

James Royal-Lawson
Often linked to the footer – it sometimes used to be in the top menu as well, back in day, we’ve had different places. It moved around a bit as it came in and out of favour about how complex they were, how big your site was, and so on. But Google back in the early days, had already discovered that this was a really good page to look at, to get more pages to look at. So they were consuming the sitemaps that we were making for humans to improve and build their index.

So it was in their interest to create something, a standard, that was more for machines. And that’s when they launched the second sitemap xml standard, initially into the and then they built it, they more formalised into that the sixth time, I think. But what’s fascinating here is that the sitemaps that we put on websites back in the end of the 90s, and like 2000s and so on, those in themselves were an offspring, I guess, of the site mapping we would do as part of information architecture work and exercises.

And understanding and categorising the the website and forming the hierarchy or the hierarchy that was needed for a website in information architecture. There’s three different flavours, I guess, of these sitemaps. There’s the one that’s a research tool. There’s the one that is consumed by machines to get an idea of our content and then there’s the the one that’s used. As part of our design work.

Per Axbom
Well, that made me think even more exactly. If it’s a research tool, then it can also be a deliverable to a team to help them design something. So there’s many uses for the for the sitemap actually. I think I first came across a sitemap and learned about them in the polar bear book, which people our age will know exactly what book I’m talking about. It’s information architecture for the World Wide Web, by Lew Rosenfeld and Peter Morville, which came out in February 1998.

So even then writing a book about sitemaps, back then meant that sitemaps had been around for a while. So the concept of doing this, in this way, as described in this article, has been around for nigh 30 years. That is perhaps why we react the way we do. But it doesn’t take away from the usefulness of the tool, which is a good thing to actually talk about.

James Royal-Lawson
Yeah. And there are so many related tools as well. I mean, yes, the content marketing here is trying to get people to use some of the tools that are might help you but we’ve we’ve done card sorting as a way of testing structures. You know, you’ve got various ways of building them. Didn’t you have an example of a picture of how Netscape back in the day would create them automatically?

Per Axbom
That was actually from the polar bear book.

James Royal-Lawson
Is that from the Polar Bear book?! They had a screenshot from Netscape – that was the biggest browser back then. Or once upon a time at one period of time during our world wide web travels. And you actually generated the sitemap automatically from a website, they built that tool inside the browser.

Yeah. There’s some tips in the article about creating an effective UX sitemap. As I say, I did do some research too and it does seem like UX sitemap is a phrase that people are using. I had no idea about that. You know, for me it was a it was a sitemap, and I say sitemap and XML sitemap to distinguish between the two.

Per Axbom
That reveals our bias as well, because we come from another space or another timeline even, and people coming from another timeline perhaps are now calling them UX sitemaps.

James Royal-Lawson
Yeah, after I read these these tips about things it actually reminded me of, I mean, I’ve still got a pile of of webpages from almost 20 years ago that I printed out for a job I had back then. And I still haven’t got around to, in fact, I’m now deliberately keeping hold of them because I don’t print out webpages anymore but 20 years ago, I did. So I have a folder full of things about information architecture, taxonomy, sitemaps and stuff. And I was skimming through them when looking at these tips to see how good they are. And to be honest, I can see the the the good old aspects of information architecture shining through in these tips. So it’s not without value in that sense.

Per Axbom
But even then, as you were saying, you were using the word taxonomy. And of course, that’s the whole thing. And then the reasoning behind this of categorising and labelling everything that information architects are so good at, that takes a special kind of skill. And I think acknowledging that skill set is also important. It’s not really something that anyone can jump into without also having sort of the background about understanding, why do we do taxonomy?

James Royal-Lawson
Yeah. So again, back to this article, maybe scraping the surface and hinting at deeper knowledge. And I don’t know whether the article itself understands the deeper knowledge. So we’ve got then a gap in education, or whether it deliberately avoids the deeper knowledge because it’s aimed at a certain audience that doesn’t need it. But anyway these five tips. And if anyone’s out there studied information architecture, they probably can give us some feedback about how good this list is as well.

One of the tips, the key steps: One, start with good preparation, that you need a good plan, and you need to determine what users want and what you want to achieve with the website. It’s your goals, Per thinks. Number two, create a sitemap navigation. Create a draft with your site navigation, which for me, that’s makes sense because you would, like we said, information architecture – part of information architecture is site navigation. Sitemap is something else too. List parent and child pages, which is actually pretty difficult to avoid when you’re doing a site map.

Per Axbom
Exactly.

James Royal-Lawson
And test a few scenarios. So then you would, and this, this actually is what I mentioned with card sorting, you can use testing tools to find whether you can follow labels to find the right destination. You would test navigation structures by giving someone a task and click your way through to find the right place.

Per Axbom
And sometimes I actually I did a site map and I took all the cards for the pages and put them just in a random pile. And I could see if different teams or groups of people that I brought into workshops, what sitemap would they come up with using those cards? That was the card sorting exercise, and that was excellent.

James Royal-Lawson
Because yeah, that’s wonderful because that reveals different ways of grouping similar objects. Lovely IA exercise. And the fifth tip was share the sitemap with your team. So that you mentioned this about deliverables. So this tip here is basically using it as a deliverable. So I hope you get what I mean about saying that these five points for me, they kind of they hint at deeper knowledge. And they’re kind of skimming the surface of a whole world of information architecture out there. And I’m hoping that we can lift that bar a little bit and get a bit more knowledge around these areas and topics.

Per Axbom
Yeah, definitely.

James Royal-Lawson
And not just say that UX Sitemaps are new, and sitemap xmls have been around for ages. Because then I worry for information architecture.

Per Axbom
Yeah. But it’s also something that we’ve talked a bit about on the show, I think more recently, as well, in the last year, about how information architecture is sort of this forgotten part of UX. Almost that we pushed it aside with UX and information architecture, people calling them information architects, at least in Sweden, it’s not very common anymore.

James Royal-Lawson
Yeah, we’ve talked about this and there the whole relabeling and new labels for things and UX has eaten up so many other labels, but that doesn’t change the underlying knowledge. In some ways. I don’t care if you call it a UX sitemap or a sitemap. I can maybe sound like an old man if I’m complaining about him saying it a UX sitemap is a new concept.

Per Axbom
Or that a UX sitemap is sometimes called information architecture, sort of.

James Royal-Lawson
I mean I can accept that. That’s my personal reaction from my context and my history of where I’ve been and where I’ve come from, and it might be correct for them. But I’d still like us to be able to in an open and constructive way, pick up these things and bring them forward. I’m hoping we’ve managed to do that now without being overly critical.

Per Axbom
Because again, I mean, there’s a reason we talked about it, because actually, it’s not a tool I’ve been using a lot. And I haven’t reflected on why I’ve abandoned it in the last few years. I’ve gone more and more towards, of course, I’ve become more senior, I don’t work hands on in that way anymore. But I don’t see any of my team doing it. And I don’t teach people how to do it anymore. So it’s been down for some years, and it’s getting picked up again. So it was interesting to see it being picked up and talked about in this way.

James Royal-Lawson
Definitely. And just like, actually, both of these articles today. They’ve both generated a lot of discussion between me and you and a fair bit of googling, research, checking, reminiscing, thinking back, connecting different concepts, going back to concepts. So, criticism aside and middle aged old men aside, these are really two very stimulating articles today.

Per Axbom
Yes. Today, we also want to play a bonus clip for you. We reached out to Information Architecture, educator and author Donna Spencer, to briefly help us out in understanding how sitemaps fit into our work. Donna Spencer has practised Information Architecture at the highest levels for more than two decades. She has taught innumerable workshops and courses and of course, wrote one of the highest recorded books on the subject, a Practical guide to information architecture. This is what Donna had to say about sitemaps as a tool.

Donna Spencer
Hello, I’m Donna Spencer. And I’m a UX designer, Information Architect, product designer, whatever we’re calling ourselves these days, who has been doing this kind of work for a very long time. Per and James asked me to take a look at the article about UX sitemaps and talk a little bit about them. So first, this article literally starts off with UX Sitemaps are new. UX sitemaps really, really, really, really, really, really aren’t new. We’ve been doing sitemaps, like I reckon I probably did my sitemap in 1998. And even then, it wasn’t a new technique. So let’s talk about what a sitemap is. We actually don’t usually call them UX Sitemaps, they were always just called sitemaps.

But a sitemap is something that you would create usually for a fairly simple site. Like this doesn’t work for, you know, an enormous catalogue, or, you know, a museum site for a full collection, it usually works mostly for relatively small content based websites. And a sitemap is a really simple diagram that shows what content will be included in the site. And the relationships between content items. Sitemaps are usually fairly hierarchical, we’ve usually got a homepage, some top level pages, and some-to-many, hierarchical pages underneath that. 

And sometimes we might do things like you know, show some cross references between key pages, but we’re not trying to show every link between things or trying to show them or the main structure. Look, this is a super simple, a diagram. It doesn’t need to be fancy. It’s not hard to create as a diagram.

The hard thing, of course, is to figure out how to structure the content, what things go together in what bundles. Sometimes it’s hard to figure out what to label them so that they’re both representative of the content and help people find content that they need. That’s actually the hard bit, drawing it out as a diagram is pretty is pretty straightforward.

They’re not always really well understood by our stakeholders. They often need some explanation, because people are used to seeing like screens and navigation, looking at an abstract diagram, you know, sometimes just needs a bit of explanation as to how this relates to a thing that you’re going to build. And they’re usually done early on in a design process. While you’re working through the thinking stage, mostly, as you actually work through a production stage of a process, things change, and you don’t necessarily have to go back and update the sitemap. It’s usually just a thinking tool at the beginning and often to, you know, to show to your stakeholders where you’re thinking about what content exists and how to organise it.

Per Axbom
Thank you so much for helping us out. Donna. I, for one, am excited to hear about how some of our listeners use or will be using sitemaps going forward.

Per Axbom
And, of course, some more stimulating content. I think James has selected as per usual a show that we recommend listening next to.

James Royal-Lawson
Well, just can’t get enough of Donna Spencer.

Per Axbom
Yeah.

James Royal-Lawson
So I’m going to recommend, even though we’ve repeated it reasonably recent recently, if you haven’t yet listened to it, or you’ve listened to this later on, then episode 286 reintroduction to Information Architecture, with Donna Spencer is, as we say in Swedish, sol klot choice, of what to listen to – crystal clear choice.

Per Axbom
A sunny, clear choice.

James Royal-Lawson
Yeah, crystal clear I think you’d say.

Per Axbom
As always, the links to these articles can of course be found in our show notes on UX podcast.com. One of our teams of volunteers is one that listens to episodes ahead of publishing, and notes down relevant links that come up during the show. And this team could really do with some extra people. So if you’d like to help out email, hej@uxpodcast.com, or Swedish hej, or English hey, hej or hey.

James Royal-Lawson
Making stuff easy and difficult in the same time. Remember to keep moving and see you on the other side.

[Music]

James Royal-Lawson
What’s big, white, furry and always points north?

Per Axbom
I don’t know, James, what’s big, white, furry, and always points north?

James Royal-Lawson
A Polar bearing.

Per Axbom
Nice.

James Royal-Lawson
Thank you.