Transcripts
1. Intro: Why Are Landing Pages Important: Hello, everyone. My name is Jack Zerby and today we are going to learn how to make an insanely effective web page. What goes in to making an insanely effective web page? Now, I have some notes here and if you see me reading, it's because I want to make sure that I get every single point across. I want to make sure that I can bring the most value out of this class. A lot of these things I'm just going to make sure that I get. Let's start out with some questions. First, why are landing pages so important? A landing page may be be the first time anyone, that person has seen or heard of your product or your service. This is the first time you get to make an impression and like they say, you only get one chance to make a first impression so you have seconds to convey what your product or service does. I ask another question: What is the purpose of a landing page? It's to inform a qualified customer, qualified is the keyword and we'll get into that. Exactly what your product or service does. I say qualified because all of the copy on your landing page should be directed at a specific target. If I'm selling hamster blankets, and you lead my site immediately because you're not interested in hamster blankets, then my landing page has actually done its job. That's because the landing page should capture the attention immediately of the people who are interested in hamster blankets. If you craft the right message, and speak their language, they are more likely to read every single word. The question in my head is, how many words will they read? Dan Kennedy, a legend in the direct marketing industry. If you ever seen those big, long web pages with a ton of copying, you're thinking, "There's no one who ever reads that stuff." Well, he said that, "Significant research has been done which indicates that readership falls off dramatically at 300 words and doesn't drop off again until 3,000 words." That means some people will read up to 300 words and drop off, but some people are reading up to 3,000 words. That is amazing. It really tells me that if you're speaking their language and talking the right way and they're interested, they may read all 3,000 words. If you look at the next question, what is the goal of a landing page? It's to get a direct response for things. A click, which may be to go to another page, to watch a video. A purchase is pretty obvious, you want them to buy something. Permission, it's to get information, whether it's an email, an address, some sort of contact information. A referral means that they could forward it to a friend. It could be a Like button, it could be a Tweet button. Seth Godin says, "Don't let someone leave without doing one of the above." This awesome picture, there's a couple of tips that I'm going to give you as you're writing your copy. There's this guy, Nova Ba Dora, and he writes for Apsuma. He writes all those awesome emails, I don't know if you ever got those emails from Apsuma. But they're pretty amazing, they're pretty effective. He talks about writing casually, not obnoxiously. So when you're writing your copy, you want to sound like you're having a conversation just like we are now. If I was reading verbatim off of my notes right now, it will get pretty boring after a while and if I was talking in such a corporate way, it just would not be interesting. You don't want to be an idiot. You want to write casually as if you were talking to one person. I found a quote from Joe Sugarman, who's the guy from the BluBlocker, he's the guy who sold those awesome BluBlocker sunglasses. He said that, "Every communication should be a personal one from the writer to the recipient, regardless of the medium used." That means, and I've heard it said before, write to one person, don't write to the masses. Write as if you were having a conversation with one person.
2. 7 Important Elements of a Landing Page: So what we're going to talk about in the first half of the class are seven important elements to a landing page. One the headline. Two, call to action. Features and benefits. Credibility. Social proof. Risk reversal, and frequently asked questions. Let's get started.
3. Headlines: First, we're going to talk about headlines. Headlines are the most important thing. Let's go through what is a headline. I pulled out three legends of copyrighting that say almost the same thing about the purpose of a headline. Eugene Schwartz said that the purpose of a headline is to get them to read the second line, the purpose of the second line is to get them to read the third line, the purpose of the fourth line and on and on and on and on. Joe Sugarman said that all the elements in an advertisement are primarily designed to do one thing, and one thing only: to get you to read the first sentence of the copy. Michael Fortin and said that a headline is meant to do to vital things, no more, no less. First, it needs to grab the reader's attention and the headliner's second job is to pull the reader into the copy. So why is a headline important? David Ogilvy, one of the godfathers of advertising, said on average five times as many people read the headline, has read the body copy. The headline, obviously very important. Gary Halbert said, "How important are headlines? I'm glad you asked. I myself, have read headlined ads and increase their pool," which means, I guess, conversion in web terms, "by 475 percent." Here is a client who pays him $195,000 a year just to write headlines. He said he spends more of his time writing headlines than anything else he does. How do I write an effective headline? This stuff when I first started learning, it was just amazing. I'm thinking, I never really took headlines seriously, but once I started learning some of this stuff, it was really helpful. There's this guy, Dane Maxwell, he's not on an old guy and the marketing industry, he's a pretty new young guy, but he is amazing. He's learned from a lot of these guys. Here's a formula that says, "To create an effective headline, you take the end result that the customer wants, the benefit, a specific period of time plus objections equals a headline." So you look at dominoes, this was done in the '80s and it's still going. People still think that this is the rule that dominoes has. I don't even know if it's still in effect, but it says, "Hot fresh pizza delivered to your door," that's the benefit, "in 30 minutes," that's the time frame, "or it's free." That's the objection because the natural objection is well, what happens if they're not there in 30 minutes? Realtors will use this one, Dane talked about this one. He said, "Your home sold," the benefit, "in 90 days," the time frame, "or I'll buy it," which is the objection which what happens if you don't sell it? Well, we'll buy it. Here's another one. You can mix these up. You don't have to have all three in. Dane talks about having all three is great, but you don't have to have all three and you don't have to have them in the right order. This one starts out with the time frame, "In one hour, learn the copywriting systems that will double your conversions." That's really just about the time frame and the benefit. If you look at, this is a perfect example of a landing page that is using two of the things, so it's create a landing page, which is the benefit, in minutes, and that is the time frame. Here's another one, which is the astonishing power of eye tracking technology, the benefit without the high costs, which is the objection at the end, that looks like something that would cost a lot, they addressed the objection, right in the headline. This one, learn web development in 12 weeks. The benefit, what you're getting, learning web development, and then the time frame at the end in 12 weeks. There's another guy, Michael Fortin, I love his blog and I'll put it in the class notes. He has two of his favorite ways to write headlines. One, he calls it the gapper formula. It's really to create a gap between the problem and the solution. He said that, "A headline that communicates a problem, for example, a painful situation or potentially painful one, that may arise without the benefits of your offer will have more impact." He talks about the pain-pleasure principle that Abraham Maslow states that, "If given the choice between pain and trying to avoid it or getting pleasure, they're going to take avoiding pain almost all the time." This is a great one from LessAccounting. The pain is that, all small business accounting software sucks, that's the pain, we just suck the least. I love that. This is another one from Harvest, "Because time tracking should be easy." Their audience may think, and I think too, that time tracking is sometimes a real pain, and so they're addressing that pain by saying that time tracking should be easy and there's a lot of curiosity built into that. The other one that Michael Fortin talks about are triggers. He said ask yourself, does my opening statement or a headline beg for attention and genuinely cater to the dominant motives and emotions of my market? These are some of the ones that I took. There was a ton of them. I just took some of them. Let's say we're creating a budget app. Let's say we have a budget app, we're trying to create a headline, using curiosity, we can say find out how we save John $1,000. That creates a lot of curiosity. Fear is a good one. A budget that can help you prepare for the worst. That may strike fear. I don't know how I feel about that one, but you can say also with pain, sick of spending hours creating a budget. Creating a budget is a pain in the butt. Convenience. We make budgets easy. This one's a really popular one and I'm going to give you a big folder of landing pages that I found that are great. A lot of them used the word easy. I think convenience and laziness must be popular because everybody wants to make things easier. So laziness, is the same thing, create a budget with little effort. Greed is an effective one as well. Boost your income by more than 317 percent when you do such and such with our budget software. Appealing to pride, power, ego, manage your budget like a millionaire, manage your budget like Donald Trump, on and on and on. Another one, assurance. This is where you can do what we're going to talk about later on, which is a risk reversal saying and less than 60 days guaranteed. That guaranteed word is very powerful. It creates an assurance in your headline. The last one, anger. This you can use like the 99 percent thing or it's, the banks are ripping you off, here's why. That's also a very effective one. Eugene Schwartz wrote the book Breakthrough Advertising. This book is amazing. I tried to get a copy on eBay and they go for $500 because they're out of print. He has some pretty amazing things on what to do when you're stuck writing a headline. He has a couple, and there was a ton of these, I'm going to go through a couple of them. The first one is measure the size of the claim. 37signals, they're masters at landing pages. Here's one for Basecamp. Last week, 6,565 companies signed up for Basecamp. This is a very powerful number per week. Yeah, last week, per week, that's very powerful. They're measuring the size of the claim. DocuSign. More than 27 million people trust DocuSign for an e-signature. That's a ton of different principles packed into one headline. That's a risk reversal, that's using social proof, but it's also measuring the size. 27 million people, that's a lot of people. This is another one, measuring the size of 14 million sites can't be wrong. It's a little bit vague. This is probably not as effective a headline that they could use for this. It's from AddThis. The other thing you can do is measure the speed of the claim. Poll Everywhere they'll say, "Instant audience feedback." That's speed. Using emotional words like instant, that can be very effective. Compare the claim. This one I love from Kissmetrics and I've learned a lot from Kissmetrics and their blog. This one says, "Google Analytics tells you what happened, Kissmetrics tells you who did it." They're saying that Google Analytics is just going to give you some basic data, but Kissmetrics is really going to get into the people behind who's visiting your site. I thought that was a really effective headline. Demonstrate the claim with an example. This one didn't appear in the actual headline, but it did appear in the subheadline. It says, "We keep your wallet from leaking by helping you compare, manage your insurance, save 96 minutes and $362 on average." That's showing a very specific example right in the headline or the subheadline. State the claim as a question. I found two great ones for this. 1Password, this is the app. Have you ever forgotten a password? I think everyone can relate to this headline. It's also got a lot of pain. It's also appealing to a lot of pain that people have with forgetting a password. RescueTime. I use this app, I love it. This is the question that I've asked. Am I really spending my days the way I want to? RescueTime tracks your time and what you're doing on your computer and then let's you know that you're wasting your time on Facebook. But it's a really great headline. It's in a really great way to create curiosity by asking a question. Stress the newness of the claim. This one can be a little bit vague. Next generation banking. You've got to watch the buzzwords when you're using cutting edge and things like that. But if you do it right, you can do it effectively. Stress the exclusivity of the claim. This one, LivePlan. Write your plan with the number 1 business planning company. This is really the only one I could find that was actually using exclusivity. I'm not sure who votes for the number 1 business planning company, but you can do something that you can provide in your headline, what your unique value is, what your unfair advantage is, using that exclusivity. If you're the only one that has a certain technology, then you can really bring that out in your headline. This is another one that was very interesting about where you put the most interesting part of the headline. I think when I was looking here, there was a doctor, Flint McGlaughlin, and he said, "The worst approach is to bury the most valuable phrase, in the middle. Readers will invest in the first few words. If they don't find something valuable, you've lost them." If you look at a front loaded headline, "Get paid," that's the most valuable part of the headline and it's right there in the beginning. A back loaded one would say, "Take online surveys from home and win cash and prizes." Well, win cash and prizes, that's the key word, but they put it way at the end of the headline. I looked at Giftly, it's an okay headline, but if you look at a revolutionary way to give great gifts, they could say, "Give great gifts in a revolutionary way." Now, they have a front loaded headline, which I think might be a little bit more effective. Lander. It's very front-loaded. It's actually very effective. Design landing pages that work no pain, just gain. It's a little bit obnoxious, but whatever. It is very front-loaded. Design landing pages that work. That's the unique value. Let's apply it.
4. Call To Action: Next we're going to talk about call to action. If you really want to sound cool, you can say CTA. I worked in advertising for a little bit and everybody's like, "Hey man, what's the CTA?" It's like it's pretty lame. What is a call to action? It's to tell the reader or the viewer, the visitor what to do, how to do it, and when you want them to do it. Yes, that specifically. From those direct marketers, and I'll get into it later, they're very specific, they want to hold your hand throughout the whole process and get you to do exactly what they want you to do. So creating a call to action, how do you do it? Well, there is a great technique that Google uses, and I found this from an interview with [inaudible] , the guy I talked about before from AppSumo. He said he was working on his landing page, and he had a friend from Google who was there with him and he said, "Hey man, what do you think of this page?" The guy from Google steps back a couple of feet from the computer and he's like, "No, it's not big enough." He's like, "What's not big enough?" He goes, you don't have a big, he used the F word, but he's like big freaking button. Google's technique is to use a big freaking button, and if you step back from your monitor and it's not clear what exactly you're supposed to do, then it's not apparent enough. Sometimes I'll squint my eyes and blur out my screen to make sure that I know what is the actual call to action. Here's a big freaking button. Here, I'm not sure what landing page this is, but there's a giant yellow button. It is very clear what they want you to do. Now the see some demos" above it, that might be a little tough because now there's also a call to action there. I would probably do something else there, but they do have that big giant yellow button. For Mailjet, it's very clear, they have one big fat button that says "Get started now", it's yellow, it's obvious what they want them to do. Then there's a little arrow that said it's free up to 6,000 emails a month. This one is really great, Buy now for just $49." That is a big, huge, freaking, pink button. For me, this was one of the most interesting things that I've learned as I've studied this, especially from direct marketers about being specific and then taking what they used to do in direct mail and actually applying it to the web. So the goal is don't just say sign up. I think a lot of people, and I've looked through a lot of landing pages, and some people just say sign up, or get started, or it's free, or whatever. That's not very clear. I mean, yeah they want you to sign up, but sign up for what? So if you can be very specific, those call to actions would be a lot more effective. You can see here Milewise, they say "Start tracking your rewards." That is exactly what you're going to be doing. Once you click that, that's the next step, that's exactly what they want you to do. For here, Poll Everywhere, instead of saying sign up now which a lot of people will do, they say "Create your first poll". Very specific, very effective. Rapportive, "Add Rapportive to G-mail". Now, some people get rich contact profiles right inside of G-mail. It's obvious that it works with G-mail. They could have just said like sign up, but they said add Rapportive to G-mail. Yes, it may sound repetitive, but that's an effective way to do it. Be very specific to what you're call to action is. Here's another one from Tinfoil security, "Get your free scan now." Very specific as to what they want you to do. Well, let's apply it.
5. Features and Benefits: Next up is features and benefits. Features and benefits are a little bit tricky. When you're writing about the features that your software, or service, or whatever has, sometimes people will get caught up in talking about all the features that their product has. A lot of times just say, "Okay, that's fine. Your software has this, this, and this. What does that mean to mean?" That's what we're going to go through here. What is the difference between a feature and a benefit? Michael Fortin has a blog post where he talked about he taught a class and the textbook that he's using, the guy went into detail about how to describe a benefit. If you look at a benefit, it actually has four different layers to it. Features are what the product has. You could say this accounting software has a reporting feature. Yes. That's not very exciting. If I saw that on your site, I can be like, "Okay, that's great." The advantages are what these features do. You could say, "Reporting provides real-time, on-demand, updated mission-critical information to key personnel." It's a little bit buzzy already, but you can see it's just, "Okay. What do these features actually do? You told me what it is, but now what does it do?" The motives are what motives do the features satisfy? You could say, "This feature satisfies cost savings, a greater control, increased production, better decisions," on and on. Now when you get to the actual writing the benefit, you can combine all these things and say, "With this powerful reporting feature," that's what it is, "they're able to keep their finger on the company's financial pulse at all times," that's an advantage, "thereby reducing costs as much as 50 percent." That's the motive, "Now increasing their output by 10-20 times, avoiding making decisions that could cost them thousands if not millions of dollars." That is what the feature means. Now it's a very effective way to say, okay, this question here, he said, "What this means to you is." Anytime you're writing about the feature, keep asking yourself about your customer, "What this means to them. What this means to them is." You can just keep going down the line until you can't get anymore, and really is just about, what does it mean to the end user? As long as you can avoid just listing off all of your feature, it's going to be a lot more effective when you're talking about what it means to them. Let's apply it.
6. Credibility: Credibility. How do you display credibility on your landing page? It's pretty straightforward, so there's not a lot I can talk on. What are some ways to display credibility? It's pretty straightforward. In Goodsie, I used a lot of the quotes that we've gotten from certain press. Just the logo and an interesting quote from this, and this displays a lot of credibility. Time Magazine has a lot of credibility. Mashable has a lot of credibility, Business Insider, and you can see I just grabbed a lot of other people do the same thing. The other one from Twitter, this one Chris Sacca, who is just an amazing investor. He said, this Optimizely increases conversion by 49 percent on a $250 million site. That's a big endorsement. That says a lot of credibility. Here you can see they're almost all the same. I really like if you look in the bottom left corner, how Kissmetrics does it, and he says join these great companies by signing up today. A great call to action, very specific, and it talks each customer's success. These are people that are actually using the product, not just people who have written about it. It's one thing to just write about it from people who have actually used it. That's even more credibility. There's another technique. I'm not sure how I feel about it, but you can use quotes or facts from established sources that may not even be using your product. You can say, Coca-Cola, you have a survey app. Let's say, you could say Coca-Cola uses surveys to find out what their customers want. We offer an easy way to service or to survey your own customers. Coca-Cola is not really a client of yours, but Coca-Cola understands the value of surveys, and you provide surveys. Take what you will from that one. Now let's apply.
7. Social Proof: Proof in the power of testimonials. Then we're going to talk about also the impact of data using social proof. Testimonials, first one, the reverse testimonial. So traditional testimony start off with praise, then continue to even more praise and reverse testimonial takes it and flips it on its head. It starts with the skepticism first, and then goes through to what they, actually, thought of the experience, the positive part. This was from a Copyblogger, that had a great blog post on testimonials and they say, "You know that the fancy looking, that over-priced restaurant? Well, we went there last night," and you're expecting them to be like, "Oh, man, it really sucked." But and they said it was delicious and the bill was far less than we expected. That testimonial draws you in because you think, "Wow, why are they putting such a negative review on their site," and then you realize, "Wow, actually, this is a great review." So that's the reverse testimonial. Here's Dane Maxwell. Again, I think he has a great formula for testimonials. So if you get a testimonial, as long as it's okay with the person who gave it, you can mix up the wording if you want, and as long as they're okay with it, to make sure that it's in the proper order to get the most attention. So you can say the specific or you can even ask them be like, "Hey, can you give me a testimonial in the following structure?" It's not like it's not correct. It's just written in a different way. So if you say the specific end result or customer benefit, plus the time, plus the accompanying feeling that they got, and then the person's name with their stats to make sure this isn't Joe Blow. This is someone who actually uses the product or someone who is of high stature, someone you could actually believe. So you look here, this is one example Dane gave. It was an agent. He said, "I saved $200 per month alone in the file folder in savings." That's the benefit. He took three days. Now, he can be home with his baby son. The freedom is incredible. That's the feeling that he got. At the end, his name and then what he actually is is in the top 10 RE/MAX agents in the world, so that's a pretty big deal. I went through a lot of the different landing pages examples. You can see here, they use them a lot. Almost every landing page that I saw, the good ones had some testimonial. So you can see here are three different examples of testimonials on a landing page. The one thing that Dane had mentioned is use these testimonials everywhere. So he said use them on a signup page and you can see Visual Website Optimizer. They're using it on the signup. So even when you go to signup, you're still seeing some more social proof which is very effective. So you can use it in a bunch of different spots throughout your site. So the next thing is the impact of data, the impact of pure numbers, which are really important when you're trying to get this social proof across. Again, here's AddThis, 14 million sites can't be wrong. Sites, meaning people. Somebody had to sign up for AddThis, and 14 million is a pretty big number, so that it has a pretty big impact social proof was. Basecamp, same thing that I talked about before, 6,565 companies, huge number they signed up for. That's a lot of proof that they've come across there. This was another great one. I think this was an aweber.com. So as you're signing up, they say "Who's joining AWeber?" I don't even know if this is actually, dynamic or not, but you could make it dynamic and it would be really effective. You can see someone in India signed up two minutes ago, someone signed up eight minutes ago, nine minutes ago. Especially for consumer apps, that can be really effective. It means that people are actually using it and signing up as you are signing up. So let's apply social proof.
8. Risk Reversal: This was a phrase that I heard over and over again when I was learning about these direct marketing guys, Gary Halbert talks a lot about this risk reversal, and Jay Abraham, who was another guy in the marketing industry that talks about risk reversal. Now how do we take risk reversal and apply it to landing pages? This is a great cartoon, how about this motto:" If you are unhappy for any reason, we will feel really bad". That is not good enough as a risk reversal or a guarantee, but sometimes I think we all feel that way on some level. Offer a guarantee to let the customer know the risk is on you and not them. So I'm going to focus a lot on guarantees when I talk about risk reversals. Jay Abraham talks about three ways to reverse risk. The first way is a total monetary risk reversal. A lot of times people will say, your money back, that sort of thing, and the most famous one of these is Zappos. Gary Halbert talks about the more crazy you can get your guaranteed to be a lot more effective. So Zappos, that's a really crazy free returns, free shipping 365 days a year. Tony Hsieh talked about, there's a very small percentage of their customers that actually would return shoes on day 364, but it's so small that it's worth the effect and this saying," Look you have an entire year to return these shoes." That's a really powerful risk reversal that Zappos uses. You can also use risk reversal right in the call to action, you can say by now for just $49, 45 day money-back guarantee, usually people will say 30-day money-back guarantee. They're saying 45 day money-back guarantee. It's a little bit more than the average guarantees, so I think it's a little bit more effective. The second he talks about is better then total risk reversal. So you can say for Giant, they say double money-back guarantee, and before in the example with the real estate agent where it's like, "Look, I'll sell your home in 90 days or I'll buy it. " That's a pretty big guarantee, and so same with Giant double your money back guarantee. That's a pretty big guarantee. Now, if you don't have a monetary way to give someone a guarantee or a risk reversal, an emotional risk reversal is just as powerful. TurboTax, they really have to focus on this because this is taxes, and people take this really seriously because they're giving a lot of personal data away, and you can see audit support, you are covered in case of an audit, a lot of people were worried like what happens if I get audited, what are you going to do? Also 100 percent accurate calculations guaranteed it's over on the right, and then 100 percent confidence, that's not even very specific, but I think it really reinforces the fact that like," You're okay. If you use TurboTax, you're okay, and you can be confident in what we do." Basecamp when you go, look at the top, sometimes this switches around when you refresh, time-tested since 2004 and trusted, that is emotional. It doesn't really have anything specific, just is time-tested in trusted since 2004. It's a form of a risk reversal saying, " Look, we've been around since 2004. It's okay." Federal Express, this is the legendary one. It's like when it is absolutely necessary positively has to be there over night. That was a huge deal when FedEx first came out with that overnight delivery. So that is a perfect example of an old school risk reversal. So the other thing is to let them know how much time and effort it takes to get started. A lot of times people think, how much investment is going to take from a time point of view? So you can put this right on your landing page, if you look down at the bottom where it says see pricing and sign up, you can say take two minutes and set up your books. It's not going to take you three hours, just take two minutes. There's not a big time risk here and set up your books. Here's another one from contextually, it said right in the call to action, five-minute setup click here to get started. They couldn't just put, click here to get started, but they really want to reinforce the fact that it only takes five minutes to get set up. Let's apply risk reversal.
9. Frequently Asked Question: Frequently asked questions. This one's another one of those straightforward ones. I've found a lot of effective landing pages will have frequently asked questions and so what it would do, it will cut down on a lot of common support questions, if you find yourself getting the same e-mail over and over and over again, put frequently asked questions on the landing page and it'll save them a lot of time and they may not even reach out to you, so you may lose them. So it'll cut back on that Crazy Egg, they do it right on their landing page. Will Crazy Egg decrease your site's performance? A lot of these questions, something tells me they kept getting them over and over and over again. If you put them right on the landing page, you'll cut down a lot of that people get their answers right away. Poll Everywhere. They frame a lot of their features and benefits in the form of a question which could be an FAQ. So what is Poll Everywhere? How do people use it? How much does it cost? Who uses it? What are people saying? They're using credibility and using frequently asked questions format. Right here it's very plain FAQs. Who should use Blinksale? What do I need? How will clients receive my invoices? A lot of times people will put this on a separate page, they're landing page but there's no reason you couldn't just put it right upfront. Now you don't want a thousand FAQs but a couple of the most important ones can be really effective. So let's apply frequently asked questions.
10. Rule of Three: Now that we've talked about copywriting, we've talked about the important elements of a landing page and what to put in it and all the different elements of an effective landing page, None of that will be effective if you don't understand the design principles behind taking all of that stuff and making it come together and making it effective. If you talk about the rule of threes, what is the rule of three? This is one that I've recently discovered that's really interesting and it's almost conspiracy-theorish, it's really interesting. What is the rule of three? Well, three is the smallest number required to make a pattern. There lies its power. In many forms, the rule of three at heart utilizes simple three element patterns to communicate complex ideas effectively. This pattern works because it is short, memorable and powerful. What are some examples of the rule of three? This was amazing. A lot of the most powerful slogans in the world are using the rule of three. Just Do It, I'm Lovin' It, Diamonds are Forever, Finger Lickin' Good, my favorite one, Snap, Crackle and Pop. I didn't realize that until I put them all together. The master of the rule of threes. I read in an article that Steve Jobs, that's all he did in a lot of his presentations. They were all formed around this rule of three. This is when he was talking about the iPad and visually he talks about it's between the phone and the laptop, it sits right in the middle. So that's three elements. He is describing this concept using the rule of three. Also when he talked about 16, 32 and 64, this is the different levels of the iPad, which I thought was really interesting that he divided it up into three. Now like I said before, it's a little bit conspiracy-theorish but that's okay. You can see that Steve Jobs, one of the most amazing presenters, always used this rule. This was also interesting in Hollywood and in plays in theater, there's a three-act plot structure. Act 1, the setup; act 2, confrontation; act 3, resolution. Very interesting that they're using this to convey a story line. This was also interesting. The reason why we're going through all this is when you describe what your product or service does, if you can do it in threes, they're going to remember a lot of those things and that's what you want them to do. If you look at Homeland Security, can you imagine how many times they have to tell people to do this? So they do it in threes; show ID, take out the liquids, take off your shoes. After you do it a while, you understand those are the three things that you really need to do and you need to hurry up because everybody gets mad. How does this work in a landing page environment? If you look down at the bottom, three reasons to love Lander; more conversions, test and optimize, and reach any device. Those are three main benefits. They talk about three reasons to love Lander. It's very obvious that they're using the rule of three. You can see here, share and discover the best of the web. So they have blog tools, browser tools and analytics and so those are divided up into three. It's very easy to consume that and understand it and remember it. Here's another one, why choose Tinfoil? Down the bottom. Recurring, affordable and a proven record. Those are three main things that they want you to remember. Here's another thing, it's not as obvious but if you look at Protect Your Money, those are three bullet points that they put right underneath the headlines. That's also another effective way to use the rule of threes, that you can put it right under your headline, three of the main things that you want them to take away from your landing page. This is another one, direct mentorship, social learning and lifetime access. Those are obviously the three things that they want to portray the most that are the most important for the viewer to take away. Here is another example. A lot of these use the same design here. You can see what is Bottlenose? Bottlenose Pro, Try Bottlenose Search. The headlines, they're a little bit vague but you can see it's divided up into three. Let's apply the rule of threes.
11. Visual Hierarchy: Visual hierarchy, as far as design goes, that is the most important thing that you need to have on the landing page. There's a great article from this site, 52weeksofux.com. The way that they described why hierarchy is important, they talk about there's a pecking order to things. There's an order to which what you are creating, you want the viewer to read in the specific order that you want them to read. They talked about, just like a great writer starts with an interesting lead in act one, it sends you breathlessly into the next act and into the next act. They're leading you through a series of things in the order that they want you to go through therein. How do you create a hierarchy? There's four things. There's a couple of other things, but I'm just really going to focus on four, which I feel are the most important, so size, color, contrast, and alignment. I did this test with my wife last night, she's not a designer. I just said out of the blue like, "Can I go through these concepts with you?" Here's an example of hierarchy using size. You can obviously see, what is the thing that sticks out to you the most? Which circle sticks out to you the most? It's the biggest one, the one on the top left. Now, using the same pattern, the same circles, and the same size, now what happens? Now, the red one sticks out. Regardless of size, now you're using color to do that. The next one is contrast. Now you have a gray background. You've taken the same circles and you've put a white background behind the top-left circle. Same size circles, but now you have a different level of contrast between the black and the white versus the black and the gray. Here's another example of alignment. You've taken the same size circles, aligned them differently, and now the top one stands out the most. Taking that concept, how do you test hierarchy? You take a site like Apple, they're brilliant at this. They always have the right hierarchy. They really want to lead you through the story of the product. You look at the iPad Mini, you read the headline first, you look at the image second, and then you go through on three, where you can download and watch the video or watch the TV ads. Then you go down to four, which are the other things that they want to talk about, the iPhone 5, the new iMac, the new iPhone TV ad. If you look at the headers, yes, they're different in size, but look at the consistency in color. You can see iPad Mini is the main header, and then the second level headers are iPad, the new iMac, iPhone 5, watch the new iPhone TV ad. You can see that using color and size, all four of those headers are now on the same level of visual hierarchy, and the headline is obviously number one in their hierarchy. Then you can look that using just color and size on the bottom as well, but you can see in color, those are the secondary things that they may want you to read, and just using a different contrast and a different color, that's how they communicate that visual hierarchy. Same thing with Dropmark. You can see the first thing you're going to look at is the image, it's huge, it's got a lot of contrast. First thing, then you go down to the headline. Then actually, sometimes it's subjective, you can see down where the logos are. You may go to that next, or you may actually go down to where the features are, and then maybe go back up to where the logos are. Maybe they didn't actually do as good of a job visually. I'm not sure what their goals were, but if they did want me to read in that order, that's fine. But you can see here they're doing the same thing that Apple did. They have the visual hierarchy using color to create a commonality between the headers using the same color, but then they differentiated them using size. You see Drag & Drop and Collaborate With Your Team, they want them to be read on the same level, with the headline being number 1. They did the same thing that Apple did, by the secondary text being the same color, and I believe it's the same size. So if you look at that, that's the secondary thing that they want you to read next. Rdio. If you look here, the image is very bright, it gets your attention first. Followed over to the headline, human power music discovery. Then I may go back down to number 3, and then up to the code action on number 4. Like I said before, this is very subjective. There is eye tracking technology, you can actually see, I don't know how expensive that is, but you can see what people are looking at, and that's how you can tell if your visual hierarchy is effective. You can see here, they've used size to convey the top-level header. Then you can see the secondary header, they've used the same size and the same color. Then the third thing that they may want you to read based on size, so the navigation is the same size, as the body text underneath these sub-headers. They've created consistency there. Amazon, well, the thing about Amazon is when people come to Amazon, they usually know exactly what they want. So they just go up to the search bar and search for it. Their homepage, I don't see any visual hierarchy anywhere. Everything is on the same level. There's a million different headers. There's a million different colors. It's a complete mess. I can't really bust on Amazon because they do really well. So maybe this works for them, but as far as visual hierarchy, it's very weak. This is my favorite one. These guys actually do a lot of business, but their hierarchy is way off. I'm not really sure as a designer that this gives me a heart attack, but I'm not really sure what's going on here visually. Everything sits on the same hierarchy. This one is pretty insane. Let's apply visual hierarchy.
12. Passive and Action Colors: When you're talking about conversions and clicks, like what you want them to do and what the goal of a landing page, remember I talked about before, it's to get a click, it's to get a referral, any of those things. How do colors come into play? I've read a ton of articles about, "Well, maybe a blue button works or orange links convert better than blue links," and all this stuff. You can go the whole way through all these articles and at the end they're like, "Well, we don't really know." There was a blog post in a video on socialtriggers.com by this guy Derek Halpern. He's the one who introduced me to passive and action colors. Derek is also a young guy, but he's learned a lot from these old-school direct marketing guys. He talks about the Von Restorff effect. He said there was a psychiatrist named Von Restorff, studies what's known as the Von Restorff effect, also called the isolation effect. It predicts that an item that stands out like a sore thumb is more likely be to remembered than other items. So Derek talks about what stands out gets remembered, what blends in gets ignored. You want to pick one action color that all the links on your page have, or one action color that your call to action is and do not use that color anywhere else on your landing page. Derek said the biggest mistake is sometimes people have a green button like this. So imagine if there was a green sub-header down at the bottom where there was a green image or a green something else then it starts to confuse the viewer as to what is an action color and what is a passive color. In GroupMe, they've use green and only used green for that call to action. Now, there's another call to action up at the top right-hand corner login maybe they could have made that green. But they chose to say, "Look, the only color green. Green is going to be the only color of what we actually want them to do on the call to action" so it's a very effective. If you look at Harvest, the orange is a little bit bright. It is not as a passive of a color as I would have used, but if you can see, "See Plans and Pricing" that's green and they don't use green anywhere else. Except for I just noticed down on Harvest-Go, there's a little green arrow down there. Now, that may be another call to action that they want to use. But you can see green only means click, green only means go and do something. So you can see here at KISSmetrics, I think this is a lot better example. So you can see get me started with KISSmetrics down at the bottom and then start your free trial. They don't use that color green. They do not use that color green anywhere else on the page. It's very effective and you can see that the passive colors, they use a lot of purple and dark colors, but really only use green for those action colors. So Work Smarter, BestVendor you can see sign up to see what others use. That's the yellow button. You can see there sign up and then you can also see sign up on the top right. Now, one thing I did notice is if you look at the right-hand side where it says, "Manage your finances, Improve your design, Win more customers," that yellow is a little bit too close to the call to action color, so I probably would have made that another color. So you have to be really careful. Sometimes the designer, whoever is designing your landing page, may think you're overreacting. But if you can be very specific and only use that color for actions that you want them to take only, then that is the best way to approach call to action and colors. See the look at Chargify. This one is very obvious. It's a giant red button. Now, there is one place that they go wrong. If you look at some of the links are green, but they also use green in the sub-header. I probably wouldn't do that. If you look also green is the color of the tab at the top. So they're mixing action colors with passive colors, and that's not as effective. Fortunately, they have that big red button, so I think it overrides all that stuff, but they may want to watch using green for links and also for other design elements. Contactually, very good. They use a green button, they don't use it anywhere else. Little bit of the green button in the image that they're showing there, but I think that's okay. But they're using green only for that call to action and it looks they're using blue only for text links. Very effective. You can see Customer.io. They use a pink button. Nowhere else do they use pink. Again, they're using the Von Restorff effect. That pink button is going to get remembered because it stands out. Now, let's go apply passive and action colors.
13. AIDA - Attention, Interest, Desire, Action: This is a bonus, and this has nothing to do with landing pages. But what happens when you put an opt-in email input on your landing page and somebody gives you their email address, how do you communicate with them? We're going to talk about this formula called AIDA and how it applies to writing emails. Every direct marketer I've researched is always talking about AIDA, and I took this copywriting course on Mixergy, which I can put a link to. It was Andrew Warner interviewing Neville Medhora from AppSumo who I've talked about before. He talks about how he used this at AppSumo and these emails that he writes have resulted in over 100 percent open rates which means people are going back and opening these emails 5, 6, 7, 8 times, which in the email industry is unheard of. If you get like a seven percent open rate, that's good. You get over 100 percent open rate, that is amazing. He's got to be doing something right and he's using this AIDA formula, what is AIDA? First A in AIDA is attention. Neville talks about in an email contexts, it's the subject line. The subject line is where you need to grab their attention. He talks about these short, provocative subject lines, and so here's some of my favorites: The simple framework for emails that get to yes. A great one, I'll be sad if you miss this Backblaze deal, and you can read them. How we killed a wantrepreneur, that's one of my favorite ones. I walked in my apartment and my iMac was gone. These are really attention-grabbing subject lines. The next letter is I, interest. You want to introduce facts to get them interested. You've got their attention, and now you want to interest them with some facts. With this one app they were promoting called Kernest, which is a font service that gave you fonts, like complimentary fonts. He said, ''Did you know that Steve Jobs was originally obsessed with typography?'' That's an interesting fact, it got me interested. Forty three percent of web designers have no idea how to write copy, so offensive, gets me interested. I put this last one, the hamster blanket business is $3.1 billion industry. Those are some interesting facts to grab my interest. Next one, the third letter is D for desire. You want to make them envision themselves getting that particular benefit. If they have this product, how will their life get better? With Kernest he talked about, ''Remember that time your last client was not satisfied with your last font selection? With Kernest they'd explode with happiness.'' This is the desire. I want my clients to explode with happiness. The last A is action. You need to ask them to do something. You've got them through attention, you've got them interested, you've got them seeing themselves benefiting from what you're talking about. This comes from the direct mail guys as well, you need to be super specific. Neville says, ''If you'd like to impress the hell out of your clients then first click below, then go to PayPal,'' and he goes on through very specifically the steps that you need to do. Gary Halbert, he gets really specific. He says like, ''Pick up the phone and call my secretary, and then she'll tell you to do this, and then get an envelope out and put a stamp on and do all these things." It's very interesting to see that that is actually very effective. When you learn this formula, you start seeing everything differently. I got this letter in the mail the other day and I told my wife, "This is so awesome," she's like, ''Oh, you're such a nerd.'' I'm like, "No, this guy is using AIDA in this direct mail copy." I just usually would've thrown this away, but I can see here, he's getting my attention. New Jersey is like no other state in the country, and if you live in New Jersey, I get it, that's right. New Jersey is like no other state in the country. He got my attention and sometimes you don't have to do it exactly in the order, but he got me thinking the desire, this is why I'm proud to be part of a company which offers New Jersey residents like you the opportunity to keep more the money you earn. Okay, fine, that's great. That's the desire, I want to keep more of the money, and then it gets me interested by talking about some facts. It gives me the ability to choose who I'm buying my electricity supply from, and he's talking about they buy electricity directly from the wholesaler at dynamic day-to-day pricing. He's giving me some facts to get me interested. This is where I knew right away this is definitely the call to action at the bottom, three easy steps. He didn't just say go sign up, he said find a copy of your utility bill, call our number, then sit back and begin enjoying our lower energy rates. A little bit cheesy, but you can see he's walking me through, step by step, very specific. This guy, whoever wrote this letter, knows what he's doing, he was using the formula for AIDA. Next time you write an email, if you follow AIDA and you say, you get their attention with a really attention-grabbing subject line, and then you give them some facts, and then you get them to picture themselves using it, and then you ask them to take action, you have to tell them what to do. If you just write an email with no call to action, it's not as effective. A lot of these guys will put the call to action at the bottom of the email, and they'll only have one call to action. They don't have the million links in email, just one. From the emails that I've sent out, I can see that as I add more links, the percentage of those clicks go down. You just want to have one link, one call to action, and that is AIDA.
Jack Zerby, Design at Gumroad
