Recap & Website Critique

[00:00:00]
>> So let's sum up what we've said in this section about content and content creation. First of all, you've got to really understand your user and your user journey, right? Not make assumptions about who you think your users are and what they want, that leads to dangerous consequences cuz your assumptions are often wrong.

[00:00:21]
Secondly, you need to understand where the content that you're creating sits in the overall journey. Are someone just discovering about you for the first time or are they returning for the 50th time? Where does it sit in their experience of grabbing attention through to, making contact and purchasing, through to post delivery etc.

[00:00:47]
And then be clear on what you want the user to do, what are your calls to action? What steps are you gonna make? Have you simplified that down to a simple clear ask that anyone can complete? And then you need to build a value proposition around users and users needs, so that they understand specifically how it's gonna help them, how it's gonna benefit them, and how you're gonna go about delivering those benefits.

[00:01:17]
And then as you write your copy you need to write it in a clear, structured way that human. The rule of thumb I use, right, when it comes to writing copy is could I, if I'm sitting in a coffee shop with someone just chatting, right? Could I say that copy out loud to them and it not sound weird, right?

[00:01:41]
Too often the copy that we have the answers users questions, sounds so fake and it's not conversational and it's not human. Your copy has to be more human. Okay, should we talk a little bit about this as a sample site? If anybody's got suggestions for other sites they wanna look at, then I'm more than happy to talk about those as well.

[00:02:06]
But it's always good to look at our kinda practical example of this and see how some of those principles we've talked about so far apply in the real world. So, let's talk about this page. Advance your skills with in-depth, modern front-end engineering courses. Great, couldn't ask for better strapline than that, right?

[00:02:28]
It's got a very obvious benefit which is in bigger text, advance your skills. Brilliant, very clear how it's gonna benefit people. And it's also self actualization, they call it, improving yourself is one of the most attractive things for people in developed Western countries where their basic needs like food and that shelter are dealt with.

[00:02:52]
So we love the idea of improving ourselves, so great, strong strapline. And then add to that, the fact that it makes it clear, well what the thing is, right? So you can make a promise like advance your skills but if you're not also saying how you're gonna deliver that and through what mechanism, then you haven't made things clear.

[00:03:16]
Front-end engineering courses, brilliant, love it, can't fault that, great job. Then we get into things like calls to action. Calls to action, we've got a nice, simplified, two sets of calls to action, right? So there's not too many calls to action, not too much stuff competing for your attention.

[00:03:40]
But one of the problems, and I think I might even touch on this later, so apologies if I'm jumping around a little bit. One of the problems that they've just fallen into here is that we've got two calls to action that are actually very similar to one another, right?

[00:03:56]
That it's not immediately clear what the difference is between browse our courses and view learning paths is, right? And when you have two calls to action that are quite similar to one another, then it can cause paralysis, it can cause people not to choose or they choose the wrong option that gives them a false impression.

[00:04:19]
So it might be that having those two calls to action isn't really necessary at this point. Maybe we take them into one or the other to begin with and then have a secondary one that takes them on after that, so that you can control the journey a little bit more.

[00:04:35]
Because I mean, there's some great examples there. One of my all time favorites is Wikipedia, right? Wikipedia used to have a search box on their website, and then next to the search box they didn't have one submit button they had two. And the one submit button said search and the other one said go.

[00:04:57]
What's the difference? Now actually, one would search all of Wikipedia for whatever phrase that you just typed in. The other would go to this page specific to that particular phrase, right? But that's a very confusing and subtle difference that increases people's cognitive load. And we've got a similar thing here.

[00:05:21]
I'm sure the guys could easily explain the difference between the two, but it shouldn't need explaining. Now, then we've got some different languages here which basically it's a clever mix of features. In other words, it's showing that you have courses on these different subjects. But at the same time, it's a type of social proof actually.

[00:05:47]
It's kind of expert via association that these are things that people recognize. They might not have heard the Frontend Masters brand, but they have heard of node or react or any of these other ones, so it helps reassure them that the content is relevant and appropriate to them.

[00:06:05]
And then they've completely nailed the social proof side of things by pulling in testimonials straight from Twitter. Which means you know that they're real testimonials, right, and that they're completely reliable. So very good use of social proof there. Join now and learn straight from the experts who shape the modern web, okay?

[00:06:34]
Yeah, again, really a call to action with a strong button. But we are lacking some objection handling here. Because with this kind of thing there are gonna be a lot of questions that are associated and its going for the join now, quite quickly. Now admittedly, you've got a different call to action that's going on up here.

[00:07:00]
But it might be good to take some of the types of courses, admittedly you're kind of showing a bit of an overview here. But have some content blocks showing some different types of courses to give us a feeling of all the different content that's there. You might wanna give an indication of pricing, right?

[00:07:17]
Especially when you get to the Join Now, right? If I click on that what's gonna happen? Will I suddenly be expected to part with my credit card? Here we go, so now we're getting into the pricing at this point. Well, perhaps that needs to be brought up to the homepage, so that there's a decision being made there.

[00:07:39]
Then we've got a load of fields like you'd pretty much except, but maybe that needs to be chunked, broken down into a series of steps. So it doesn't feel to like quite so many overwhelming number of fields that are available there. There's some interesting stuff going on here as well from a design perspective.

[00:07:59]
So, for example, getting someone to repeat their password, isn't necessarily the best way of doing it cause you're doubling the amount of data entry they have to do. Maybe you wanna instead just show them, allow them to view their password with the little toggle thing. And that works very well because it's reducing the amount of data entry which on mobile devices is particularly important.

[00:08:25]
And then the credit card stuff, maybe we wanna move that off on to a different page, right? And the reason being is cuz it makes the form feel more accessible and less work involved in it. And better still, that if they fill in this information get to the point of making a transaction and then don't do it for whatever reason.

[00:08:46]
Because they've already submitted the first part of the form we've got their email address, which means that we can send them a follow up saying we noticed you didn't finish entering the data, is there anything we can do to help, right? And then finally, CAPTCHA is evil and it should never be on a website and I'd fight anyone who disagrees.

[00:09:05]
So, there you go, there's a little bit about Frontend Masters. Does anybody else want to share a site or should we move on and then maybe look at another site a little bit further down the line? Actually while if anybody wants to recommend a site pop it into chat now.

[00:09:24]
But in the meantime, I just wanna show you a nice example of content blocks in action, right? So this is Stripe's homepage which I love, I think it's a beautifully designed one. And, again, they do a lot right on this site, I think it's worth pointing out. So they've got a nice clear strap line again, payment infrastructure for the internet.

[00:09:45]
But notice how we're beginning to get content blocks, heading, small piece of copy, links, image. And if we scroll down, heading, piece of copy, link, image underneath. Scroll down more, heading, block or copy, link, sociated image. They've even nested one content block inside another in this, so that's kind of one.

[00:10:10]
And then you've got these two smaller ones inside. So we've got image, heading, there'll be a copy, link, done it again there. And their whole page is built up in this way, here it is again. And notice how easy that is to scan and how engaging it is.

[00:10:27]
Because if all I do is read the world's most powerful and easy to API. I know all I need to know without having to read this, but if I want that detail, I can read it. And if I want even more detail, I can click through to the documentations and drill down into the detail of it.

[00:10:46]
This is good, engaging, well structured, content that leads me through. And notice, again, we've got value proposition, social proof, all right? Then we start to get into features, fully integrated suite of products, API, and then more features again going on here. So is it's a very well structured, and then showing that they've got the capacity to deal with it feature, feature, feature.

[00:11:19]
What they are lacking is benefits, they don't talk a lot about benefits. And in some ways Frontend Masters does a better job at that in its value proposition on the homepage.
>> What's your thought on those super long sales funnel pages that go on and on and finally end with a single call to action button at the very bottom of the page?

[00:11:41]
>> Yeah, they're very interesting, it's an old form technique that predates the internet by many, many years. They are very effective for a certain audience in a certain situation. They work less well on the web, I'm actually working for a client right now that uses that as a technique.

[00:12:04]
And what you can do is, is you can combine kind of more modern techniques with that to create quite powerful solutions. So the way that you normally do it in that situation is you have what I would call a standard landing page to begin with. Where you have value proposition, summary of the offering, call to action, benefits, features social proof.

[00:12:29]
But then it goes on into the long-form stuff after that with the call-to-action repeated multiple times down the page in my experience, with the various social proof alongside the calls to action and some objection handling. That's one way of dealing with it. My preference however, if it's an organization that focuses on long form marketing like that, is actually you have a very condensed landing page where the call to action is to sign up for emails.

[00:13:01]
And then you drip feed them the information that would have been in the long form piece over a series of days via email. If you've ever read the book, Launch, that takes a similar approach using email. And it's basically taking the principles of long form marketing and spreading it over a number of days via email to achieve the same result.

[00:13:21]
If I was on my own computer I could actually show you a landing page that I've created with that, but unfortunately it's not available on this machine unfortunately. But yeah it's got its place, but if you're gonna go long form then it's really, really important to make it scannable, which leads nicely into the next section we're gonna look at which is design.